加载时启动情节提要动画的 XAML 属性答案

【问题标题】：XAML property to start a storyboard animation on load加载时启动情节提要动画的 XAML 属性
【发布时间】：2009-12-28 09:39:23
【问题描述】：

嗯，正如标题所示：

我有一个故事板，我希望它的动画在没有代码干预的情况下开始。这个要求的原因是我的目标是 Silverlight Embedded，我现在也懒得重新编译我的应用程序。而且，仔细想想，以后只更改动画会更容易。

XAML 是否具有使情节提要在 xaml 加载后立即运行的属性？

【问题讨论】：

标签： xaml silverlight-2.0

【解决方案1】：

您可以使用 Loaded 事件来开始您的故事板

请参阅 MSDN 以获取示例： Storyboard (Silverlight)

从 MSDN 中选择示例：

<Canvas
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Rectangle
    x:Name="MyAnimatedRectangle"
    Width="100"
    Height="100"
    Fill="Blue">
    <Rectangle.Triggers>

      <!-- Animates the rectangle's opacity.
           This is the important part, the EventTrigger which will start our animation -->

      <EventTrigger RoutedEvent="Rectangle.Loaded">
        <BeginStoryboard>
          <Storyboard>
            <DoubleAnimation
              Storyboard.TargetName="MyAnimatedRectangle"
              Storyboard.TargetProperty="Opacity"
              From="1.0" To="0.0" Duration="0:0:5" AutoReverse="True" RepeatBehavior="Forever" />
          </Storyboard>
        </BeginStoryboard>
      </EventTrigger>
    </Rectangle.Triggers>
  </Rectangle>
</Canvas>

对象 Rectangle 具有属性。在 Triggers 属性中，我们定义了一个 EventTrigger，它会在该事件发生时触发。我们选择 Rectangle.Loaded 事件，这意味着它会在加载时触发；）。

我们添加一个 BeginStoryboard 属性来开始我们的故事板，并添加一个故事板。此动画将在 Opacity 属性上使用 DoubleAnimation，这意味着在 5 秒的持续时间内，不透明度将逐渐淡入零，然后逐渐变回（AutoReverse 属性），它将永远执行此操作（RepeatBehaviour 属性）。

【讨论】：

我没有检查 MSDN 就直接去了 SO（我真丢脸）。从 MSDN 看来，没有什么比得上我正在寻找的行为了。故事板必须从代码开始......您的建议仍然涉及编写/更改代码。
如果 XAML 可以被视为代码，那么是的 :) 你必须编写一点 XAML 才能让它工作;)
好的。我一定很厚:(。我将阅读如何在 XAML 中使用事件并回来以防它解决我的问题。谢谢。
我还在挣扎。 XAML 和 Silverlight 的新手。你能发布一个如何使用它的 XAML 示例吗？
添加了一些解释的例子。希望这会有所帮助:)

【解决方案2】：

<UserControl x:Class="SOSMVVM.AniM11"
    xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation' 
    xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml'
    xmlns:d='http://schemas.microsoft.com/expression/blend/2008' 
    xmlns:mc='http://schemas.openxmlformats.org/markup-compatibility/2006' 
    mc:Ignorable='d' 
    d:DesignWidth='640' 
    d:DesignHeight='480'>


    <StackPanel Margin="5">
        <Rectangle Name="rect3" Fill="Blue" Margin="2" Width="20"
      Height="20" HorizontalAlignment="Left" />
        <Button Margin="2,20,0,0" HorizontalAlignment="Left"
      Content="Start Animations" Width="100">
            <Button.Triggers>
                <EventTrigger RoutedEvent="Button.Click">
                    <EventTrigger.Actions>
                        <BeginStoryboard>
                            <Storyboard>

                                <DoubleAnimation
                  Storyboard.TargetName="rect3" Storyboard.TargetProperty="Width"
                  From="20" To="400" Duration="0:0:10" SpeedRatio="0.5" />


                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger.Actions>
                </EventTrigger>
            </Button.Triggers>
        </Button>
    </StackPanel>


</UserControl>

【讨论】：