wpf - 如何避免 ControlTemplate 中的 Coloranimation 被应用到使用模板的每个对象

Question

我在 Style 的 ControlTemplate 中声明了 ColorAnimations。

它应该做什么：

每当鼠标悬停在对象上时，该特定对象的颜色都应该是动画的。

它的作用是：

每当我将鼠标悬停在其中一个对象上时，都会对应用样式的每个对象的颜色进行动画处理，即使激活动画的属性并未在所有对象上发生变化。

我之前尝试过的：

我尝试使用 Eventtrigger 而不是普通触发器，但问题仍然存在。我也尝试使用“名称”属性而不是“x：名称”，但这也没有帮助。也不使用 Storyboard.TargetName 而是 Storyboard.Target 并使用与 RelativeSource 的绑定来让它找到对象.. 当我将鼠标悬停在其中任何一个上时，仍然使用这种样式的每个对象都会被动画化

如果我使用 Setter 而不是 Storyboard 和 ColorAnimations 来更改背景，它会按预期工作。

样式

<Style x:Key="Fraction_ScrollViewer_ScrollBar_Thumb" TargetType="{x:Type Thumb}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Thumb}">
                <Border
                    x:Name="Border"
                    CornerRadius="5"
                    Background="{TemplateBinding Background}"
                    BorderThickness="0" />

                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Trigger.EnterActions>
                            <BeginStoryboard
                                Name="IsMouseOver_True"
                                HandoffBehavior="Compose">
                                <Storyboard>
                                    <ColorAnimation
                                        Storyboard.TargetName="Border"
                                        Storyboard.TargetProperty="Background.(SolidColorBrush.Color)"
                                        To="{StaticResource 'Color_CoolGrey'}"
                                        Duration="0:0:0.2" />
                                </Storyboard>
                            </BeginStoryboard>
                        </Trigger.EnterActions>

                        <Trigger.ExitActions>
                            <BeginStoryboard
                                Name="IsMouseOver_False">
                                <Storyboard>
                                    <ColorAnimation
                                        Storyboard.TargetName="Border"
                                        Storyboard.TargetProperty="Background.(SolidColorBrush.Color)"
                                        To="{StaticResource 'Color_MidGrey'}"
                                        Duration="0:0:0.2" />
                                </Storyboard>
                            </BeginStoryboard>
                        </Trigger.ExitActions>
                    </Trigger>

Thumb 样式用于 ScrollViewer 中使用的 Scrollbar 样式。然后在 2 个位置使用 Scrollviewer 样式：

1：

<Style x:Key="LabelTreeView" TargetType="{x:Type TreeView}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type TreeView}">
                <ScrollViewer
                    Style="{StaticResource ScrollViewer}"
                    Focusable="False"
                    CanContentScroll="False"
                    Padding="4">

                    <ItemsPresenter />

                </ScrollViewer>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

2：

<ScrollViewer
                    Style="{StaticResource ScrollViewer}"
                    HorizontalScrollBarVisibility="Disabled"
                    VerticalScrollBarVisibility="Auto">
                    <ItemsControl
                        BorderThickness="0"
                        Background="{StaticResource Brush_Transparent}"
                        ItemTemplate="{StaticResource CharacterSequenceChar}"
                        ItemsSource="{Binding DisplayedCharacterSequenceCharacters}">

                        <ItemsControl.ItemsPanel>
                            <ItemsPanelTemplate>
                                <WrapPanel />
                            </ItemsPanelTemplate>
                        </ItemsControl.ItemsPanel>
                    </ItemsControl>
                </ScrollViewer>

是什么导致了这种行为以及如何在仍然使用动画的情况下避免它？

标签： wpfxamlstoryboardcoloranimation

Answer 1

显然，所有 Button 在其 Background 属性中共享相同的 Brush 实例。

您可以为模板中的每个边框显式分配一个单独的画笔：

<Border x:Name="Border" ...>
    <Border.Background>
        <SolidColorBrush Color="{Binding Background.Color,
                                 RelativeSource={RelativeSource TemplatedParent}}"/>
    </Border.Background>
</Border>