createjs进阶—更好的利用flash cc进行项目实战

  • 内容
  • 评论
  • 相关

本人一直认为createjs的成功之处就在于使用flashcc进行开发不仅非常方便,而且非常迅速。举个例子,我现在要做个游戏,需要主角人物跑动的特效,你自己完全可以不动手,写出来一个框架后,让动画师自己加上去,导出后把文件给你或者上传svn即可。甚至,动画师自己可以替换资源来看动画做出来的效果。

那么我今天就来讲讲如何更好的使用flashcc。
首先我还是拿出上次的demo,但是这次我不直接放在舞台上,而是在库里做一个类链接。
QQ图片20160223133326
发布出来,大家可以看到已经有了view1
QQ图片20160223133609
接下来只要在js上加上
var view1;
view1= new lib.view1();
stage.addChild(view1);
屏幕上就可以显示出刚才在flashcc里面经过类链接的影片剪辑。
但是有时候有些额外的对象或者方法是需要放在view1里面的,那怎么办呢?
我们新建一个View1的类把flashcc里的view1给复合进去。
QQ图片20160223135737
然后创建这个类把它放在舞台上
QQ图片20160223135802
有些人会问,为什么我不直接继承view1,而是继承container复合view1呢?
是这样的,flashcc创建对象的时候是经过特殊处理的,它创建的对象是不能直接继承,所以我们要复合。
好了,加上一些框架和自适应的代码。
QQ图片20160223140311
我们的demo就可以显示出来了
QQ图片20160223140501
这是pc端上的效果,移动端可以打开chrome的模拟器,代码也是兼容的。
基本所有程序要用到的动画,图片,都可以用这种方法创建。(注意命名就可以了)
这里还有一个诀窍,我们可以在帧上加上dispatchEvent,来告知程序动画结束了,或者播放到哪个关键地方了。
比如这里我们在动画的末尾帧上加上:
this.stop();
if(model) model.dispatchEvent("complete");
QQ图片20160223141254
然后在js上新建一个model来专门处理接收事件,记得要是EventDispatcher类
model = new createjs.EventDispatcher();
然后侦听
 model.addEventListener("complete",function (){
        alert("complete");
    })
我们的结果就出来了
QQ图片20160223141540
这个方法可以用在某些游戏角色里,把所有动作放在时间轴上,然后做完哪个动作就可以告知程序,程序可以做出相应的逻辑。(不过已现在的createjs的movieclip效率,如果要做些烧cpu的游戏我推荐还是用精灵图也就是Sprite)
 
好了,我们的项目做完了,之后如果要换皮,直接交给动画师就ok了,动画师只要在你有类链接的影片剪辑里修改,改好后把assets.js文件给你覆盖就可以了,十分方便。

评论

7条评论
  1. Gravatar 头像

    回复

    alert('play')事件在哪里出来的?

    • Gravatar 头像

      ajex 回复

      @豪 fla demo中的帧上写的

  2. Gravatar 头像

    匿名 回复

    我看了你写的例子,有一点不知道怎么用,我想写个方法在show里,需要用到view1里面的影片,那个路径我要怎么写的,比如我想这个方法控制view1里面的btn按钮,要怎么写这个btn的路径的?

  3. Gravatar 头像

    匿名 回复

    请问这段代码的作用是?

  4. Gravatar 头像

    匿名 回复

    请问这段代码的作用是?
    function handleFileLoad(evt) {
    if (evt.item.type == "image") { images[evt.item.id] = evt.result; }
    }

发表评论

电子邮件地址不会被公开。