1- Egret框架入门第一步 - 电影剪辑
1+ Egret框架入门第一步 - 影片剪辑
22===============
33
4- 电影剪辑 (MovieClip)是Flash程序员非常熟悉的东西了,历史悠久,虽然Flash历经多次版本变更,但电影剪辑迄今为止一直被广泛的使用着 。Egret框架也支持MovieClip,您可以用Flash Pro软件去制作MovieClip,然后使用Egret的扩展工具([ 介绍] ( # ) | [ 下载] ( # ) ),导出Egret可识别的格式(类似spritesheet,包括图片和描述文件)。
4+ 影片剪辑 (MovieClip)是Flash程序员非常熟悉的东西了,历史悠久,虽然Flash历经多次版本变更,但影片剪辑迄今为止一直被广泛的使用着 。Egret框架也支持MovieClip,您可以用Flash Pro软件去制作MovieClip,然后使用Egret的扩展工具([ 介绍] ( # ) | [ 下载] ( # ) ),导出Egret可识别的格式(类似spritesheet,包括图片和描述文件)。
55
66这里我们还是先使用samples里自带的资源,拷贝资源目录下的两个文件:monkey.json和monkey.png,将这两个文件复制到HelloEgret项目的resources/assets目录下面。
77
88先分析一下monkey.json这个描述文件,是如下的结构:
99
1010![ github] ( https://raw.githubusercontent.com/NeoGuo/html5-documents/master/egret/images/egret_monkey_json.png " json ")
1111
12- 对应到Flash的时间轴上,你可以理解为"stand"是一个关键帧,此帧上又嵌套了一个电影剪辑 "stand_inner",stand_inner的时间轴是19个帧组成,每一帧上放了一个小图片。当你把主时间轴的播放头指向"stand"
12+ 对应到Flash的时间轴上,你可以理解为"stand"是一个关键帧,此帧上又嵌套了一个影片剪辑 "stand_inner",stand_inner的时间轴是19个帧组成,每一帧上放了一个小图片。当你把主时间轴的播放头指向"stand"
1313,则stand_inner将会不断的重复播放。这样说,应该让您更容易理解Egret的MovieClip的行为方式。
1414
1515来看看如何实现,首先还是修改加载配置:
@@ -37,12 +37,12 @@ RES.loadConfig("resources/resource.json","resources/");
3737RES.loadGroup("demo3");
3838```
3939
40- 然后将大图和描述数据作为参数,创建电影剪辑 :
40+ 然后将大图和描述数据作为参数,创建影片剪辑 :
4141
4242```
4343var data = RES.getRes("monkey_json");//获取描述
4444var texture = RES.getRes("monkey_png");//获取大图
45- var monkey = new egret.MovieClip(data, texture);//创建电影剪辑
45+ var monkey = new egret.MovieClip(data, texture);//创建影片剪辑
4646this.addChild(monkey);//添加到显示列表
4747monkey.setInterval(1);//设置动画每帧的时间间隔,单位是毫秒,数值越小,动作越快
4848monkey.gotoAndPlay("stand");
@@ -74,7 +74,7 @@ class Demo3 extends egret.DisplayObjectContainer {
7474 private onResourceLoadComplete():void {
7575 var data = RES.getRes("monkey_json");//获取描述
7676 var texture = RES.getRes("monkey_png");//获取大图
77- var monkey = new egret.MovieClip(data, texture);//创建电影剪辑
77+ var monkey = new egret.MovieClip(data, texture);//创建影片剪辑
7878 this.addChild(monkey);//添加到显示列表
7979 monkey.setInterval(1);//设置动画每帧的时间间隔,单位是毫秒,数值越小,动作越快
8080 monkey.gotoAndPlay("stand");
@@ -86,7 +86,7 @@ class Demo3 extends egret.DisplayObjectContainer {
8686
8787![ github] ( https://raw.githubusercontent.com/NeoGuo/html5-documents/master/egret/images/movieclip_monkey.png " monkey ")
8888
89- 电影剪辑的常用方法 :
89+ 影片剪辑的常用方法 :
9090
9191```
9292monkey.gotoAndPlay("stand");//播放指定动画
0 commit comments