WPF为gif效果旋转加载图像

问题描述：

我在wpf中有一个静态加载器图像，我可以通过使用WPFAnimatedGIF nuget包轻松地将它用作加载gif，但它看起来像是一种矫枉过正。WPF为gif效果旋转加载图像

我的应用程序中只有一个场景需要显示忙碌指示符。

没有什么可以触发的，它是我窗口中的一个隐藏对象，并且在一定条件下它变得可见。因此，它应该始终旋转并显示为一个正常的动画加载gif。

我至今尝试过

<Image RenderTransformOrigin=".5,.5" Width="44" Height="44" Source="BusyIndicator.gif"> 
     <Image.RenderTransform> 
      <RotateTransform Angle="45" />     
     </Image.RenderTransform> 
    </Image>

形象地说，我现在用的就是

您可以使用永不结束的动画，但它有[缺点]（https://www.codeproject.com/Articles/ 49853 /更好-WPF的圆形进度条）。 – Funk

答

这种风格的动画一个RotateTransform在30个步骤的角度时，图像元素可见。

<Style TargetType="Image" x:Key="BusyIndicatorStyle"> 
    <Setter Property="Width" Value="44"/> 
    <Setter Property="Height" Value="44"/> 
    <Setter Property="Source" Value="BusyIndicator.png"/> 
    <Setter Property="RenderTransformOrigin" Value="0.5,0.5"/> 
    <Setter Property="RenderTransform"> 
     <Setter.Value> 
      <RotateTransform/> 
     </Setter.Value> 
    </Setter> 
    <Style.Triggers> 
     <Trigger Property="IsVisible" Value="True"> 
      <Trigger.EnterActions> 
       <BeginStoryboard> 
        <Storyboard RepeatBehavior="Forever"> 
         <DoubleAnimationUsingKeyFrames 
          Storyboard.TargetProperty="RenderTransform.Angle"> 

          <DiscreteDoubleKeyFrame KeyTime="0:0:0.1" Value="30"/> 
          <DiscreteDoubleKeyFrame KeyTime="0:0:0.2" Value="60"/> 
          <DiscreteDoubleKeyFrame KeyTime="0:0:0.3" Value="90"/> 
          <DiscreteDoubleKeyFrame KeyTime="0:0:0.4" Value="120"/> 
          <DiscreteDoubleKeyFrame KeyTime="0:0:0.5" Value="150"/> 
          <DiscreteDoubleKeyFrame KeyTime="0:0:0.6" Value="180"/> 
          <DiscreteDoubleKeyFrame KeyTime="0:0:0.7" Value="210"/> 
          <DiscreteDoubleKeyFrame KeyTime="0:0:0.8" Value="240"/> 
          <DiscreteDoubleKeyFrame KeyTime="0:0:0.9" Value="270"/> 
          <DiscreteDoubleKeyFrame KeyTime="0:0:1.0" Value="300"/> 
          <DiscreteDoubleKeyFrame KeyTime="0:0:1.1" Value="330"/> 
          <DiscreteDoubleKeyFrame KeyTime="0:0:1.2" Value="360"/> 
         </DoubleAnimationUsingKeyFrames> 
        </Storyboard> 
       </BeginStoryboard> 
      </Trigger.EnterActions> 
     </Trigger> 
    </Style.Triggers> 
</Style> 

... 
<Image Style="{StaticResource BusyIndicatorStyle}" />

为了避免使用动画与许多DiscreteDoubleKeyFrames，可以从DoubleAnimation是派生并添加Step属性：

public class DoubleAnimationWithSteps : DoubleAnimation 
{ 
    public static readonly DependencyProperty StepProperty = DependencyProperty.Register(
     nameof(Step), typeof(double), typeof(DoubleAnimationWithSteps)); 

    public double Step 
    { 
     get { return (double)GetValue(StepProperty); } 
     set { SetValue(StepProperty, value); } 
    } 

    protected override double GetCurrentValueCore(
     double from, double to, AnimationClock animationClock) 
    { 
     var value = base.GetCurrentValueCore(from, to, animationClock); 

     if (Step > 0d) 
     { 
      value = Step * Math.Floor(value/Step); 
     } 

     return value; 
    } 

    protected override Freezable CreateInstanceCore() 
    { 
     return new DoubleAnimationWithSteps(); 
    } 
}

你会使用这样的：

<Storyboard RepeatBehavior="Forever"> 
    <local:DoubleAnimationWithSteps 
     Storyboard.TargetProperty="RenderTransform.Angle" 
     Duration="0:0:1.2" To="360" Step="30"/> 
</Storyboard>

答

我知道这个问题已经有了答案，但有一个不同的方法H。只需使用进度，并设置IsIndeterminate为True：

<ProgressBar Visibility="{Binding IsBusy, Converter={StaticResource BooleanToVisibilityConverter}}" Style="{StaticResource MaterialDesignCircularProgressBar}" IsIndeterminate="True" Width="36"/>

风格是从Material Design In XAML Toolkit。有没有必要使用GIF作为繁忙的指标，我前段时间犯了同样的错误

WPF为gif效果旋转加载图像

相关推荐