网站首页 > 教程分享 正文
第一节:EaselJS处理图片
使用Bitmap类可以非常方便的处理图片,Bitmap可以用来代表任何形式,比如,Canvas,视频或者图片,可以使用已经存在的元素实例化,或者使用base64。
第二节:使用sprite和SpriteSheets来处理游戏动画
Sprite用来在SpriteSheet中显示一个动画或者一系列的动画帧,SpriteSheet是一系列的图片整合到一张图片中,可以用来定义一个完整的动画,下面是一个spritesheet定义:
varspritesheet=newcreatejs.SpriteSheet({"images":[characterImage],//动画人物图片来自base64编码字符串"frames":{"height":96,"count":10,"width":75},"animations":{run:[0,9]}});
第三节:EaselJS中的"容器" (container)
Container类是EaselJS中用来管理符合图形的单位,例如,我们可以将一个人物的,头,手,脚等等放置在统一的容器中,这样一来,可以统一的管理或者动画图形。虽然容器中每一个部分都可以单独的生成动画,但是容器中的子元素都可以统一使用容器的属性来控制
本节相关代码将演示如何使用容器来定义一系列图片,并且通过定义容器来控制这一系列图片,实现统一的行为
第四节:EaselJS中的cache方法
在图形处理中,往往会有一些图形不太变化,而每次都重新渲染会使得性能比较受影响。
在EaselJS中提供了cache()方法,这个方法可以帮助生成绘制时需要使用的图形到新画布里,它不会在每一个tick中被重新绘制,因此加载速度快,性能更好
被cache的显示图形也可以自由的控制移动,旋转,淡入淡出等等属性,但图形变化了需要手动调用cache或者updateCache方法重新加载
第五节:EaselJS处理Filter(滤镜)
EaselJS包含了一些内置的滤镜方法,如下:
AlphaMapFilter : 将一个灰度图形映射到一个图形的阿尔法通道
AlphaMaskFilter: 将一个图片的阿尔法通道映射到一个显示图形的阿尔法通道
BlurFilter: 执行水平和垂直的模糊
ColorFilter: 显示对象的颜色变形
ColorMatrixFilter: 使用ColorMatrix1来变形图片
了解更多相关代码和演示,请立刻开始学习课程:
HTML5类库CreateJS系列:EaselJS画布类库基础使用(二)
:http://www.gbtags.com/gb/gbliblist/107.htm
猜你喜欢
- 2025-03-06 很少人知道的20个最好用的免费设计软件
- 2025-03-06 2015年16个最佳的免费响应式HTML5框架
- 2025-03-06 学习使用easelJS类库控制HTML5游戏角色的移动和跳跃
- 2025-03-06 面向HTML5 画布的JavaScript库Top10
- 2025-03-06 《响应式开发》16个最佳响应式HTML5框架分享
- 2025-03-06 课程速递:HTML5类库CreateJS系列:EaselJ
你 发表评论:
欢迎- 最近发表
- 标签列表
-
- css导航条 (66)
- sqlinsert (63)
- js提交表单 (60)
- param (62)
- parentelement (65)
- jquery分享 (62)
- check约束 (64)
- curl_init (68)
- sql if语句 (69)
- import (66)
- chmod文件夹 (71)
- clearinterval (71)
- pythonrange (62)
- 数组长度 (61)
- javafx (59)
- 全局消息钩子 (64)
- sort排序 (62)
- jdbc (69)
- php网页源码 (59)
- assert h (69)
- httpclientjar (60)
- postgresql conf (59)
- winform开发 (59)
- mysql数字类型 (71)
- drawimage (61)
本文暂时没有评论,来添加一个吧(●'◡'●)