WPF 面板从左侧动画滑入
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/22330837/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
WPF panel slide in from left animation
提问by Brian Triplett
I'm trying to get a Panel to animate a sliding in behavior in WPF. I'm new to animations and am having some trouble. The panel with fills from the center out rather than from the left and it only animates the first time. I know I'm doing something wrong so any help would be appreciated. Below is the markup for my animation.
我正在尝试让面板为 WPF 中的滑动行为设置动画。我是动画新手，遇到了一些麻烦。面板从中心填充而不是从左侧填充，它只在第一次动画。我知道我做错了什么，所以任何帮助将不胜感激。下面是我的动画的标记。
<Style.Triggers>
<Trigger Property="Visibility" Value="Visible">
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation From="0" To="200" Duration="0:0:0.5"
AccelerationRatio="0.2" DecelerationRatio="0.1"
Storyboard.TargetProperty="Width"/>
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
</Trigger>
</Style.Triggers>
回答by BradleyDotNET
Don't animate properties like "Width", that is what RenderTransforms are for.
不要为“宽度”之类的属性设置动画，这就是 RenderTransforms 的用途。
To get the behavior you describe ("Sliding in") you want to animate a TranslateTransform from some X off the screen/page to the final position.
要获得您所描述的行为（“滑入”），您需要将 TranslateTransform 从屏幕/页面外的某个 X 动画化到最终位置。
To get the behavior your XAML and the rest of your post indicates, you would use a ScaleTransform with the origin set to the left hand side of the panel.
要获得您的 XAML 和帖子的其余部分所指示的行为，您将使用 ScaleTransform，并将原点设置为面板的左侧。
You should also know that the targeting of render transforms can be a little tricky, see this questionfor more information
您还应该知道渲染变换的目标可能有点棘手，请参阅此问题以获取更多信息
Here is the documentation for RenderTransforms (MSDN)
这是 RenderTransforms ( MSDN)的文档
