大家可以到
http://lufylegend.com/lufylegend
下载lufylegend引擎的最新版本，
由于鄙人也是第一次开发此类游戏，所以有不妥的地方，欢迎大家回帖探讨和指正。
该系列文章目录（更新中）
(一)：开天地黄忠初登场
http:///html5-tutorial-354344.html
(二)：秀身手勇猛如当年
http:///html5-tutorial-354345.html
(三)：遇红颜英雄亦多情
http:///html5-tutorial-354347.html
首先，素材问题，苦寻半个月，一直没找到满意的素材，不得已求助于黄忠黄老将军，黄老将军跟我说自从被马忠那个孙子暗算之后，已经有几百年没上战场了，一听说要上战场，立刻兴奋的不得了，直接就跳着《江南style》来了首《好汉歌》，那架势真有像是从梁山泊穿越而来的李逵，唱完后抄起家伙吼了声：“Go”，我也不敢怠慢，赶紧拿起电脑，准备起来。本次估且先拿黄老将军来挡一下，如果哪位朋友有好的素材，希望能提供一下，好让一把年纪的黄老将军休息一下。
由于黄老将军过于兴奋，只顾着一个劲儿的向前冲，所以只有向右的动作，没有向左的动作，为此我不得不使用lufylegend引擎中的LAnimation对象，因为LAnimation对象可以使用图片的镜像，来显示与上面的图片相反的动作。
考虑到战场上有各种各样的士兵武将，但是他们都属于人，有一些共通的属性，况且黄老将军过于兴奋，为了便于管理和操作，本次开发依然以OOP思想为基础(黄老将军听了后自言自语道，哦哦屁？)，先来建一个人物的父类Character
function Character(dataList,coordinateList,locationList,speed){
base(this,LSprite,[]);
};来看看这四个参数：
dataList：举个例子，看上面黄老将军的图片，有很多组动作，每组动作为一张图片，参数dataList就是这几组图片
coordinateList：LAnimation对象需要根据坐标来顺序显示图片，以形成动画，这个即使要传入LAnimation对象的坐标数组
locationList：考虑到人物的每个动作的图片的大小都不一样，位置也不一样，这个数组用来调整相对应动作组图片的显示位置
speed：方便控制人物动作在时间轴上每帧的频率
下面是Character类的完整构造器
function Character(dataList,coordinateList,locationList,speed){
base(this,LSprite,[]);
var self = this;
//初始化
//动作
self.action = ACTION.STAND;
//方向
self.direction = DIRECTION.RIGHT;
//保存参数
self.coordinateList = coordinateList;
self.locationList = locationList;
self.dataList = dataList;
self.speed = speed==null?1:speed;
//保存初始化动作的图片
self.data = dataList[ACTION.STAND];
self.speedIndex = 0;
//利用LAnimation对象来显示连贯的动作
self.anime = new LAnimation(self,self.data,self.coordinateList[0]);
self.anime.setAction(0);
self.anime.x = -self.data.width*0.5;
self.anime.y = -self.data.height;
};其中ACTION变量和DIRECTION变量为别如下
//动作
var ACTION = {STAND:0,MOVE:1,RUN:2,JUMP:3,ATTACK:4};
//方向
var DIRECTION = {RIGHT:"right",LEFT:"left"};下面详细介绍下LAnimation类，LAnimation类是通过顺序或倒序播放一组图片来形成动画，它的官方解释如下
LAnimation类 LAnimation(layer,data,list)
■作用：
■参数：
上面的三个参数中，layer是一个LSprite对象，data是一个LBitmapData对象，这些都比较好理解，第三个参数list是一个二维数组，它的格式如下
[
[{x:0,y:0},{x:0,y:0},{x:0,y:0}],
[{x:0,y:0},{x:0,y:0},{x:0,y:0}],
[{x:0,y:0},{x:0,y:0},{x:0,y:0}]
]LAnimation对象的setAction函数，有四个参数，分别为
LAnimation.setAction(rowIndex,colIndex,mode,isMirror) 参数： rowIndex：播放动画的行号 colIndex：播放动画的列号 mode：(1,0,-1)分别代表(正序播放,静止,倒序播放) isMirror：Boolean型，当设定为true的时候，图片显示为水平翻转后的镜像
当然，光有一个构造器是不行的，因为LAnimation对象是通过调用onframe函数来实现播放的，所以给Character类添加一个函数，如下
Character.prototype.onframe = function (){
var self = this;
//人物动作速度控制
if(self.speedIndex++ < self.speed)return;
self.speedIndex = 0;
//人物动画播放
self.anime.onframe();
};如此一来，只要不断的调用Character的实例的onframe函数，就能实现动态播放了。
黄老将军可能对比不感兴趣，此时已经在一旁打起了呼噜，我必须加快速度了......
考虑到战场上敌方和我方会有不同处理，建立一个继承自Character类的子类，如下
function Player(datalist,coordinateList,locationList,speed){
base(this,Character,[datalist,coordinateList,locationList,speed]);
};因为想要实例化这个类，需要三个参数，我再新建一个对象来获取这三个参数
var CharacterList = {
huangzhong:function(){
//图片数据
var dataList = new Array();
dataList.push(new LBitmapData(imglist["player_stand"],0,0,106,77));
dataList.push(new LBitmapData(imglist["player_move"],0,0,115,85));
dataList.push(new LBitmapData(imglist["player_run"],0,0,125,87));
dataList.push(new LBitmapData(imglist["player_jump"],0,0,131,212));
dataList.push(new LBitmapData(imglist["player_attack"],0,0,242,143));
//图片分割数据
var coordinateList = new Array();
coordinateList.push(LGlobal.pideCoordinate(1272,77,1,12));
coordinateList.push(LGlobal.pideCoordinate(920,85,1,8))