技术开发 频道

开发Silverlight游戏教程:实现2D人物动画

     【IT168技术文档】第二种方法我称之为图片截取法,准备工作:这里我以创建主角向右方向施法动画为例。首先需要将10帧150*150的图片通过Photoshop或其他方式合成为一张1500*150的大图,如下图:

     从图上可以很清晰的看出主角的整个流畅的施法流程。接着,我将该文件取名叫PlayerMagic.png保存。然后在上一节中建立的Player文件夹上点鼠标右键->添加->现有项->找到PlayerMagic.png图片后并加入进Player文件夹。接下来的就是重点了,如何才能使该图片被WPF/Silverlight程序识别呢?我们可以在这张图片上点右键->属性,接着将以下两个属性①复制到输出目录->改为“始终复制”②生成操作->改为“嵌入到资源”,如下图:

 

    这样,当我们编译完项目后,Player文件夹将包PlayerMagic.png文件一起发布在Bin或Debug文件夹中,此时PlayerMagic.png才能轻松的被BitmapFrame.Create()方法所调用(在此,我要特别感谢雨恨云愁纠正本文之前所范的低级错误)。如下图:
 

  

  O K,xaml代码仍旧和前面章节的一样,那么接下来就是后台C#代码了:

Image Spirit;

int count = 1;

public Window5() {

InitializeComponent();

Spirit = new Image();

Spirit.Width = 150;

Spirit.Height = 150;

Carrier.Children.Add(Spirit);

DispatcherTimer dispatcherTimer = new DispatcherTimer();

dispatcherTimer.Tick += new EventHandler(dispatcherTimer_Tick);

dispatcherTimer.Interval = TimeSpan.FromMilliseconds(150);

dispatcherTimer.Start();

}

 

private void dispatcherTimer_Tick(object sender, EventArgs e) {

Spirit.Source = cutImage("PlayerMagic.png", count * 150, 0, 150, 150);

count = count == 9 ? 0 : count + 1;

}

 

/// <summary>

/// 截取图片

/// </summary>

/// <param name="imgaddress">文件名(包括地址+扩展名)</param>

/// <param name="x">左上角点X</param>

/// <param name="y">左上角点Y</param>

/// <param name="width">截取的图片宽</param>

/// <param name="height">截取的图片高</param>

/// <returns>截取后图片数据源</returns>

private BitmapSource cutImage(string imgaddress, int x, int y, int width, int height) {

return new CroppedBitmap(

BitmapFrame.Create(new Uri(imgaddress, UriKind.Relative)),

new Int32Rect(x, y, width, height)

);

}

    从上面代码可以看出前半部分和上一节的一样,这里就不累述了,精华就在后面的cutImage方法,该方法可谓集天地之精华,日月之灵气。。。扯远了,该方法的详细描述已经写在上面,大家可以慢慢体会应该不难。

    有了该尚方宝剑,那么大家应该也多少有点感觉了吧,最后在dispatcherTimer_Tick方法中,我们即调用该方法实现时时的图片截取来循环生成动画,Ctrl+F5看看,呵呵,主角会放魔法啦!

原文地址:http://www.cnblogs.com/alamiye010/archive/2009/06/17/1505335.html

0
相关文章