不平滑DoubleAnimation

Question

我正在使用DoubleAnimation進行縮放和平移進出地圖。我的地圖是一張分辨率很高的圖片（15,000 x 8,438）。問題是，在第一次的縮放動畫是很動搖和不順利，在第二次它了好轉等。我怎樣才能讓我的動畫更加平滑或執行它，也許用動畫的其它形式之前使圖像或動畫的一些兌現？

我的代碼：

namespace AnimationTest 
{ 

public partial class MainWindow : Window 
{ 
    ScaleTransform transP; 
    TranslateTransform trans2P; 

    DoubleAnimation animP; 
    DoubleAnimation animYP; 
    DoubleAnimation animXP; 
    TransformGroup myTransformGroupP; 

    public MainWindow() 
    { 
     InitializeComponent(); 

     transP = new ScaleTransform(); 
     trans2P = new TranslateTransform(); 

     myTransformGroupP = new TransformGroup(); 
     myTransformGroupP.Children.Add(transP); 
     myTransformGroupP.Children.Add(trans2P); 

     animP = new DoubleAnimation(1, 20, TimeSpan.FromMilliseconds(3000)); 

     animXP = new DoubleAnimation(0, -14000, TimeSpan.FromMilliseconds(3000)); 
     animYP = new DoubleAnimation(0, -4000, TimeSpan.FromMilliseconds(3000)); 
    } 

    private void button1_Click(object sender, RoutedEventArgs e) 
    { 

     image1.RenderTransform = myTransformGroupP; 
     transP.BeginAnimation(ScaleTransform.ScaleXProperty, animP); 
     transP.BeginAnimation(ScaleTransform.ScaleYProperty, animP); 

     trans2P.BeginAnimation(TranslateTransform.XProperty, animXP); 
     trans2P.BeginAnimation(TranslateTransform.YProperty, animYP); 

    } 

} 
} 

Answer 1

我還沒有嘗試過你的動畫方法，我試圖實現我自己的邏輯到這個。

首先，我從Picasa使用的縮放動畫中獲得靈感。所以我試圖實現類似類型的動畫，這工作正常，我在我與10000x5000圖像尺寸的Core 2 Duo處理器，沒有任何延遲。 這種方法消耗了大量的內存，但是當我與Picasa ImageViewer相比，我的內存使用它幾乎是相同的。這種方法可能會增加應用程序的加載時間，但這可以在這裏處理，而不是問題。

這是我使用的主窗口網格的代碼。

<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="Auto" /> 
     <RowDefinition Height="*" /> 
    </Grid.RowDefinitions> 
    <Button Grid.Row="0" Height="30" Width="100" Content="Zoom" Click="ButtonZoom_OnClick" /> 
    <Image RenderOptions.BitmapScalingMode="HighQuality" Stretch="Uniform" Width="100" Height="100" Grid.Row="1" 
      Margin="30" VerticalAlignment="Center" HorizontalAlignment="Center" Source="mad1.jpg" Name="ImageMain" 
      x:FieldModifier="private" /> 

</Grid> 

按鈕的Click事件代碼

private void ButtonZoom_OnClick(object sender, RoutedEventArgs e) 
{ 
    Task.Factory.StartNew(() => 
     { 
      var i = 0; 
      while (i++ < 100) 
      { 
       var i1 = i; 
       //var i1 = (-0.00092)*(i*i) + (0.092)*i + 0.2; 
       Dispatcher.Invoke(new Action(() => 
        { 
         if (i1 < 10 || i1 > 90) 
         { 
          ImageMain.Height += 0.5; 
          ImageMain.Width += 0.5; 
         } 
         else if (i1 < 30 || i1 > 70) 
         { 
          ImageMain.Height += 1; 
          ImageMain.Width += 1; 
         } 
         else 
         { 
          ImageMain.Height += 3; 
          ImageMain.Width += 3; 
         } 
        })); 
       Thread.Sleep(30); 
      } 

     }); 
} 

此代碼中的註釋行是一個平滑的動畫加速和動畫的加速二次方程。計算開始縮放0.2和2.5時的基數，並在[0-100]範圍內停止0.2。如果你想創建完全自定義動畫您可以使用WolframAlpha來檢查你的動畫圖。但簡單的方法是使用簡單的控制語句來控制您的動畫。

這個代碼僅用於縮放你的形象，你的方法將是放大了類似。

Answer 2

你想使用緩存組成。使您的地圖，分配BitmapCache到CacheMode參數屬性和RenderAtScale設置爲一個值大於1，如果放大到地圖的5倍，因爲它緩存圖像這種類型的變焦，你應該使用RenderAtScale這個值。 這可能導致更高的內存消耗，但可以平滑滾動。

更多Nolonar可能是正確的。您可能需要爲圖像創建mipmap，並提供圖塊渲染以部分加載顯示的圖塊，因爲圖片非常大。

Answer 3

您是否看過微軟的DeepZoom技術（這是他們用於Bing Maps的）？ http://msdn.microsoft.com/en-us/library/cc645050(v=vs.95).aspx#deep_zoom_examples

Answer 4

既然你還沒有表現出任何XAML，我會從最基本的嘗試 - 試圖將圖像元素減少位圖縮放模式RenderOptions.BitmapScalingMode =「低質」這樣的：

<Image x:Name="image1" 
     Source="huge-image.jpg" 
     Stretch="Uniform" 
     RenderOptions.BitmapScalingMode="LowQuality" /> 

請注意，這僅適用於您自定義.NET 3.0-3.5，因爲從開始.NET 4.0「LowQuality」設置已設置爲默認設置，因此您無需明確指定它。但是，如果你放大動畫仍然步履蹣跚，你可以嘗試從低質到更下最近鄰其中，according to documentation更改此默認縮放：

...在低質模式提供的性能優勢，當軟件使用光柵器。這種模式通常用於放大位圖。

此外，由於你是要告訴與質量的一些損失大的圖像，可能是更好的圖像上指定UseLayoutRounding =「真」或它的父元素，以提高圖像質量。