动画XAML列表框项目背景颜色

时间:2016-08-22 21:47:54

标签: wpf xaml

我有以下XAML,它显示了一个Summaries网格

<ListBox ItemsSource="{Binding Items}" Margin="336,60,10,63">
    <ListBox.Resources>
        <Style TargetType="{x:Type ListBoxItem}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding Status}" Value="1">
                    <Setter Property="Background" Value="Blue" />
                </DataTrigger>
                <DataTrigger Binding="{Binding Status}" Value="2">
                    <Setter Property="Background" Value="Green" />
                </DataTrigger>
                <DataTrigger Binding="{Binding Status}" Value="4">
                    <Setter Property="Background" Value="Orange" />
                </DataTrigger>
                <DataTrigger Binding="{Binding Status}" Value="8">
                    <Setter Property="Background" Value="Red" />
                </DataTrigger>
                <DataTrigger Binding="{Binding Status}" Value="16">
                    <Setter Property="Background" Value="Gray" />
                </DataTrigger>
                <DataTrigger Binding="{Binding Status}" Value="32">
                    <Setter Property="Background" Value="DarkGray" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </ListBox.Resources>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Vertical">
                <Label Content="{Binding DisplayName}" />
                <Label Margin="20,0,0,0" Content="{Binding CurrentState}" />
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <UniformGrid  Columns="4"/>
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
</ListBox>

目前,ListBox项的背景颜色是根据Status的值设置的,当值改变BackGround颜色正确变化时。

我想做的是Animate /从一种颜色转换到另一种颜色,因为状态值会发生变化。

我一直在这里搜索并遇到this post表示我需要使用

<BeginStoryboard>
    <Storyboard>
        <ColorAnimation Storyboard.TargetName="BackgroundGrid" From="Red" To="Blue" Duration="0:0:4" Storyboard.TargetProperty="Background" />
    </Storyboard>
</BeginStoryboard>

可能在我的<DataTrigger></DataTrigger>

问题1:我注意到的第一件事就是在上面的示例中指定了From颜色,但我不知道该项目从哪种颜色转换

问题2: <BeginStoryBoard></BeginStoryBoard>

中的<DataTrigger></DataTrigger>似乎无效语法

你可能会说这是我第一次使用XAML动画,所以任何帮助都会受到赞赏。

1 个答案:

答案 0 :(得分:2)

对于@Stewbob提到的第一个问题,不要在动画中包含From部分,它会正常工作。 您可以通过在DataTrigger上定义Enter和Exit Action来解决第二个问题,如下所示:

                    <DataTrigger Binding="" Value="True">
                    <DataTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <ColorAnimation> //your color animation </ColorAnimation>
                            </Storyboard>
                        </BeginStoryboard>
                    </DataTrigger.EnterActions>
                    <DataTrigger.ExitActions>
                        <BeginStoryboard>
                            <Storyboard>
                             <ColorAnimation> <ColorAnimation />
                            </Storyboard>
                        </BeginStoryboard>
                    </DataTrigger.ExitActions>
                </DataTrigger>

此处需要注意的一点是,EnterActions和ExitActions会永久设置值,而简单的Setter只会设置临时值,只要在触发器中满足属性条件即可应用这些值。