ControlTemplate Storyboard颜色动画问题

本文关键字：问题 动画 颜色 Storyboard ControlTemplate | 更新日期: 2023-09-27 17:50:17

我有一个彩色动画的问题。这是我的来源:

 <Window.Resources>
    <hedit:BrushToColorConverter x:Key="BrushToColorConverter" />
    <Style x:Key="MyButtonStyle" TargetType="Button">
        <Setter Property="OverridesDefaultStyle" Value="True"/>
        <Setter Property="Margin" Value="5"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <ControlTemplate.Resources>
                        <Storyboard x:Key="buttonAnimIn">
                            <!-- Problem line -->
                            <ColorAnimation Storyboard.TargetName="bntBack" Storyboard.TargetProperty="Color" To="{Binding Path=Foreground, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}, Converter={StaticResource BrushToColorConverter}}" />
                        </Storyboard>
                        <Storyboard x:Key="buttonAnimOut">
                            <ColorAnimation Storyboard.TargetName="bntBack" Storyboard.TargetProperty="Color" To="Blue" />
                        </Storyboard>
                        <Storyboard x:Key="buttonAnimForegroundIn">
                            <ColorAnimation Storyboard.TargetName="btnFore" Storyboard.TargetProperty="Color" To="Blue" />
                        </Storyboard>
                        <Storyboard x:Key="buttonAnimForegroundOut">
                            <ColorAnimation Storyboard.TargetName="btnFore" Storyboard.TargetProperty="Color" To="Red" />
                        </Storyboard>
                    </ControlTemplate.Resources>
                    <Border Name="border" 
                        BorderThickness="1"
                        Padding="4,2" 
                        BorderBrush="DarkGray" 
                        CornerRadius="3">
                        <Border.Background>
                            <SolidColorBrush Color="Blue" x:Name="bntBack" />
                        </Border.Background>
                        <ContentControl HorizontalAlignment="Center" VerticalAlignment="Center" Content="{TemplateBinding Content}">
                            <ContentControl.Foreground>
                                <SolidColorBrush Color="Red" x:Name="btnFore" />
                            </ContentControl.Foreground>
                        </ContentControl >
                    </Border>
                    <ControlTemplate.Triggers>
                        <EventTrigger RoutedEvent="Button.MouseEnter">
                            <BeginStoryboard Storyboard="{StaticResource buttonAnimIn}" />
                            <BeginStoryboard Storyboard="{StaticResource buttonAnimForegroundIn}" />
                        </EventTrigger>
                        <EventTrigger RoutedEvent="Button.MouseLeave">
                            <BeginStoryboard Storyboard="{StaticResource buttonAnimOut}" />
                            <BeginStoryboard Storyboard="{StaticResource buttonAnimForegroundOut}" />
                        </EventTrigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>

问题是:

无法将属性'Style'中的值转换为'System.Windows.Style'类型的对象。不能冻结这个故事板时间轴树以便跨线程使用。对象"System.Windows.Controls"出错。按钮'在标记文件'HLSLEditor;组件/主窗口。

当使用固定颜色时，它可以工作，但它不能与父元素的前景色一起工作…

我如何做一个动画的前景或背景颜色?

谢谢!

ControlTemplate Storyboard颜色动画问题

你不能冻结绑定，你可以通过声明一种颜色作为资源，然后在动画中使用StaticResource时将控件的背景绑定到它来解决这个问题。

。

<Window.Background>
    <SolidColorBrush Color="{DynamicResource Background}"/>
</Window.Background>
<Window.Resources>
    <Color x:Key="Background">Green</Color>
</Window.Resources>

<ColorAnimation Storyboard.TargetProperty="Foreground.Color"
                Duration="0:0:1"
                To="{StaticResource Background}"/>

选择使用资源类:

public static class MyColors
{
    public static Color MyHighlightColor = Color.FromArgb(255, 0, 88, 0);
}

<ColorAnimation Storyboard.TargetProperty="Foreground.Color"
                Duration="0:0:1"
                To="{x:Static local:MyColors.MyHighlightColor}"/>

我认为理解错误可能会给你一个解决问题的方法。

Animation需要使用UI线程之外的线程。所以故事板必须是可冻结的，这意味着故事板中的所有动画都必须是可冻结的，这些动画使用的所有内容也必须是可冻结的。

绑定是不可冻结的——从定义上讲，它是一种可以改变依赖属性的机制。你不能在彩色动画中使用动态绑定——当动画运行时，属性可能会发生变化。无论你是绑定到一个对象还是使用DynamicResource，都会发生同样的事情。

问题是，这是在保护你免受你根本不想要的东西的伤害。你不希望动画运行时颜色发生变化。这不是你想要完成的。如果用户选择了不同的皮肤，你希望动画使用的颜色资源改变。

因此，不要将故事板绑定到可蒙皮的资源，而是将故事板添加到当蒙皮改变时设置的资源字典中(使用静态绑定来设置颜色)，并在事件触发器中使用动态绑定。应该可以了

当我遇到这个问题时，我通过修改样式来解决它，将两个相同的元素放在彼此的顶部-一个用于"正常"状态，一个用于"按下"状态。"按下"按钮的Opacity默认设置为0，另一个按钮的Opacity默认设置为1。我的动画将不透明度从0更改为1，反之亦然。

这种方法避免了实际动画化Color属性，但在保持XAML的同时产生了相同的效果。由于颜色是在样式定义中设置的，而不是在动画中，因此可以根据需要绑定它们。这可能不适合所有的情况，但对于我的简单风格，这是一个非常快速的方法来达到预期的效果。

相关文章：