0

我有一个地铁应用程序，它有一个包含一行矩形对象的网格，我想同时为所有矩形设置动画（在 1 秒内从 0 缩放到 1）。我想尽可能多地使用资源，避免代码重复。网格的基本骨架如下。

<Grid>
    <Grid.Resources>
        <Style TargetType="Rectangle" x:Key="RectangleStyle">
            <Setter Property="Height" Value="100"/>
            <Setter Property="Width" Value="100"/>
            <Setter Property="Margin" Value="10"/>
            <Setter Property="RadiusX" Value="10"/>
            <Setter Property="RadiusY" Value="10"/>
            <Setter Property="RadiusY" Value="10"/>
            <Setter Property="RenderTransform">
                <Setter.Value>
                        <ScaleTransform x:Name="RectangleScaleTransform"  ScaleX="1" ScaleY="1" />
                </Setter.Value>
            </Setter>
        </Style>
    </Grid.Resources>
    <Grid.Triggers>
       <EventTrigger RoutedEvent="Rectangle.Loaded">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetName="RectangleScaleTransform"
                        Storyboard.TargetProperty="(ScaleTransform.ScaleX)" From="0" To="1.0" Duration="0:0:1"  />
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
        <EventTrigger RoutedEvent="Rectangle.Loaded">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetName="RectangleScaleTransform"
                                    Storyboard.TargetProperty="(ScaleTransform.ScaleY)" From="0" To="1.0" Duration="0:0:1"  />
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Grid.Triggers>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        <Rectangle Fill="Red" Grid.Row="0" Grid.Column="0" Style="{StaticResource RectangleStyle}" />
        <Rectangle Fill="Red" Grid.Row="0" Grid.Column="1" Style="{StaticResource RectangleStyle}" />
        <Rectangle Fill="Red" Grid.Row="0" Grid.Column="2" Style="{StaticResource RectangleStyle}"/>
        <Rectangle Fill="Red" Grid.Row="0" Grid.Column="3" Style="{StaticResource RectangleStyle}"/>
        <Rectangle Fill="Red" Grid.Row="0" Grid.Column="4" Style="{StaticResource RectangleStyle}"/>
        <Rectangle Fill="Red" Grid.Row="0" Grid.Column="5" Style="{StaticResource RectangleStyle}"/>
        <Rectangle Fill="Red" Grid.Row="0" Grid.Column="6" Style="{StaticResource RectangleStyle}"/>
        <Rectangle Fill="Red" Grid.Row="0" Grid.Column="7" Style="{StaticResource RectangleStyle}"/>
    </Grid>
</Grid>

我不想向RenderTransform每个单独的矩形添加触发器，也不想向每个矩形三角形添加触发器，因为这似乎有很多重复。使用上面的代码，我得到了一个Cannot resolve TargetName "RectangleScaleTransform错误。

任何帮助都会很棒。

4

1 回答 1

0

我认为您不能引用以这样的样式定义的命名元素。

也许您可以使用代码隐藏？

还没有尝试过，但就在我的脑海中，你可以这样做：

  1. 在 XAML 中命名所有矩形
  2. 在 InitializeComponent 调用之后的 .xaml.cs 中，将所有矩形放在一个列表中，并循环遍历每个矩形以以编程方式添加渲染转换。
  3. 然后当您需要启动动画时，为列表中的所有矩形设置渲染变换动画
于 2012-09-11T07:11:45.887 回答