WPF：触发动画 - 移动控制沿Y轴下方 [英] WPF: Trigger animation - Move Control downwards along Y axis

问题描述

我有，我想在鼠标悬停向下移动控制。不幸的是，当我鼠标，背景虽然改变颜色动画犯规运行

工具包：对话是一个自定义对话框控件继承 ContentControl中。 。此外，在最终实现我不会使用鼠标悬停 - 这是目前只是为了便于测试

 <风格X：关键=嗒嗒的TargetType =工具包：对话> 
<触发属性=IsMouseOverVALUE =真> 
< setter属性=工具包：CanvasControl.BackgroundVALUE =白/> 
< Trigger.EnterActions> 
< BeginStoryboard> 
<情节提要> 
< DoubleAnimation是Storyboard.TargetProperty =（UIElement.RenderTransform）（TranslateTransform.Y）。从=0=100时间=00：00：01.000/> 
< /故事板> 
< / BeginStoryboard> 
< /Trigger.EnterActions> 
< /触发> 
< /样式和GT; 
  

解决方案

我认为你必须提供一个空 TranslateTransform 到的RenderTransform，因为normaly没有什么在的RenderTransform 。所以，你想动画的东西不存在。只需添加 TranslateTransform 键，看看是否能工程：

 <风格X：键=嗒嗒的TargetType =工具包：对话> 
< setter属性=的RenderTransform> 
< Setter.Value> 
< TranslateTransform /> 
< /Setter.Value> 
< /二传手> 
<触发属性=IsMouseOverVALUE =真> 
< setter属性=工具包：CanvasControl.BackgroundVALUE =白/> 
< Trigger.EnterActions> 
< BeginStoryboard> 
<情节提要> 
< DoubleAnimation是Storyboard.TargetProperty =（UIElement.RenderTransform）（TranslateTransform.Y）。从=0=100时间=00：00：01.000/> 
< /故事板> 
< / BeginStoryboard> 
< /Trigger.EnterActions> 
< /触发> 
< /样式和GT; 
  

I have a control that I want to move downwards upon MouseOver. Unfortunately the animation doesnt run when I mouse over, the background changes colour though.

Toolkit:Dialog is a custom dialog control inheriting ContentControl. Also, in final implementation I wont be using MouseOver - that is currently just for ease of testing.

<Style x:Key="blah" TargetType="Toolkit:Dialog">
    <Trigger Property="IsMouseOver" Value="True">
        <Setter Property="Toolkit:CanvasControl.Background" Value="White" />
        <Trigger.EnterActions>
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.Y)" From="0" To="100" Duration="00:00:01.000" />
                </Storyboard>
            </BeginStoryboard>
        </Trigger.EnterActions>
    </Trigger>
</Style>

解决方案

I think you have to supply an empty TranslateTransform to the RenderTransform, because normaly there is nothing in the RenderTransform. So you are trying to animate something which doesn't exist. Just add the TranslateTransform and see if that works:

<Style x:Key="blah" TargetType="Toolkit:Dialog">
    <Setter Property="RenderTransform">
        <Setter.Value>
            <TranslateTransform/>
        </Setter.Value>
    </Setter>
    <Trigger Property="IsMouseOver" Value="True">
        <Setter Property="Toolkit:CanvasControl.Background" Value="White" />
        <Trigger.EnterActions>
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.Y)" From="0" To="100" Duration="00:00:01.000" />
                </Storyboard>
            </BeginStoryboard>
        </Trigger.EnterActions>
    </Trigger>
</Style>

这篇关于WPF：触发动画 - 移动控制沿Y轴下方的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！