1

我是动画新手，我想将RadialGauge值从x更改为y，以使过渡更平滑。

例如，如果Value property changes from 0 to 100, I would like theRadialGauge` 在例如 250 毫秒内遍历所有中间值。

我怎样才能做到这一点？

注意：我正在使用 MVVM 并Value通过Binding. 我希望有一种方法可以在不添加代码隐藏的情况下做到这一点（最好仅限 XAML）。

我正在尝试使用隐式动画，但我不明白它们如何为属性的变化设置动画。我试过的代码是这样的：

<controls:RadialGauge Value="{Binding Status.Speed, Converter={StaticResource Speed}}">
    <animations:Implicit.Animations>
        <animations:ScalarAnimation ImplicitTarget="Value" Duration="0:0:0.3" />
    </animations:Implicit.Animations>
</controls:RadialGauge>
4

1 回答 1

1

例如，如果 Value 属性从 0 变为 100，我希望 RadialGauge 能够在例如 250 毫秒内遍历所有中间值。

您可以使用简单DoubleAnimation的方法来实现您的目标，如下所示：

<Page.Resources>
    <Storyboard x:Name="storyboard" >
        <DoubleAnimation Storyboard.TargetName="RadialGaugeControl" Storyboard.TargetProperty="Value" From="0" To="100" Duration="0:0:3" EnableDependentAnimation="True"></DoubleAnimation>
    </Storyboard>
</Page.Resources>
<Grid>
    <controls:RadialGauge x:Name="RadialGaugeControl"  Value="70" Minimum="0" 
Maximum="180" TickSpacing="20" ScaleWidth="26" Unit="Units" TickBrush="Gainsboro"
ScaleTickBrush="{ThemeResource ApplicationPageBackgroundThemeBrush}"
NeedleWidth="5" TickLength="18" IsInteractive="True">
    </controls:RadialGauge>
</Grid>

storyboard.Begin();

storyboard.Begin();通过这种方式，您至少需要调用代码隐藏。

我希望有一种方法可以在不添加代码隐藏的情况下做到这一点（最好仅限 XAML）。

如果您查看RadialGauge控件的源代码，该值是一个依赖属性，更改时针的角度发生了Value更改。您所说的“不添加代码隐藏”，我假设您可以使用一些XAML 行为 来启动动画，但它没有为您提供任何事件。我不认为它比调用更简单storyboard.Begin()。

您可以选择更改源代码并为其添加动画。Value更改时，将触发该方法OnValueChanged，您可以在其中启动动画。然后，您可以为“Microsoft.Toolkit.Uwp.UI.Controls”编译您的自定义版本并在您的项目中使用它。storyboard.Begin()但我认为这并不比在代码隐藏中编写一行代码更简单。

于 2018-11-12T08:03:39.797 回答