本文目录
- easeljs怎么通过id获取container
- 使用canvas为什么要用easeljs
- 如何使用Createjs来编写HTML5游戏完成一个简单的打飞机游戏
- flash easeljs导出的js怎么使用
- easeljs的drawrect的高度参数怎么会翻倍
- html JavaScript html5 easeljs bitmap 图片宽高设置
easeljs怎么通过id获取container
setFPS、getFPS是EaselJS中Ticker类用于设置和获取帧频的函数。 EaselJS中Ticker类动画机制: 1、 逐帧动画 逐帧动画,把动画(例如人物动作)进行分解,然后绘制出连续的
使用canvas为什么要用easeljs
是一个警告,脚本没有错误也会出现,只是提醒开发者:html5 canvas中,时间轴编号是从0开始。而在swf中,时间轴编号是从1开始。 如:你在html5 canvas中,执行this.gotoAndStop(5),实际停在时间线的第4帧上,而在swf中,则停在时间线的第5帧上。
如何使用Createjs来编写HTML5游戏完成一个简单的打飞机游戏
CreateJS包含4个部分,EaselJS、TweenJS、PreloadJS、SoundJS,其中最主要的部分EaselJS包含了开发Html5游戏的所有功能,仅仅使用EaselJS几乎可以完成所有的开发工作,其余三项可以看作EaselJS的辅助工具。比如响应tick事件然后改变元素坐标就可以实现动画功能,而使用TweenJS来创建补间动画,则可以省去你很多代码,简化了操作。一个简单的tick动画看起来是这样的:《pre t=“code“ l=“js“》var stage, circle;
function init(){
stage = new createjs.Stage(document.getElementById(’game’));
createjs.Ticker.addEventListener(“tick“, handleTick);
createjs.Ticker.setFPS(60);
circle = new createjs.Shape();
circle.graphics.f(“red“).dc(0,0,50);
circle.x = 0;
circle.y = 100;
stage.addChild(circle);
circle.addEventListener(“click“, function(event){
createjs.Ticker.setPaused(!createjs.Ticker.getPaused());
});
}
function handleTick(event){
if(!event.paused){
circle.x +=5;
if(circle.x 》 1000){
circle.x = 0;
}
}
stage.update();
}
-container
flash easeljs导出的js怎么使用
是一个警告,脚本没有错误也会出现,只是提醒开发者:html5 canvas中,时间轴编号是从0开始。而在swf中,时间轴编号是从1开始。
如:你在html5 canvas中,执行this.gotoAndStop(5),实际停在时间线的第4帧上,而在swf中,则停在时间线的第5帧上。
-c
easeljs的drawrect的高度参数怎么会翻倍
《canvas id=“gameview“ width=“400“ height=“400“ 》
设置一下canvas的width和height,如果没有设置,则默认是width:300px,height:150px.
此时如果你又用css规定了canvas的宽度和高度的样式,那就会产生这种不想出现的缩放效果。
可以参考:http://www.cnblogs.com/artwl/archive/2012/02/28/2372042.html
-container
html JavaScript html5 easeljs bitmap 图片宽高设置
中文API没有,自己去官网看英文的吧,英文也不难看懂。
设置宽高用scaleX,scaleY属性。
==================================
img.getBounds();获取img的外界矩形,相对于img的本地坐标(不是img的父容器坐标,这点和flash中不一样)。
img.setbounds(0,0,100,100);4个参数分别是x/y/width/height
其实setbounds不应该这么用,官方API中说的清楚,这个方法是为那些无法getBounds的对象用的,比如Shape(矢量图,用了graphics)/Text等。
举个例子:
var circle=new createjs.Shape();
circle.graphics.beginFill(“#00ff00“);
circle.graphics.drawCircle(0,0,40);
stage.addChild(circle);
console.log(circle.getBounds());
上面这段代码console.log(circle.getBounds());会输出null。也就是说createjs引擎没有实现Shape计算外接矩形的方法。(事实上这个方法实现起来确实很麻烦,也很影响效率)。这个方法有时候很有用,所以createjs提供了一个setbounds()方法,让用户自己设置原始的外接矩形。-c
======================================
总结:
1、 createjs中,设置宽高应该用scaleX /scaleY属性。
2、如果用到了graphics或Text,还要用getBounds(),画完矢量图,或者设置完文字内容,需要自己调用TextField对象或者使用了的对象的setBounds()方法,手动设置对象的外接矩形。-container
===================================
题外话:
ActionScript3.0中设置width和height属性,其实最终也是设置的scaleX和ScaleY,只是引擎进行了封装而已。