探索Silverlight动画：BombDropper游戏与页面过渡效果实现

### 探索Silverlight动画：BombDropper游戏与页面过渡效果实现 #### 1. 自定义用户控件的使用 在开发中，自定义用户控件能帮助我们分离界面标记，使代码结构更清晰。以一个示例项目`BombDropper`为例，有一个名为`Title`的自定义用户控件，它以炽热的橙色字母展示游戏标题，本质上是一段矢量图形艺术。其创建过程是在Microsoft Word中使用艺术字功能，保存为XPS文件，再转换为XAML。 要使用`Title`用户控件，需将项目命名空间映射到XML命名空间，具体操作如下： ```xml <UserControl x:Class="BombDropper.Page" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:bomb="clr-namespace:BombDropper;assembly=BombDropper"> ``` 之后，就可以使用XML前缀`bomb`插入自定义控件，如： ```xml <bomb:Title></bomb:Title> ``` #### 2. 炸弹用户控件的创建 接下来创建炸弹的图形图像。虽然可以使用静态图像（只要有透明背景），但使用Silverlight形状更具灵活性，能在不产生失真的情况下调整大小，还可对绘图的各个部分进行动画处理或修改。示例中的炸弹图形来自Microsoft Word的在线剪贴画集，通过插入Word文档并保存为XPS文件转换为XAML。 简化后的XAML被插入到名为`Bomb`的新用户控件中，代码如下： ```vb Public Partial Class Bomb Inherits UserControl Public Sub New() InitializeComponent() End Sub Private _isFalling As Boolean Public Property IsFalling() As Boolean Get Return _isFalling End Get Set(ByVal value As Boolean) _isFalling = value End Set End Property End Class ``` 炸弹的标记中包含`RotateTransform`，用于在炸弹下落时产生摆动效果，在XAML文件中定义如下： ```xml <UserControl x:Class="BombDrop.Bomb" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" > <UserControl.RenderTransform> <TransformGroup> <RotateTransform Angle="20" CenterX="50" CenterY="50"></RotateTransform> <ScaleTransform ScaleX="0.5" ScaleY="0.5"></ScaleTransform> </TransformGroup> </UserControl.RenderTransform> <Canvas> <!-- The Path elements that draw the bomb graphic are defined here. --> </Canvas> </UserControl> ``` #### 3. 炸弹投放机制 为了实现炸弹投放，应用程序使用`DispatcherTimer`。它能在用户界面线程上触发事件，避免多线程编程的复杂性。具体步骤如下： 1. 初始化定时器： ```vb Private bombTimer As New DispatcherTimer() Public Sub New() InitializeComponent() AddHandler bombTimer.Tick, AddressOf bombTimer_Tick End Sub ``` 2. 开始游戏时启动定时器： ```vb ' Keep track of how many bombs are dropped and stopped. Private droppedCount As Integer = 0 Private savedCount As Integer = 0 ' Initially, bombs fall every 1.3 seconds, and hit the ground after 3.5 seconds. Private initialSecondsBetweenBombs As Double = 1.3 Private initialSecondsToFall As Double = 3.5 Private secondsBetweenBombs As Double Private secondsToFall As Double Private Sub cmdStart_Click(ByVal sender As Object, ByVal e As RoutedEventArgs) cmdStart.IsEnabled = False ' Reset the game. droppedCount = 0 savedCount = 0 secondsBetweenBombs = initialSecondsBetweenBombs secondsToFall = initialSecondsToFall ' Start the bomb-dropping timer. bombTimer.Interval = TimeSpan.FromSeconds(secondsBetweenBombs) bombTimer.Start() End Sub ``` 3. 定时器触发时创建炸弹并设置位置： ```vb Private Sub bombTimer_Tick(ByVal sender As Object, ByVal e As EventArgs) ' Create the bomb. Dim bomb As New Bomb() bomb.IsFalling = True ' Position the bomb. Dim random As New Random() bomb.SetValue(Canvas.LeftProperty, _ CDbl(random.Next(0, canvasBackground.ActualWidth - 50))) bomb.SetValue(Canvas.TopProperty, -100.0) ' Add the bomb to the Canvas. canvasBackground.Children.Add(bomb) ... ``` 4. 创建动画： ```vb ' Create the animation for the falling bomb. Dim storyboard As New Storyboard() Dim fallAnimation As New DoubleAnimation() fallAnimation.To = canvasBackground.ActualHeight fallAnimation.Duration = TimeSpan.FromSeconds(secondsToFall) Storyboard.SetTarget(fallAnimation, bomb) Storyboard.SetTargetProperty(fallAnimation, New PropertyPath("(Canvas.Top)")) storyboard.Children.Add(fallAnimation) ' Create the animation for the bomb "wiggle." Dim wiggleAnimation As New DoubleAnimation() wiggleAnimation.To = 30 wiggleAnimation.Duration = TimeSpan.FromSeconds(0.2) wiggleAnimation.RepeatBehavior = RepeatBehavior.Forever wiggleAnimation.AutoReverse = True Storyboard.SetTarget(wiggleAnimation, _ (CType(bomb.RenderTransform, TransformGroup)).Children(0)) Storyboard.SetTargetProperty(wiggleAnimation, New PropertyPath("Angle")) storyboard.Children.Add(wiggleAnimation) ... ``` 5. 存储炸弹和故事板： ```vb ' Make it possible to look up a bomb ```