运行 Storyboard 时进行控制

在 Microsoft Expression Blend 应用程序中运行 Storyboard 时，可以通过以下方法进行控制：

• 创建一个触发器，使之在发生某个事件（如按钮单击）时或在某个属性发生更改时（如果 Storyboard 位于控件模板中）运行 Storyboard。

  说明：
  在 Microsoft Silverlight 1.0 或 Silverlight 2 项目中并不提供触发器。

• 在代码隐藏文件中创建一个事件处理程序方法，使之调用 Storyboard 的 Begin 方法。

还可以使用这些方法来控制 Storyboard 的停止、暂停、继续和删除或跳到结尾。

这些方法根据用户的工作范围会略有不同。

说明：
以下过程介绍的是包含可视动画的 Storyboard。但是，这些过程也可以应用于音频或视频 Storyboard。有关详细信息，请参阅在活动文档中插入图像、音频或视频文件。

主文档范围内的 Storyboard

如果 Storyboard 将会是文档的主要功能，并且在用户与同样位于主文档范围内的控件交互时会将其触发，则请在主文档范围内创建 Storyboard。在 Expression Blend 中，在主文档范围内创建 Storyboard 时，会自动新建一个触发器，该触发器将在加载应用程序窗口时运行 Storyboard。可以在“交互”面板的“触发器”下查看此触发器。

在创建 Storyboard 时 Expression Blend 设置的默认触发器

如果保留此触发器的设置不变，则在启动应用程序之后将立即运行 Storyboard。或者，可以通过以下过程修改此行为。

使用事件触发器控制主文档范围内的 Storyboard

1. 如果在创建 Storyboard 时为 Window.Loaded 事件创建了一个默认触发器，并且不希望在启动应用程序之后就运行 Storyboard，则请选择“触发器”下的 Window.Loaded。否则，请单击“添加事件触发器” 按钮，以创建新的默认事件触发器。

2. 在“对象和时间线”下，选择要在交互时运行 Storyboard 的对象。例如，如果希望在用户的指针移到文本块上时运行 Storyboard，请选择该文本块。

3. 通过使用“触发器”窗格下半部分中的下拉菜单，更改触发动画（Window.Loaded）的事件。例如，将“在引发 Window.Loaded 时”更改为“在引发 textblock.MouseEnter 时”。

4. 定义将在触发事件时发生的操作。如果未列出任何操作，请单击“添加新操作” 按钮。确保将该操作设置为 Storyboard 的名称（例如“Storyboard1”），并确保所调用的方法为“Begin”。此外，可以选择任何对于 Storyboard 有效的方法。有关详细信息，请参阅添加或删除触发器。

使用事件处理程序方法控制主文档范围内的 Storyboard

1. 如果在创建 Storyboard 时为 Window.Loaded 事件创建了一个默认触发器，并且不希望在启动应用程序时运行 Storyboard，请选择“触发器”下的 Window.Loaded，然后执行以下操作之一：

   • 如果在“触发器”窗口的下半部分列出了多个操作，请选择一个控制 Storyboard 的操作（例如“Storyboard1.Begin”），然后单击该操作旁边的“删除此操作” 按钮。

   • 如果只列出了一个控制 Storyboard 的操作，则可以通过单击“删除触发器” 按钮删除来整个触发器。

2. 在“对象和时间线”下，选择要在交互时运行 Storyboard 的对象。例如，如果希望在用户的指针移到文本块上时运行 Storyboard，请选择该文本块。

3. 在“属性”面板中，单击“事件” 按钮。此时，将显示选定元素的所有可用事件的列表（按字母顺序排列）。

   提示：
   若要查看事件的简短说明，请将指针移到该事件的名称上。工具提示中将显示该事件的说明。也可以在 WPF 事件快速参考中查看可用事件及其说明的列表。

4. 找到要添加编程逻辑的事件（例如，“MouseEnter”事件）。

5. 有两种方法可以生成空的事件处理程序方法：

   • 在事件名称旁边的文本块内双击。Expression Blend 将为事件处理程序方法生成默认名称，并将其输入到文本块中，然后为空方法生成代码。

   • 在事件名称旁边的文本块内键入一个名称，然后按 Enter 或单击其他位置，将焦点移出文本块。事件方法名必须以字母开头。如果代码隐藏文件中还不存在该方法名，Expression Blend 将为空方法生成代码，并使用您键入的名称。

   说明：
   即使安装了 Microsoft Visual Studio 2008，也可以将 Expression Blend 配置为使用“剪贴板”。在“工具”菜单上，单击“选项”按钮，然后单击“事件处理程序”。在“编辑”下，单击“仅限剪贴板”。

6. 此时，Expression Blend 将执行以下操作之一：

   • 如果安装了 Visual Studio 2008 Standard Edition 或更高版本，Expression Blend 将在 Visual Studio 2008 中打开项目，并打开代码隐藏文件，然后将空的事件处理程序方法粘贴到其中。

     说明：
     如果同时安装了 Visual Studio 2008 和 Visual Studio 2005，并且 Visual Studio 版本选择器尝试打开 Visual Studio 2005 而不是打开 Visual Studio 2008，则可能会收到错误。这是因为在 Visual Studio 2005 中无法打开 Expression Blend 创建的 Visual Studio 2008 项目。如果出现该错误，请在 Expression Blend 的“属性”面板中尝试创建事件处理程序之前，首先在 Visual Studio 2008 中打开所需项目。

   • 如果没有安装 Visual Studio 2008 Standard Edition 或更高版本，则 Expression Blend 将空的事件处理程序方法复制到“剪贴板”中，然后显示一个弹出窗口，说明可以执行的后续操作。在这种情况下，可以手动在其他文本编辑器中打开代码隐藏文件，以便将该方法粘贴到窗口的类定义中，如下所示：

     private void TextBlock_MouseEnter(object sender, System.Windows.Input.MouseEventArgs e)
     {
     
     }
     

     Private Sub textBlock_MouseEnter(ByVal sender As System.Object, ByVal e As System.Windows.Input.MouseEventArgs)
     
     End Sub
     

   说明：
   如果将某个应用程序（如“记事本”）映射到 .cs 或 .vb 文件，则可以在“项目”面板中的“文件”下，通过双击代码隐藏文件的名称以手动方式将其打开。Expression Blend 将在该应用程序中打开该文件。 如果没有映射到 .cs 或 .vb 文件的应用程序，Expression Blend 将无法在外部打开该文件。若要打开该文件，请在 Windows 资源管理器中找到该文件（如果在 Expression Blend 中保存了项目，还可以单击“项目”菜单上的“浏览项目”），右键单击所要修改的 .cs 或 .vb 文件，选择“打开方式”，然后选择“记事本”（或其他编辑应用程序）。执行完上述操作之后，就可以通过 Expression Blend 中的“项目”面板手动打开代码隐藏文件。

7. 打开代码隐藏文件并粘贴事件处理程序方法之后，请在事件处理程序方法中添加以下加粗的代码行：

   private void TextBlock_MouseEnter(object sender, System.Windows.Input.MouseEventArgs e)
   {
       Storyboard myStoryboard;    myStoryboard = (Storyboard)this.Resources["Storyboard1"];    myStoryboard.Begin(this);
   }
   

   Private Sub textBlock_MouseEnter(ByVal sender As System.Object, ByVal e As System.Windows.Input.MouseEventArgs)
       Dim myStoryboard As New Storyboard    myStoryboard = CType(Me.Resources("Storyboard1"), Storyboard)    myStoryboard.Begin(Me)
   End Sub
   

8. 保存所有文件，然后按 F5 以生成并测试应用程序。例如，在运行应用程序时，将鼠标移到文本块上，以查看动画是否开始运行。

   说明：
   如果再次将鼠标移到文本块上时动画并没有返回到起始点，这可能是因为之前在 0 秒标记处没有设置关键帧。

控件模板和样式中的 Storyboard

有时，Microsoft Expression Blend 会创建 Storyboard，例如在向属性触发器或事件触发器（如果修改控件模板）添加操作时。有关如何使用样式和模板的详细信息，请参阅样式和模板。

在模板范围内控制 Storyboard

1. 使用以下方法之一打开样式或模板以供修改：

   说明：
   若要了解是使用样式还是使用模板，请参阅样式和模板概述。

   说明：
   某些对象不支持模板，如路径对象。“Button”或“RadioButton”等控件支持模板。

   • 若要新建模板，请在美工板上或在“对象和时间线”下选择一个对象，然后在“对象”菜单上，单击“编辑控件部件(模板)”，再选择“编辑副本”。此时，将显示“创建样式资源”对话框。选择要定义资源的位置，然后单击“确定”。有关详细信息，请参阅创建样式资源。

   • 若要新建样式，请在美工板上或在“对象和时间线”下选择一个对象，然后在“对象”菜单上，单击“编辑样式”，再选择“编辑副本”。此时，将显示“创建样式资源”对话框。选择要定义资源的位置，然后单击“确定”。有关详细信息，请参阅创建样式资源。

   • 若要打开现有模板，请在“资源”面板上，单击样式旁边的“编辑资源” 按钮，然后在“对象和时间线”下，右键单击“Style”元素，单击“编辑控件部件(模板)”，再选择“编辑模板”。或者，可以选择已应用自定义样式的控件，然后在“对象”菜单上，单击“编辑控件部件(模板)”，再选择“编辑模板”。

   • 若要打开现有样式，请在“资源”面板上，单击样式旁边的“编辑资源” 按钮。或者，选择已应用自定义样式的控件，然后在“对象”菜单上，单击“编辑样式”，再选择“编辑样式”。

   • 若要修改 Expression Blend 附带的简单样式之一，请从“工具箱”打开“资源库”，依次单击“控件”选项卡和“简单样式”资源字典，选择一个预先设置样式的控件，在美工板上绘制该控件，以便可以在“资源”面板上使用“SimpleStyles.xaml”资源字典，然后使用上述选项之一打开简单样式或模板。在当前项目中修改“SimpleStyles.xaml”资源字典不会影响其他项目中的“SimpleStyles.xaml”资源字典，除非将当前项目中的“SimpleStyles.xaml”文件复制到其他项目中。

2. 请注意，在样式或模板的编辑范围内，新的 Expression Blend 2 痕迹导航栏位于美工板的顶部。

   选定了模板编辑模式的痕迹导航栏

   

   通过单击痕迹导航栏上的按钮，可以在选定对象的模板编辑模式、样式编辑模式和对象编辑范围之间快速切换。对于应用了自定义样式或模板的任何选定对象，都会显示痕迹导航栏。

3. 在“对象和时间线”下，单击“新建” 按钮。

   

   此时，将显示“创建 Storyboard 资源”对话框。

   

4. 输入一个名称，并单击“确定”。将关闭“创建 Storyboard 资源”对话框，并且 Expression Blend 将进入时间线录制模式。

5. 创建一些只影响正在编辑的样式或模板中的对象的动画。

   说明：
   无法动态显示位于正在修改的模板或样式的外部的对象。但可以动态显示样式或模板中的现有对象。此外，在修改模板时，可以将“模板”节点下的项组合到一个版式面板（如“网格”）中，再向网格中添加更多对象，然后可以动态显示这些对象。

6. 通过执行下列操作之一来触发新的 Storyboard：

   • 若要将 Storyboard 添加到现有的属性触发器中，请在“交互”面板的“触发器”下选择相应的触发器，然后在“触发器”窗格的下半部中，单击“激活时的操作”或“取消激活时的操作”旁边的“添加新操作” 按钮，具体位置取决于是希望在激活触发器时运行 Storyboard 还是在取消激活时运行 Storyboard。将自动添加新的 Storyboard 以作为激活触发器时运行的操作。

   • 若要将 Storyboard 添加到新的属性触发器中，请单击“添加属性触发器” 按钮，然后在“触发器”窗格的下半部中，将触发器从默认的“target-element.IsCancel = False”更改为所需的属性和值（例如“target-element.IsPressed = True”），再单击“添加新操作” 按钮。将自动添加新的 Storyboard 以作为引发事件时运行的操作。

   • 若要将 Storyboard 添加到新的事件触发器中，请单击“添加事件触发器” 按钮，然后在“触发器”窗格的下半部中，将触发器从默认的“当引发 target-element.Loaded 时”更改为所需的事件（例如“当引发 target-element.Click 时”），再单击“添加新操作” 按钮。将自动添加新的 Storyboard 以作为引发事件时运行的操作。

   重要事项：
   在对模板进行一般修改之前，始终选择“默认”触发器以关闭触发器录制模式。否则，可能会无意中更改现有的触发器。

   警告：
   在修改样式和模板时，可能会破坏应用了该样式或模板的系统控件的功能。有关注意事项的列表，请参阅样式和模板概述中的“最佳实践”部分。

7. 保存所有文件，然后按 F5 以生成并测试应用程序。

   有关修改模板的更具体示例，请参阅动手试验：向按钮添加动画。

用户控件中的 Storyboard

可以通过在用户控件中放置一个 Storyboard，将对象以及动态显示这些对象的 Storyboard 封装在一个 XAML 文档和代码隐藏文件中。然后可以在其他文档中多次实例化该用户控件。

控制用户控件中包含的 Storyboard

1. 通过执行下列操作之一，创建并打开用户控件以供编辑：

   • 从现有对象创建控件.

   • 在“文件”菜单上，选择“新建项”。在“新建项”对话框中，选择“UserControl”，设置“名称”，然后单击“确定”。

2. 创建动画 Storyboard 并动态显示用户控件中的一些对象。

3. 现在可以使用主文档范围内的 Storyboard 下的两个任务之一，通过事件触发器或事件处理程序方法来控制动画。

   说明：
   如果在将一个对象转换为用户控件之前使用“生成控件”命令为该对象创建事件触发器，则必须在用户控件范围内重新创建该事件触发器。这是因为可在用户控件范围内使用的事件与可在主文档范围内使用的事件不同。例如，可以使用一个操作（如“Storyboard1.Begin”）来配置事件（如“当引发 UserControl.MouseDown 时”）。当使用“生成控件”命令时，将在新控件中重构资源和动画，这样就无需重新创建它们。

   说明：
   如果在将一个对象转换为用户控件之前使用“生成控件”命令为该对象创建事件处理程序方法，则主文档的代码隐藏文件中的事件处理程序方法代码将不会移动到用户控件的代码隐藏文件中。这是因为可能有其他使用相同事件处理程序方法的对象。可以复制事件处理程序方法并将其粘贴到用户控件的代码隐藏文件中。

Silverlight 1.0 应用程序中的 Storyboard

Silverlight 1.0 应用程序中的 Storyboard 属于资源，与 Silverlight 1.0 中的所有资源一样，Storyboard 通过名称标识（这点与在 Windows Presentation Foundation 应用程序中使用关键字标识不同）。

在 Silverlight 1.0 应用程序中控制 Storyboard

• 请参阅在 Silverlight 应用程序中创建控制 Storyboard 的按钮。

Silverlight 2 应用程序中的 Storyboard

Silverlight 2 应用程序中的 Storyboard 可使用事件处理程序或状态进行控制。

在 Silverlight 2 应用程序中控制 Storyboard

• 如果使用事件处理程序方法，请使用以下代码：

  private void TextBlock_MouseEnter(object sender, System.Windows.Input.MouseEventArgs e)
  {
      Storyboard myStoryboard;    myStoryboard = (Storyboard)this.Resources["Storyboard1"];    myStoryboard.Begin();
  }
  

• 如果使用状态，请参阅添加状态改变后显示的动画。

另请参见

概念

创建、修改或删除 Storyboard

创建简单动画