本课程介绍HTML5类库套件createJS之一的EaselJS的基础使用,EaselJS用来帮助简化处理HTML5画布的相关功能
CreateJS是一套包含了各种方便开发HTML5应用的Javascript类库和工具的套件,主要包含如下四个类库:
TweenJS - 用来帮助调整HTML5和Javascript属性
PreloadJS - 帮助管理和协调加载中的一些资源
EaselJS 使用比较简单,它提供了一套完整,层次化显示列表的互动方式来更简单的处理HTML5画布
再使用如下即可获取stage:
varcanvas=document.getElementById("myCanvas");varstage=newcreatejs.Stage(canvas);EaselJS包含了很多的Graphics类,用来帮助处理图形相关的操作,使用方法类似原生的画布,但是添加了一些自己的方法,通常情况下我们不直接处理Graphics,而使用Shape类来处理,注意相关方法是可以使用链式操作滴。
circle.graphics.setStrokeStyle(5).beginStroke("rgba(0,0,0,.5)").beginFill("orange").drawCircle(0,0,50);第二节:EaselJS生成更多图形
第三节:避免多次的调用update方法
这样绘制图形后,就不必调用相关update方法啦
Shape类提供了一些属性可以方便的修改图形的相关属性,例如:
图形缩放
旋转效果
本节相关代码将生成5个不同属性的圆形,并且给每一个圆形都添加相关的鼠标事件,例如,点击,鼠标移动出图形等
使用EaselJS生成文字非常简单,如下:
vartheText=newcreatejs.Text("极客标签","normal32pxmicrosoftyahei","#222222");开始学习课程:http://www.gbtags.com/gb/gbliblist/106.htm
