1

我想根据 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>

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

4

2 回答 2

1

I guess this is what you're looking for. I've tested it and the background color changes for a split second. Basically you had one minor error: Duration is supposed to be hh:mm:ss.fff but you set 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>
于 2013-11-23T07:44:35.120 回答
1

对于简单的颜色更改,故事板似乎有点过头了。我将绑定背景颜色并为价格创建一个 IValueConverter,它只是跟随价格的 NotificationChanges。

我建议使用 IValueConverter 绑定到 Price 的 Background 元素并隔离那里的着色逻辑......

Xaml

<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);
   }
}
于 2013-11-01T17:43:18.403 回答