annie.Shape Class
矢量对象
Methods
- _updateSplitBounds
- addDraw
- addEventListener
- addSound
- arcTo
- beginBitmapFill
- beginBitmapStroke
- beginFill
- beginLinearGradientFill
- beginLinearGradientStroke
- beginRadialGradientFill
- beginRadialGradientStroke
- beginStroke
- bezierCurveTo
- Bitmap
- changeColor
- clear
- clearCustomTransform
- closePath
- decodePath
- destroy
- dispatchEvent
- DisplayObject
- drawArc
- drawCircle
- drawEllipse
- drawRect
- drawRoundRect
- endFill
- endStroke
- getBitmapStyle static
- getDrawRect
- getGradientColor static
- getRGBA static
- getSound
- getWH
- globalToLocal
- hasEventListener
- hitTestPoint
- lineTo
- localToGlobal
- moveTo
- quadraticCurveTo
- removeAllEventListener
- removeEventListener
- removeSound
- setLineDash
- startDrag
- stopAllSounds
- stopDrag
Properties
Methods
_updateSplitBounds
_updateSplitBounds
()
private
更新boundsList矩阵
addDraw
addDraw
(
-
commandName
-
params
)
Void
public
添加一条绘画指令,具体可以查阅Html Canvas画图方法
Parameters:
name | type | flag | description |
---|---|---|---|
commandName
| String | ctx指令的方法名 如moveTo lineTo arcTo等 | |
params
| Array |
Returns:
addEventListener
addEventListener
(
-
type
-
listener
-
useCapture
)
Void
public
给对象添加一个侦听
Parameters:
name | type | flag | description |
---|---|---|---|
type
| String | 侦听类型 | |
listener
| Function | 侦听后的回调方法,如果这个方法是类实例的方法,为了this引用的正确性,请在方法参数后加上.bind(this); | |
useCapture
| Boolean | true 捕获阶段 false 冒泡阶段 默认 true |
Returns:
Example:
this.addEventListener(annie.Event.ADD_TO_STAGE,function(e){console.log(this);}.bind(this));
addSound
addSound
(
-
sound
)
Void
public
返回一个id,这个id你要留着作为删除他时使用。 这个声音会根据这个显示对象添加到舞台时播放,移出舞台而关闭
Parameters:
name | type | flag | description |
---|---|---|---|
sound
| annie.Sound |
Returns:
arcTo
arcTo
(
-
x
-
y
)
Void
public
从上一点画弧到某一点,如果没有设置上一点,则上一点默认为(0,0)
Parameters:
name | type | flag | description |
---|---|---|---|
x
| Number | ||
y
| Number |
Returns:
beginBitmapFill
beginBitmapFill
(
-
image
-
matrix
)
Void
public
位图填充 一般给Annie2x用
Parameters:
name | type | flag | description |
---|---|---|---|
image
| Image | ||
matrix
| Array |
Returns:
beginBitmapStroke
beginBitmapStroke
(
-
image
-
matrix
-
lineWidth
-
cap
-
join
-
miter
)
Void
public
线条位图填充 一般给Annie2x用
Parameters:
name | type | flag | description |
---|---|---|---|
image
| Image | ||
matrix
| Array | ||
lineWidth
| Number | ||
cap
| String | 线头的形状 butt round square 默认 butt | |
join
| String | 线与线之间的交接处形状 bevel round miter 默认miter | |
miter
| Number | 正数,规定最大斜接长度,如果斜接长度超过 miterLimit 的值,边角会以 lineJoin 的 "bevel" 类型来显示 默认10 |
Returns:
beginFill
beginFill
(
-
color
)
Void
public
开始绘画填充,如果想画的东西有颜色填充,一定要从此方法开始
Parameters:
name | type | flag | description |
---|---|---|---|
color
| String | 颜色值 单色和RGBA格式 |
Returns:
beginLinearGradientFill
beginLinearGradientFill
(
-
points
-
colors
)
Void
public
线性渐变填充 一般给Annie2x用
Parameters:
name | type | flag | description |
---|---|---|---|
points
| Array | 一组点 | |
colors
| Array | 一组颜色值 |
Returns:
Example:
var shape=new annie.Shape();
shape.beginLinearGradientFill([0,0,200,0],[[0,"#ff0000",1],[0.164706,"#ffff00",1],[0.364706,"#00ff00",1],[0.498039,"#00ffff",1],[0.666667,"#0000ff",1],[0.831373,"#ff00ff",1],[1,"#ff0000",1]]);
shape.drawRect(0,0,200,200);
shape.endFill();
s.addChild(shape);
beginLinearGradientStroke
beginLinearGradientStroke
(
-
points
-
colors
-
lineWidth
-
cap
-
join
-
miter
)
Void
public
画线性渐变的线条 一般给Annie2x用
Parameters:
name | type | flag | description |
---|---|---|---|
points
| Array | 一组点 | |
colors
| Array | 一组颜色值 | |
lineWidth
| Number | ||
cap
| Number | 线头的形状 0 butt 1 round 2 square 默认 butt | |
join
| Number | 线与线之间的交接处形状 0 miter 1 bevel 2 round 默认miter | |
miter
| Number | 正数,规定最大斜接长度,如果斜接长度超过 miterLimit 的值,边角会以 lineJoin 的 "bevel" 类型来显示 默认10 |
Returns:
beginRadialGradientFill
beginRadialGradientFill
(
-
points
-
colors
-
matrixDate
)
Void
public
径向渐变填充 一般给Annie2x用
Parameters:
name | type | flag | description |
---|---|---|---|
points
| Array | 一组点 | |
colors
| Array | 一组颜色值 | |
matrixDate
| Object | 如果渐变填充有矩阵变形信息 |
Returns:
Example:
var shape=new annie.Shape();
shape.beginRadialGradientFill([100,100,100,100,100],[[0,"#00ff00",1],[1,"#000000",1]]);
shape.drawRect(0,0,200,200);
shape.endFill();
s.addChild(shape);
beginRadialGradientStroke
beginRadialGradientStroke
(
-
points
-
colors
-
lineWidth
-
cap
-
join
-
miter
)
Void
public
画径向渐变的线条 一般给Annie2x用
Parameters:
name | type | flag | description |
---|---|---|---|
points
| Array | 一组点 | |
colors
| Array | 一组颜色值 | |
lineWidth
| Number | ||
cap
| String | 线头的形状 butt round square 默认 butt | |
join
| String | 线与线之间的交接处形状 bevel round miter 默认miter | |
miter
| Number | 正数,规定最大斜接长度,如果斜接长度超过 miterLimit 的值,边角会以 lineJoin 的 "bevel" 类型来显示 默认10 |
Returns:
beginStroke
beginStroke
(
-
color
-
lineWidth
-
cap
-
join
-
miter
)
Void
public
给线条着色
Parameters:
name | type | flag | description |
---|---|---|---|
color
| String | 颜色值 | |
lineWidth
| Number | 宽度 | |
cap
| Number | 线头的形状 0 butt 1 round 2 square 默认 butt | |
join
| Number | 线与线之间的交接处形状 0 miter 1 bevel 2 round 默认miter | |
miter
| Number | 正数,规定最大斜接长度,如果斜接长度超过 miterLimit 的值,边角会以 lineJoin 的 "bevel" 类型来显示 默认10 |
Returns:
bezierCurveTo
bezierCurveTo
(
-
cp1X
-
cp1Y
-
cp2X
-
cp2Y
-
x
-
y
)
Void
public
三次贝赛尔曲线 从上一点画二次贝赛尔曲线到某一点,如果没有设置上一点,则上一占默认为(0,0)
Parameters:
name | type | flag | description |
---|---|---|---|
cp1X
| Number | 1控制点X | |
cp1Y
| Number | 1控制点Y | |
cp2X
| Number | 2控制点X | |
cp2Y
| Number | 2控制点Y | |
x
| Number | 终点X | |
y
| Number | 终点Y |
Returns:
Bitmap
Bitmap
(
-
bitmapData
-
rect
)
public
构造函数
Parameters:
name | type | flag | description |
---|---|---|---|
bitmapData
| Image | Video | Canvas | 一个HTMl Image的实例,小程序或者小游戏里则只能是一个图片的地址 | |
rect
| annie.Rectangle | 设置显示Image的区域,不设置值则全部显示Image的内容,小程序或者小游戏里没有这个参数 |
Example:
//html5
var imgEle=new Image();
imgEle.onload=function (e) {
var bitmap = new annie.Bitmap(imgEle)
//居中对齐
bitmap.x = (s.stage.desWidth - bitmap.width) / 2;
bitmap.y = (s.stage.desHeight - bitmap.height) / 2;
s.addChild(bitmap);
//截取图片的某一部分显示
var rect = new annie.Rectangle(0, 0, 200, 200),
rectBitmap = new annie.Bitmap(imgEle, rect);
rectBitmap.x = (s.stage.desWidth - bitmap.width) / 2;
rectBitmap.y = 100;
s.addChild(rectBitmap);
}
imgEle.src='http://test.annie2x.com/test.jpg';
//小程序或者小游戏
var imgEle="http://test.annie2x.com/test.jpg";
var bitmap=new annie.Bitmap(imgEle);
s.addChild(bitmap);
changeColor
changeColor
(
-
infoObj
)
Void
public
如果有的话,改变矢量对象的边框或者填充的颜色.
Parameters:
name | type | flag | description | ||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
infoObj
| Object |
|
Returns:
clear
clear
()
Void
public
清除掉之前所有绘画的东西
Returns:
clearCustomTransform
clearCustomTransform
(
-
transId
)
public
如果你在mc更改了对象的x y scale rotation alpha,最后想还原,不再需要自我控制,可以调用这方法
Parameters:
name | type | flag | description |
---|---|---|---|
transId
| Number | //0->x,1->y,2->scaleX,3->scaleY,4->rotation,5->alpha,-1->all |
closePath
closePath
()
Void
public
闭合一个绘画路径
Returns:
decodePath
decodePath
(
-
data
)
Void
public
解析一段路径 一般给Annie2x用
Parameters:
name | type | flag | description |
---|---|---|---|
data
| Array |
Returns:
destroy
destroy
()
Void
public
销毁一个对象 销毁之前一定要做完其他善后工作,否则有可能会出错 特别注意不能在对象自身方法或事件里调用此方法。 比如,不要在显示对象自身的 annie.Event.ON_REMOVE_TO_STAGE 或者其他类似事件调用,一定会报错
Returns:
dispatchEvent
dispatchEvent
(
-
event
-
data
-
useCapture
)
Boolean
public
广播侦听
Parameters:
name | type | flag | description |
---|---|---|---|
event
| annie.Event | String | 广播所带的事件对象,如果传的是字符串则自动生成一个annie.Event对象,事件类型就是传入进来的字符串的值 | |
data
| Object | 广播后跟着事件一起传过去的其他任信息,默认值为null | |
useCapture
| Boolean | true 捕获阶段 false 冒泡阶段 默认 true |
Returns:
如果有收听者则返回true
Example:
var mySprite=new annie.Sprite(),
yourEvent=new annie.Event("yourCustomerEvent");
yourEvent.data={a:1,b:2,c:"hello",d:{aa:1,bb:2}};
mySprite.addEventListener("yourCustomerEvent",function(e){
console.log(e.data);
})
mySprite.dispatchEvent(yourEvent);
DisplayObject
DisplayObject
()
public
drawArc
drawArc
(
-
x
-
y
-
radius
-
start
-
end
)
Void
public
画一个弧形
Parameters:
name | type | flag | description |
---|---|---|---|
x
| Number | 起始点x | |
y
| Number | 起始点y | |
radius
| Number | 半径 | |
start
| Number | 开始角度 | |
end
| Number | 结束角度 |
Returns:
drawCircle
drawCircle
(
-
x
-
y
-
radius
)
Void
public
画一个圆
Parameters:
name | type | flag | description |
---|---|---|---|
x
| Number | 圆心x | |
y
| Number | 圆心y | |
radius
| Number | 半径 |
Returns:
drawEllipse
drawEllipse
(
-
x
-
y
-
w
-
h
)
Void
public
画一个椭圆
Parameters:
name | type | flag | description |
---|---|---|---|
x
| Number | ||
y
| Number | ||
w
| Number | ||
h
| Number |
Returns:
drawRect
drawRect
(
-
x
-
y
-
w
-
h
)
Void
public
画一个矩形
Parameters:
name | type | flag | description |
---|---|---|---|
x
| Number | ||
y
| Number | ||
w
| Number | ||
h
| Number |
Returns:
drawRoundRect
drawRoundRect
(
-
x
-
y
-
w
-
h
-
rTL
-
rTR
-
rBL
-
rBR
)
Void
public
画一个带圆角的矩形
Parameters:
name | type | flag | description |
---|---|---|---|
x
| Number | 点x值 | |
y
| Number | 点y值 | |
w
| Number | 宽 | |
h
| Number | 高 | |
rTL
| Number | 左上圆角半径 | |
rTR
| Number | 右上圆角半径 | |
rBL
| Number | 左下圆角半径 | |
rBR
| Number | 右上圆角半径 |
Returns:
endFill
endFill
()
Void
public
结束填充
Returns:
endStroke
endStroke
()
Void
public
结束画线
Returns:
getBitmapStyle
getBitmapStyle
(
-
image
)
CanvasPattern
public
static
设置位图填充时需要使用的方法,一般给用户使用较少,Annie2x工具自动使用
Parameters:
name | type | flag | description |
---|---|---|---|
image
| Image | HTML Image元素 |
Returns:
getDrawRect
getDrawRect
()
annie.Rectangle
public
获取对象形变后外切矩形 可以从这个方法中读取到此显示对象变形后x方向上的宽和y方向上的高
Returns:
getGradientColor
getGradientColor
(
-
points
-
colors
)
Any
public
static
通过一系统参数获取生成颜色或渐变所需要的对象 一般给用户使用较少,Annie2x工具自动使用
Parameters:
name | type | flag | description |
---|---|---|---|
points
| Object | ||
colors
| Object |
Returns:
getRGBA
getRGBA
(
-
color
-
alpha
)
String
public
static
通过24位颜色值和一个透明度值生成RGBA值
Parameters:
name | type | flag | description |
---|---|---|---|
color
| String | 字符串的颜色值,如:#33ffee | |
alpha
| Number | 0-1区间的一个数据 0完全透明 1完全不透明 |
Returns:
getSound
getSound
(
-
id
)
Array
Parameters:
name | type | flag | description |
---|---|---|---|
id
| Number | String |
Returns:
这个对象里所有叫这个名字的声音引用数组
getWH
getWH
()
W: number; h: number
获取宽高
Returns:
}
globalToLocal
globalToLocal
(
-
point
)
annie.Point
public
将全局坐标转换到本地坐标值
Parameters:
name | type | flag | description |
---|---|---|---|
point
| annie.Point |
Returns:
hasEventListener
hasEventListener
(
-
type
-
useCapture
)
Boolean
public
是否有添加过此类型的侦听
Parameters:
name | type | flag | description |
---|---|---|---|
type
| String | 侦听类型 | |
useCapture
| Boolean | true 捕获阶段 false 冒泡阶段 默认 true |
Returns:
如果有则返回true
hitTestPoint
hitTestPoint
(
-
hitPoint
-
isGlobalPoint
)
annie.DisplayObject
public
点击碰撞测试,就是舞台上的一个point是否在显示对象内,在则返回该对象,不在则返回null
Parameters:
name | type | flag | description |
---|---|---|---|
hitPoint
| annie.Point | 要检测碰撞的点 | |
isGlobalPoint
| Boolean | 是不是全局坐标的点,默认false是本地坐标 |
Returns:
lineTo
lineTo
(
-
x
-
y
)
Void
public
从上一点画到某一点,如果没有设置上一点,则上一点默认为(0,0)
Parameters:
name | type | flag | description |
---|---|---|---|
x
| Number | ||
y
| Number |
Returns:
localToGlobal
localToGlobal
(
-
point
)
annie.Point
public
将本地坐标转换到全局坐标值
Parameters:
name | type | flag | description |
---|---|---|---|
point
| annie.Point |
Returns:
moveTo
moveTo
(
-
x
-
y
)
Void
public
绘画时移动到某一点
Parameters:
name | type | flag | description |
---|---|---|---|
x
| Number | ||
y
| Number |
Returns:
quadraticCurveTo
quadraticCurveTo
(
-
cpX
-
cpX
-
x
-
y
)
Void
public
二次贝赛尔曲线 从上一点画二次贝赛尔曲线到某一点,如果没有设置上一点,则上一占默认为(0,0)
Parameters:
name | type | flag | description |
---|---|---|---|
cpX
| Number | 控制点X | |
cpX
| Number | 控制点Y | |
x
| Number | 终点X | |
y
| Number | 终点Y |
Returns:
removeAllEventListener
removeAllEventListener
()
Void
public
移除对象中所有的侦听
Returns:
removeEventListener
removeEventListener
(
-
type
-
listener
-
useCapture
)
Void
public
移除对应类型的侦听
Parameters:
name | type | flag | description |
---|---|---|---|
type
| String | 要移除的侦听类型 | |
listener
| Function | 侦听时绑定的回调方法 | |
useCapture
| Boolean | true 捕获阶段 false 冒泡阶段 默认 true |
Returns:
removeSound
removeSound
(
-
id
)
Void
public
删除一个已经添加进来的声音
Parameters:
name | type | flag | description |
---|---|---|---|
id
| Number | String |
Returns:
setLineDash
setLineDash
(
-
data
)
Void
设置虚线参数
Parameters:
name | type | flag | description |
---|---|---|---|
data
| Array | 一个长度为2的数组,第1个是虚线长度,第2个是虚线间隔,如果此参数为[]的空数组,则是清除虚线。 如[5,20]是画虚线,[]则是请除虚线,变为实线 |
Returns:
startDrag
startDrag
(
-
isCenter
-
bounds
)
Void
public
启动鼠标或者触摸拖动
Parameters:
name | type | flag | description |
---|---|---|---|
isCenter
| Boolean | 指定将可拖动的对象锁定到指针位置中心 (true),还是锁定到用户第一次单击该对象的位置 (false) 默认false | |
bounds
| annie.Rectangle | 相对于显示对象父级的坐标的值,用于指定 Sprite 约束矩形 |
Returns:
stopAllSounds
stopAllSounds
()
Void
public
停止这个显示对象上的所有声音
Returns:
stopDrag
stopDrag
()
停止鼠标跟随
Properties
alpha
Number
public
显示对象透明度
Default:
1
anchorX
Number
public
显示对象上x方向的缩放或旋转点
Default:
0
anchorY
Number
public
显示对象上y方向的缩放或旋转点
Default:
0
bitmapData
Any
public
小游戏不支持 小程序不支持
HTML的一个Image对象或者是canvas对象或者是video对象Default:
null
blendMode
Number
public
显示对象的混合模式 支持的混合模式大概有23种,具体查看annie.BlendMode
Default:
0
cacheAsBitmap
Unknown
是否将这个对象缓存为位图了
filters
Array
public
小游戏不支持 小程序不支持
显示对象的滤镜数组Default:
null
height
Unknown
public
获取或者设置显示对象在父级里的y方向的高,不到必要不要用此属性获取高 如果你要同时获取宽高,建议使用getWH()方法获取宽和高
hitArea
Unknown
annie.Sprite显示容器的接受鼠标点击的区域。一但设置,容器里所有子级将不会触发任何鼠标相关的事件。 相当于 mouseChildren=false,但在有大量子级显示对象的情况下,此方法的性能搞出mouseChildren几个数量级,建议使用。
Sub-properties:
-
rect
annie.Rectangle
hitTestWithPixel
Boolean
小游戏不支持 小程序不支持
是否对图片对象使用像素碰撞检测透明度,默认关闭Default:
false
instanceId
Number
public
每一个annie引擎对象都会有一个唯一的id码。
Example:
//获取 annie引擎类对象唯一码
console.log(this.instanceId);
instanceType
String
public
每一个annie类都有一个实例类型字符串,通过这个字符串,你能知道这个实例是从哪个类实例而来
isCache
Boolean
是否被缓存了
mouseEnable
Boolean
public
是否可以接受点击事件,如果设置为false,此显示对象将无法接收到点击事件
Default:
false
name
String
public
每一个显示对象都可以给他命一个名字,这样我们在查找子级的时候就可以直接用this.getChildrndByName("name")获取到这个对象的引用
Default:
""
rotation
Number
public
显示对象旋转角度
Default:
0
scaleX
Number
public
显示对象x方向的缩放值
Default:
1
scaleY
Number
public
显示对象y方向的缩放值
Default:
1
skewX
Number
public
显示对象x方向的斜切值
Default:
0
skewY
Number
public
显示对象y方向的斜切值
Default:
0
soundList
Array
public
当前对象包含的声音列表
Default:
[]
stage
Stage
public
此显示对象所在的舞台对象,如果此对象没有被添加到显示对象列表中,此对象为空。
Default:
null;
visible
Boolean
public
显未对象是否可见
Default:
0
width
Unknown
public
获取或者设置显示对象在父级里的x方向的宽,不到必要不要用此属性获取高 如果你要同时获取宽高,建议使用 getWH()方法获取宽和高
x
Number
public
显示对象位置x
Default:
0
y
Number
public
显示对象位置y
Default:
0
Events
ADD_TO_STAGE
annie.DisplayObject显示对象加入到舞台事件
CLICK
String
annie.DisplayObject鼠标或者手指单击
ENTER_FRAME
annie.DisplayObject显示对象 循环帧事件
MOUSE_DOWN
annie.DisplayObject鼠标或者手指按下事件
MOUSE_MOVE
annie.DisplayObject鼠标或者手指移动事件
MOUSE_OUT
annie.DisplayObject鼠标或者手指移出显示对象边界触发的事件
MOUSE_OVER
annie.DisplayObject鼠标或者手指移入到显示对象上里触发的事件
MOUSE_UP
annie.DisplayObject鼠标或者手指抬起事件
REMOVE_TO_STAGE
annie.DisplayObject显示对象从舞台移出事件