制作一款HTML5 RPG游戏引擎教程(三)

《制作一款HTML5 RPG游戏引擎教程(三)》由会员上传分享，免费在线阅读，更多相关内容在工程资料-天天文库。

1、今天我们先看实现后的代码：[javascript] viewplaincopy1.var curtain = new LCurtainSample3();  2.addChild(curtain);  就两行，已经达到最简单了。那么接下来就来看看是如何实现它的。由于有很多种幕布效果，因此我只为大家实现常用的3种作为sample，大家可以借鉴一下，写出更美观的幕布。1，LCurtainSample1这个是一个基础幕布，效果是左右合拢。看看构造器中的代码：[javascript] viewplaincopy1.function LCurtainSample1(speed,onClosing,onC

2、omplete){  2.    var s = this;  3.    base(s,LSprite,[]);  4.    if(!speed)speed = LStage.width/100;  5.    if(!onClosing){  6.        s.onClosing = function(){};  7.    }else{  8.        s.onClosing = onClosing;  9.    }     10.    if(!onComplete){  11.        s.onComplete = function(){};  12.    }

3、else{  13.        s.onComplete = onComplete;  14.    }  15.    s.mode = "close";  16.    s.width1 = 0;  17.    s.width2 = 0;  18.    s.isDoClosing = false;  19.    s.speed = speed;  20.    s.addEventListener(LEvent.ENTER_FRAME,s.onshow);  21.}  这个类是继承自LSprite类，有三个参数，分别是：幕布合拢/展开的速度，幕布合拢后调用此函数，幕布展开后调用

4、此函数。mode属性顾名思义，它是用来表示接下来的工作的。当为close时说明要合拢。我们在其中定义两个属性：width1，width2，它们分别表示两块幕布显示的宽度，通过调节宽度来实现合拢。另外定义了isDoClosing来判断是否已经合拢。用speed来保存幕布移动速度，方便以后使用。然后我们给自身加一个时间轴事件，在时间轴事件中调用onshow方法绘画幕布。onshow中的完整代码：[javascript] viewplaincopy1.LCurtainSample1.prototype.onshow = function(s){  2.    s.graphics.clear(); 

5、 3.    s.graphics.drawRect(1,"black",[0,0,s.width1,LStage.height],true,"black");  4.    s.graphics.drawRect(1,"black",[LStage.width-s.width2,0,s.width2,LStage.height],true,"black");  5.    if(s.width1 >= LStage.width/2){  6.        s.mode = "open";  7.        if(s.isDoClosing == false){  8.         

6、   s.onClosing();  9.            s.isDoClosing = true;  10.        }  11.    }  12.    if(s.mode == "close"){  13.        s.width1 += s.speed;  14.        s.width2 += s.speed;  15.    }else if(s.mode == "open"){  16.        s.width1 -= s.speed;  17.        s.width2 -= s.speed;  18.        if(s.width

7、1 < 0){  19.            s.mode = "stop";  20.        }  21.    }else if(s.mode == "stop"){  22.        s.graphics.clear();  23.        s.removeEventListener(LEvent.ENTER_FRAME,s.onshow);  24.        s