值更改时对文本框背景进行动画处理

Question

我想根据 ViewModel 中的新值对文本框（价格）背景颜色进行动画处理。

颜色可以根据新值而有所不同（大于 0 -> 绿色 - 小于 0 -> 红色）

我唯一能看到的动画是在启动时设置新值时。之后，动画将永远不会再出现。

<TextBox HorizontalAlignment="Left" Height="23" Margin="10,178,0,0" TextWrapping="Wrap" Text="{Binding price}" VerticalAlignment="Top" Width="120" x:Name="ChangeField">
    <TextBox.Style>
            <Style>
                <Style.Triggers>
                    <DataTrigger Binding="{Binding price, Converter={StaticResource formatter}}" Value="positive">
                        <DataTrigger.EnterActions>
                            <StopStoryboard BeginStoryboardName="pos"></StopStoryboard>
                            <BeginStoryboard x:Name="pos">
                                <Storyboard>
                                    <ColorAnimation  AutoReverse="True" To="Green" Duration="0:0:0:0.100" Storyboard.TargetProperty="(TextBox.Background).(SolidColorBrush.Color)"></ColorAnimation>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.EnterActions>
                        <DataTrigger.ExitActions>
                            <RemoveStoryboard BeginStoryboardName="pos"></RemoveStoryboard>
                        </DataTrigger.ExitActions>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </TextBox.Style>
    </TextBox>

价格

每秒可能会变化几次，因此我需要在设置新价格值时中止运行动画。

Answer 1

对于简单的颜色更改来说，故事板似乎有点矫枉过正。我会绑定背景颜色并为价格创建一个 IValueConverter，它只是跟随价格的通知更改。

我建议使用 IValueConverter 绑定到价格的背景元素并隔离那里的着色逻辑......

哈姆勒

<TextBlock x:Name="ChangeField" 
           Text="{Binding price}" 
           Background="{Binding price, Converter={StaticResource PriceToColorConverter}}" />

法典

[ValueConversion(typeof(decimal), typeof(Brush))]
public class PriceToColorConverter : IValueConverer
{
   public object Convert(object value, Type target)
   {
      decimal price;
      decimal.Parse(value.ToString(), price);
      return (price > 0 ? Brushes.Green : Brushes.Red);
   }
}

Answer 2

我想这就是你要找的。我已经测试过了，背景颜色在一瞬间发生了变化。基本上你有一个小错误：持续时间应该是hh：mm：ss.fff 但你设置了hh：mm：ss：??.FFF。

<TextBox HorizontalAlignment="Left" Height="23" Margin="10,178,0,0" TextWrapping="Wrap" Text="{Binding price}" VerticalAlignment="Top" Width="120" x:Name="ChangeField">
    <TextBox.Style>
        <Style>
            <Style.Triggers>
                <DataTrigger Binding="{Binding  price, Converter={StaticResource formatter}}" Value="positive">
                    <DataTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <ColorAnimation  AutoReverse="True" To="Green" Duration="0:0:0.100"  
                                                Storyboard.TargetProperty="(TextBox.Background).(SolidColorBrush.Color)"/>
                            </Storyboard>
                        </BeginStoryboard>
                    </DataTrigger.EnterActions>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </TextBox.Style>
</TextBox>