摘要:
KineticJS教程(12) 作者: ysm 12.舞台12.1.舞台的大小舞台创建后还可以用舞台对象的setSize(width, height)方法来设置舞台的宽度与高度。12.2.舞台的缩放舞台创建后还可以用舞台对象的setScale()方法来对舞台进行缩放。setScale方法可以接受一个... 阅读全文
摘要:
KineticJS教程(11) 作者: ysm 11.对象的上下关系11.1.层的上下关系Kinetic的层是按照添加到舞台的次序,由下向上排列,上层遮盖下层的图形。每个层各自有一个ZIndex编号来表示在层级中的上下位置,编号从0开始,表示最底层,向上层依次增1。Kinetic提供了几个方法用于调... 阅读全文
摘要:
KineticJS教程(10) 作者: ysm 10.在容器之间移动图形对象Kinetic支持通过图形对象的moveTo(container)方法把图形对象从一个容器移动到另一个容器里,这个容器指的可以是另一个舞台(Stage)、一个层(Layer)或是一个组(Group)。另外也可以把一个组(Gr... 阅读全文
摘要:
KineticJS教程(9) 作者: ysm 9.选择器Kinetic在舞台、层和组对象上都提供了get方法,用于返回这三者中包含的对象。9.1.根据ID获取对象要用id获取对象,首先要给对象赋予一个id,比如下面代码创建的Rect的id就是id1:要注意的是,id是唯一的,不同对象不能使用相同的i... 阅读全文
摘要:
KineticJS教程(8) 作者: ysm 8.动画动画就是一帧帧的画面按照时间间隔显示出来,Kinetic给我们提供了一个舞台对象的onFrame方法,用这个方法可以绑定一个动画方法,我们要显示的动画的每一帧画面就是在这个方法中完成绘制的。其中,这个方法接受一个对象frame为参数,此参数对象包... 阅读全文
摘要:
KineticJS教程(7) 作者: ysm 7.图形变换7.1.线性变化Kinetic提供了一个图形对象的transitionTo(config)方法实现图形的线性变换,也就是从原始的状态线性变换到新的状态,这里的状态是指的尺度上的参数。方法的config参数也就是有关图形尺度的一些参数,比如 x... 阅读全文
摘要:
KineticJS教程(6) 作者: ysm 6.拖拽6.1.拖拽功能要实现Kinetic对象的拖拽功能很简单,只需要将图形对象的draggable属性设为true就可以了。这种拖拽功能还可以应用到组(Group)、层(Layer)和舞台(Stage),设置方法类似。不过要注意的是,应用到组或层上时... 阅读全文
摘要:
KineticJS教程(5) 作者: ysm 5.事件响应5.1.图形的事件响应图形对象对事件的响应处理可以使用 on() 方法绑定事件类型和相应方法。 On() 方法需要一个事件类型参数和相应方法,其中所支持的事件类型包括: mouseover, mouseout, mousemove, mous... 阅读全文
摘要:
KineticJS教程(4) 作者: ysm 4.图形样式4.1.填充Kinetic中图形的填充属性可以在构造方法中的config参数中的fill属性进行设定,也可以用图形对象的setFill方法进行设定。不过要注意,setFill使用的填充类型必须与创建这个对象时的config中所用的填充类型相同... 阅读全文
摘要:
KineticJS教程(3) 作者: ysm 3.图形对象3.1.ShapeKinetic提供了一个Shape对象用于在层上绘制图形,我们可以通过Kinetic.Shape()构造方法返回一个Shape对象:Shape方法的config参数是关于具体的绘图参数的数组对象,Kinetic就是根据这个参... 阅读全文