如何从实现它的控件启动在样式中定义的动画?

发布于 2024-12-06 04:15:23 字数 161 浏览 1 评论 0原文

我在名为“Error”的样式中创建了一个状态,并在故事板中附加了动画。

我希望能够在满足特定条件时从使用该样式的控件启动该动画。

例如,当我的 View 的 DataContext 中的属性设置为某个值时。

我究竟如何启动在控件的 Style 中定义的故事板?

I created a state in a Style named "Error" with an attached animation in a storyboard.

I would like to be able to launch that animation from a Control that uses that Style, whenever a certain condition is met.

For example, when a property in my View's DataContext is set to a certain value.

How exactly can I launch the storyboard defined in the control's Style ?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

暗喜 2024-12-13 04:15:23

在控件后面的代码中,只需执行以下操作:

Storyboard myStoryboard = this.FindResource("NameOfMyStoryBoard") as Storyboard;

if(myStoryboard != null)
{
    myStoryboard.Begin();
}

如果您的 Storyboard 未设置为资源但嵌入到您的样式中,请将其声明为资源并在您的样式中引用它。

MSDN 文档:故事板

In the code behind of the control just do

Storyboard myStoryboard = this.FindResource("NameOfMyStoryBoard") as Storyboard;

if(myStoryboard != null)
{
    myStoryboard.Begin();
}

If your Storyboard is not set as a resource but is embedded in your style, declare it as a resource and reference it in your style.

MSDN documentation: Storyboard

往事随风而去 2024-12-13 04:15:23

以下是使用触发器从 XAML 执行此操作的方法:

<Style TargetType="Button" x:Key="MyStyle">
            <Style.Resources>
                <Storyboard x:Key="MyGetFocusAnimation">
                    <DoubleAnimation Storyboard.TargetProperty="Height"
                                     To="50"
                                     Duration="0:0:.3" />
                </Storyboard>
                <Storyboard x:Key="MyLoseFocusAnimation">
                    <DoubleAnimation Storyboard.TargetProperty="Height"
                                     To="30"
                                     Duration="0:0:.3" />
                </Storyboard>
            </Style.Resources>
            <Style.Triggers>
                <Trigger Property="IsMouseOver"
                         Value="True">
                    <Trigger.EnterActions>
                        <BeginStoryboard Storyboard="{StaticResource MyGetFocusAnimation}" />
                    </Trigger.EnterActions>
                    <Trigger.ExitActions>
                        <BeginStoryboard Storyboard="{StaticResource MyLoseFocusAnimation}" />
                    </Trigger.ExitActions>
                </Trigger>
                <Trigger Property="IsKeyboardFocusWithin"
                         Value="True">
                    <Trigger.EnterActions>
                        <BeginStoryboard Storyboard="{StaticResource MyGetFocusAnimation}" />
                    </Trigger.EnterActions>
                    <Trigger.ExitActions>
                        <BeginStoryboard Storyboard="{StaticResource MyLoseFocusAnimation}" />
                    </Trigger.ExitActions>
                </Trigger>
            </Style.Triggers>
        </Style>

定义了上面的样式后,您只需告诉按钮要使用什么样式:

<Button Content="Content" Height="20" Width="100" Style="{StaticResource MyStyle}"/>

Here it is how you do it from XAML using Triggers:

<Style TargetType="Button" x:Key="MyStyle">
            <Style.Resources>
                <Storyboard x:Key="MyGetFocusAnimation">
                    <DoubleAnimation Storyboard.TargetProperty="Height"
                                     To="50"
                                     Duration="0:0:.3" />
                </Storyboard>
                <Storyboard x:Key="MyLoseFocusAnimation">
                    <DoubleAnimation Storyboard.TargetProperty="Height"
                                     To="30"
                                     Duration="0:0:.3" />
                </Storyboard>
            </Style.Resources>
            <Style.Triggers>
                <Trigger Property="IsMouseOver"
                         Value="True">
                    <Trigger.EnterActions>
                        <BeginStoryboard Storyboard="{StaticResource MyGetFocusAnimation}" />
                    </Trigger.EnterActions>
                    <Trigger.ExitActions>
                        <BeginStoryboard Storyboard="{StaticResource MyLoseFocusAnimation}" />
                    </Trigger.ExitActions>
                </Trigger>
                <Trigger Property="IsKeyboardFocusWithin"
                         Value="True">
                    <Trigger.EnterActions>
                        <BeginStoryboard Storyboard="{StaticResource MyGetFocusAnimation}" />
                    </Trigger.EnterActions>
                    <Trigger.ExitActions>
                        <BeginStoryboard Storyboard="{StaticResource MyLoseFocusAnimation}" />
                    </Trigger.ExitActions>
                </Trigger>
            </Style.Triggers>
        </Style>

After you have defined the style like above you simply need to tell the button what style to use:

<Button Content="Content" Height="20" Width="100" Style="{StaticResource MyStyle}"/>
指尖凝香 2024-12-13 04:15:23

我最终创建了一个类,它将保存所有控件的验证依赖属性:

public class ValidationProperties
{
     #region IsValid Dependency Property

    /// <summary>
    /// An attached dependency property which provides an
    /// </summary>
    public static readonly DependencyProperty IsValidProperty;

    /// <summary>
    /// Gets the <see cref="IsValidProperty"/> for a given
    /// <see cref="DependencyObject"/>, which provides an
    /// </summary>
    public static bool GetIsValid(DependencyObject obj)
    {
        return (bool)obj.GetValue(IsValidProperty);
    }

    /// <summary>
    /// Sets the attached <see cref="IsValidProperty"/> for a given
    /// <see cref="DependencyObject"/>, which provides an
    /// </summary>
    public static void SetIsValid(DependencyObject obj, bool value)
    {
        obj.SetValue(IsValidProperty, value);
    }

     #endregion IsValid Dependency Property

    static ValidationProperties()
    {
        // Register attached dependency property
        IsValidProperty = DependencyProperty.RegisterAttached("IsValid",
                                                            typeof(bool),
                                                            typeof(ValidationProperties), 
                                                            new FrameworkPropertyMetadata(true));
    }
}

在此之后,我修改了样式以根据使用该样式的控件的该属性的值启动动画:

(...)

<Trigger Property="AttachedProperties:ValidationProperties.IsValid" Value="false">
    <Trigger.EnterActions>
        <BeginStoryboard Storyboard="{StaticResource ControlIsInvalid}"/>
    </Trigger.EnterActions>
</Trigger>

(...)

我最终绑定了依赖属性在使用模型中值的样式的控件上(通过视图模型):

<TextBox x:Name="UsernameTextbox"
       (...)
       AttachedProperties:ValidationProperties.IsValid="{Binding SessionHandler.SessionUser.UsernameIsValid}"/>

I ended up creating a class that will hold all of my controls' validation dependency properties:

public class ValidationProperties
{
     #region IsValid Dependency Property

    /// <summary>
    /// An attached dependency property which provides an
    /// </summary>
    public static readonly DependencyProperty IsValidProperty;

    /// <summary>
    /// Gets the <see cref="IsValidProperty"/> for a given
    /// <see cref="DependencyObject"/>, which provides an
    /// </summary>
    public static bool GetIsValid(DependencyObject obj)
    {
        return (bool)obj.GetValue(IsValidProperty);
    }

    /// <summary>
    /// Sets the attached <see cref="IsValidProperty"/> for a given
    /// <see cref="DependencyObject"/>, which provides an
    /// </summary>
    public static void SetIsValid(DependencyObject obj, bool value)
    {
        obj.SetValue(IsValidProperty, value);
    }

     #endregion IsValid Dependency Property

    static ValidationProperties()
    {
        // Register attached dependency property
        IsValidProperty = DependencyProperty.RegisterAttached("IsValid",
                                                            typeof(bool),
                                                            typeof(ValidationProperties), 
                                                            new FrameworkPropertyMetadata(true));
    }
}

Following this, I modified the style to launch the animation depending on the value of that property for the control that uses the style:

(...)

<Trigger Property="AttachedProperties:ValidationProperties.IsValid" Value="false">
    <Trigger.EnterActions>
        <BeginStoryboard Storyboard="{StaticResource ControlIsInvalid}"/>
    </Trigger.EnterActions>
</Trigger>

(...)

I finally bound the Dependency Property on the Control that uses the Style to the value in the Model (via the View-Model):

<TextBox x:Name="UsernameTextbox"
       (...)
       AttachedProperties:ValidationProperties.IsValid="{Binding SessionHandler.SessionUser.UsernameIsValid}"/>
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文