【问题标题】:WPF: Zoom user control animationWPF:缩放用户控件动画
【发布时间】:2011-04-17 02:13:56
【问题描述】:

我已经创建了一个用户控件:

<UserControl ...>
  <Grid DataContext="{Binding UserContrlViewModel>
    <Grid Width="200" Height="100" RenderTransformOrigin="0.5,0.5">
      <Grid.Resources>
        <Storyboard x:Key="zoomIn">
          <DoubleAnimation 
              Storyboard.TargetProperty="ScaleTransform.ScaleX" 
              From="0" 
              To="1" 
              Duration="0:0:1" /> 
          <DoubleAnimation 
              Storyboard.TargetProperty="ScaleTransform.ScaleY" 
              From="0"        
              To="1" 
              Duration="0:0:1" />
        </Storyboard>
      </Grid.Resources>
      <Grid.RenderTransform>
        <ScaleTransform />
      </Grid.RenderTransform>
      <Grid.Style>
        <Style TargetType="Grid">
          <Style.Triggers>
            <DataTrigger Binding="{Binding Path=IsActive}" Value="True">
              <DataTrigger.EnterActions>
                <BeginStoryboard>
                  <StaticResource ResourceKey="zoomIn" />
                </BeginStoryboard>
              </DataTrigger.EnterActions>
            </DataTrigger>
          </Style.Triggers>
        </Style>
      </Grid.Style>

      <TextBlock Width="60" Text="Input" />
      <TextBox Width="80" Margin="80,0,0,0" />

    </Grid>
    ...
  </Grid>
</UserControl>

我想要实现的是,当用户控件的视图模型类的IsActive 属性设置为true 时,zoomIn 动画就会运行。该动画应该在网格中放大其内容。当我触发动画时,我收到以下错误消息:

无法解析属性路径“ScaleTransform.ScaleX”中的所有属性引用。验证适用的对象是否支持这些属性。

我的动画有什么问题?我应该如何实现所描述的放大动画?谢谢。

【问题讨论】:

    标签: wpf xaml


    【解决方案1】:

    我明白了:

    • &lt;ScaleTransform&gt; 应该有 &lt;ScaleTransform ScaleX="0.5" ScaleY="0.5" /&gt; 属性 例如,设置以使缩放从 50% 开始。
    • 在第一个&lt;DoubleAnimation&gt;Storyboard.TargetProperty 属性的值 应从 "ScaleTransform.ScaleX" 更改为 "RenderTransform.ScaleX"
    • 在第二个&lt;DoubleAnimation&gt;Storyboard.TargetProperty 属性的值 应从 "ScaleTransform.ScaleY" 更改为 "RenderTransform.ScaleY"

    【讨论】:

      猜你喜欢
      • 2011-05-20
      • 1970-01-01
      • 1970-01-01
      • 2023-04-05
      • 2011-07-13
      • 2014-11-09
      • 2018-12-03
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多