风格转换答案

【问题标题】：TranslateTransform in Style风格转换
【发布时间】：2010-11-06 03:16:55
【问题描述】：

我有以下代码：

  <Window.Resources>
<Style TargetType="{x:Type TextBlock}">
  <Setter Property="LayoutTransform">
    <Setter.Value>
      <TranslateTransform />
    </Setter.Value>
  </Setter>
  <Style.Triggers>
    <EventTrigger RoutedEvent="FrameworkElement.Loaded">
      <EventTrigger.Actions>
        <BeginStoryboard>
          <Storyboard RepeatBehavior="Forever" AutoReverse="True">
            <DoubleAnimation 
              From="300"
              To="-300" 
              Storyboard.TargetProperty="LayoutTransform.X"
              Duration="0:0:1" />
          </Storyboard>
        </BeginStoryboard>
      </EventTrigger.Actions>          
    </EventTrigger>
  </Style.Triggers>      
</Style>

<TextBlock
  Grid.Column="1"
  Text="This is a sample text."/>

<Rectangle Grid.Column="0" Fill="AliceBlue"/>
<Rectangle Grid.Column="2" Fill="Aquamarine"/>

基本上我想要实现的是 TextBlock 的内容应该从右向左（和向后）滚动。不知何故，这种风格没有做任何事情。如果我将 TranslateTransform 更改为 ScaleTransform 并将 LayoutTransform.X 更改为 LayoutTransform.ScaleX ，则 TextBlock 的动画效果很好。这是 WPF 中的错误还是我遗漏了什么？

【问题讨论】：

好吧，问题是 LayoutTransform（这里是 MSDN 的解释）：设置一个变换提供了强大的缩放和旋转功能。但是，LayoutTransform 会忽略 TranslateTransform 操作。这是因为 FrameworkElement 的子元素的布局系统行为会将缩放或旋转元素位置的任何偏移量自动更正到父元素的布局和坐标系中。将 LayoutTransform 更改为 RenderTransform 现在就像一个魅力。

标签： wpf transform

【解决方案1】：

我在使用 RotateTransform 时遇到了同样的问题。我希望我的所有控件都具有该动画。我找到了解决方案，看起来它也可以与 TrasnslteTransform 一起使用。

试试下面的代码：

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
<Window.Resources>
    <Style TargetType="{x:Type TextBox}">
        <Setter Property="RenderTransform">
            <Setter.Value>
                <TranslateTransform X="0" Y="0"/>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <EventTrigger RoutedEvent="Loaded">
                <EventTrigger.Actions>
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimation Storyboard.TargetProperty="(TextBox.RenderTransform).(TranslateTransform.X)"
                                             From="300"
                                             To="-300"
                                             AutoReverse="True"
                                             RepeatBehavior="Forever"/>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger.Actions>
            </EventTrigger>
        </Style.Triggers>
    </Style>
</Window.Resources>

<Grid>
    <TextBox Width="200" Height="22"/>
</Grid>

我想诀窍在于您指定目标属性的方式。这段代码对我有用。

我知道问题提出已经 5 年了，但其他人可能会从答案中受益。 :)

【讨论】：

6年后，它仍然是我找到解决问题的唯一方法，谢谢您！

【解决方案2】：

不确定我是否完全遵循它的工作原理，但我认为您需要将TargetProperty 指定为X 并将TargetName 指定为_translateTransform：

<Window.Resources>
<Style TargetType="{x:Type TextBlock}">
  <Setter Property="LayoutTransform">
    <Setter.Value>
      <TranslateTransform x:Name="_translateTransform"/>
    </Setter.Value>
  </Setter>
  <Style.Triggers>
    <EventTrigger RoutedEvent="FrameworkElement.Loaded">
      <EventTrigger.Actions>
        <BeginStoryboard>
          <Storyboard RepeatBehavior="Forever" AutoReverse="True">
            <DoubleAnimation 
              From="300"
              To="-300" 
              Storyboard.TargetProperty="X"
              Storyboard.TargetName="_translateTransform"
              Duration="0:0:1" />
          </Storyboard>
        </BeginStoryboard>
      </EventTrigger.Actions>          
    </EventTrigger>
  </Style.Triggers>      
</Style>

【讨论】：

这是我首先尝试的，但显然你不能在 Style 中设置属性 Storyboard.TargetName。