424 lines
24 KiB
Markdown
424 lines
24 KiB
Markdown
|
||
## 4.5 数据格式标准说明
|
||
```javascript
|
||
{
|
||
// DragonBones 数据名称
|
||
"name": "dragonBonesName",
|
||
// 数据版本
|
||
"version": "4.5",
|
||
// 动画帧频
|
||
"frameRate": 24,
|
||
// 是否使用绝对数据 [0: 使用相对数据, 1: 使用绝对数据] (可选属性 默认: 1)
|
||
"isGlobal": 1,
|
||
// 骨架列表
|
||
"armature": [{
|
||
// 骨架名称 (一个 DragonBones 数据可包含多个骨架)
|
||
"name": "armatureName",
|
||
// 动画帧频 (可选属性 默认: 使用全局帧频)
|
||
"frameRate": 24,
|
||
// 动画类型 (可选属性 默认: "Armature")
|
||
// ["Armature": 骨骼动画, "MovieClip": 基本动画, "Stage": 场景动画]
|
||
"type": "Armature",
|
||
// 自定义数据 [任何类型] (可选属性 默认: null)
|
||
"userData": null,
|
||
// 添加到舞台后的默认行为列表 (可选属性 默认: null)
|
||
"defaultActions": [
|
||
// 此骨架播放指定动画
|
||
["gotoAndPlay", "animationName"],
|
||
// 此骨架播放指定动画并停止
|
||
["gotoAndStop", "animationName"],
|
||
],
|
||
// 此骨架包含的骨骼列表
|
||
"bone": [{
|
||
// 骨骼名称
|
||
"name": "boneName",
|
||
// 父级骨骼的名称
|
||
"parent": "parentBoneName",
|
||
// 自定义数据 [任何类型] (可选属性 默认: null)
|
||
"userData": null,
|
||
// 骨骼注册到骨架的位移/ 斜切/ 缩放 (可选属性 默认: null)
|
||
"transform": {
|
||
"x": 0.00, // 水平位移 (可选属性 默认: 0.00)
|
||
"y": 0.00, // 垂直位移 (可选属性 默认: 0.00)
|
||
"skX": 0.0000, // 水平斜切 (可选属性 默认: 0.0000)
|
||
"skY": 0.0000, // 垂直斜切 (可选属性 默认: 0.0000)
|
||
"scX": 1.0000, // 垂直缩放 (可选属性 默认: 1.0000)
|
||
"scY": 1.0000, // 垂直缩放 (可选属性 默认: 1.0000)
|
||
}
|
||
}],
|
||
// 此骨架包含的插槽列表
|
||
"slot": [{
|
||
// 插槽名称
|
||
"name": "slotName",
|
||
// 插槽所属的骨骼名称
|
||
"parent": "parentBoneName",
|
||
// 默认显示对象的索引 (可选属性 默认: 0)
|
||
"displayIndex": 0,
|
||
// 混合模式 (可选属性 默认: null)
|
||
"blendMode": null,
|
||
// 自定义数据 [任何类型] (可选属性 默认: null)
|
||
"userData": null,
|
||
// 显示对象的颜色叠加 (可选属性 默认: null)
|
||
"color": {
|
||
"aM": 100, // 透明叠加 [0~100] (可选属性 默认: 100)
|
||
"rM": 100, // 红色叠加 [0~100] (可选属性 默认: 100)
|
||
"gM": 100, // 绿色叠加 [0~100] (可选属性 默认: 100)
|
||
"bM": 100, // 蓝色叠加 [0~100] (可选属性 默认: 100)
|
||
"aO": 0.00, // 透明偏移 [-255~255] (可选属性 默认: 0)
|
||
"rO": 0.00, // 红色偏移 [-255~255] (可选属性 默认: 0)
|
||
"gO": 0.00, // 绿色偏移 [-255~255] (可选属性 默认: 0)
|
||
"bO": 0.00, // 蓝色偏移 [-255~255] (可选属性 默认: 0)
|
||
},
|
||
// 添加到舞台后的行为列表 (可选属性 默认: null)
|
||
"actions": [
|
||
// 子骨架播放指定动画 (仅对显示对象为骨架时有效)
|
||
["gotoAndPlay", "animationName"],
|
||
// 子骨架播放指定动画并停止 (仅对显示对象为骨架时有效)
|
||
["gotoAndStop", "animationName"],
|
||
]
|
||
}],
|
||
// 此骨架包含的皮肤列表
|
||
"skin": [{
|
||
// 皮肤名称
|
||
"name": "skinName",
|
||
// 此皮肤包含的插槽列表
|
||
"slot": [{
|
||
// 插槽名称
|
||
"name": "slotName",
|
||
// 此插槽包含的显示对象列表
|
||
"display": [{
|
||
// 显示对象名称
|
||
"name": "displayName",
|
||
// 显示对象类型 (可选属性 默认: "image")
|
||
// ["image": 贴图, "armature": 骨架, "mesh": 网格, ... 其他扩展的类型]
|
||
"type": "image",
|
||
// 显示对象相对于骨骼的位移/ 斜切/ 缩放 (可选属性 默认: null)
|
||
"transform": {
|
||
"x": 0.00, // 水平位移 (可选属性 默认: 0.00)
|
||
"y": 0.00, // y 垂直位移 (可选属性 默认: 0.00)
|
||
"skX": 0.0000, // 水平斜切 (可选属性 默认: 0.0000)
|
||
"skY": 0.0000, // 垂直斜切 (可选属性 默认: 0.0000)
|
||
"scX": 1.0000, // 垂直缩放 (可选属性 默认: 1.0000)
|
||
"scY": 1.0000, // 垂直缩放 (可选属性 默认: 1.0000)
|
||
},
|
||
// 显示对象的轴点 (可选属性 默认: null, 仅对贴图或网格有效)
|
||
"pivot": {
|
||
"x": 0.50, // 水平轴点 [0.00~1.00] (可选属性 默认: 0.50)
|
||
"y": 0.50, // 垂直轴点 [0.00~1.00] (可选属性 默认: 0.50)
|
||
},
|
||
// 顶点的 UV 坐标列表 (可选属性 默认: null, 仅对网格有效)
|
||
// [u0, v0, u1, v1, ...]
|
||
"uvs": [0.0000, 0.0000, 1.0000, 0.0000, 1.0000, 1.0000, 0.0000, 1.0000],
|
||
// 三角形顶点索引列表 (可选属性 默认: null, 仅对网格有效)
|
||
"triangles": [0, 1, 2, 2, 3, 0],
|
||
// 顶点权重列表 (可选属性 默认: null, 仅对网格有效)
|
||
// [顶点索引, 骨骼索引, 权重, ...]
|
||
"weights": [0, 0, 1.00, 1, 0, 1.00, 2, 0, 1.00, 3, 0, 1.00],
|
||
// 顶点相对显示对象轴点的坐标列表 (可选属性 默认: null, 仅对网格有效)
|
||
// [x0, y0, x1, y1, ...]
|
||
"vertices": [-64.00, -64.00, 64.00, -64.00, 64.00, 64.00, -64.00, 64.00],
|
||
// 蒙皮插槽注册的矩阵变换 (可选属性 默认: null, 仅对网格有效)
|
||
// [x, y, skewX, skewY, scaleX, scaleY]
|
||
"slotPose": [0.00, 0.00, 0.0000, 0.0000, 1.0000, 1.0000],
|
||
// 蒙皮骨骼注册的矩阵变换 (可选属性 默认: null, 仅对网格有效)
|
||
// [骨骼索引, x, y, skewX, skewY, scaleX, scaleY, ...]
|
||
"bonePose": [0, 0.00, 0.00, 0.0000, 0.0000, 1.0000, 1.0000],
|
||
"edges": [0, 1, 1, 2, 2, 3, 3, 1],
|
||
"userEdges": [],
|
||
}]
|
||
}]
|
||
}],
|
||
|
||
// 此骨架包含的 ik 约束列表
|
||
"ik": [{
|
||
// ik 约束名称
|
||
"name": "ikName",
|
||
// 绑定骨骼的名称
|
||
"bone": "boneName",
|
||
// 目标骨骼的名称
|
||
"target": "ikBoneName",
|
||
// 弯曲方向 (可选属性 默认: true)
|
||
// [true: 正方向/ 顺时针, false: 反方向/ 逆时针]
|
||
"bendPositive": true,
|
||
// 骨骼链的长度 (可选属性 默认: 0)
|
||
// [0: 只约束 bone, n: 约束 bone 及 bone 向上 n 级的父骨骼]
|
||
"chain": 0,
|
||
// 权重 [0.00: 不约束 ~ 1.00: 完全约束] (可选属性 默认: 1.00)
|
||
"weight": 1.00
|
||
}],
|
||
// 此骨架包含的动画列表
|
||
"animation": [{
|
||
// 动画名称
|
||
"name": "animationName",
|
||
// 循环播放次数 [0: 循环播放无限次, n: 循环播放 n 次] (可选属性 默认: 1)
|
||
"playTimes": 1,
|
||
// 动画帧长度 (可选属性 默认: 1)
|
||
"duration": 1,
|
||
// 此动画包含的关键帧列表 (可选属性 默认: null)
|
||
"frame": [{
|
||
// 帧长度 (可选属性 默认: 1)
|
||
"duration": 1,
|
||
// 帧事件 (可选属性 默认: null)
|
||
"event": "eventName",
|
||
// 帧声音 (可选属性 默认: null)
|
||
"sound": "soundName",
|
||
// 帧行为列表 (可选属性 默认: null)
|
||
"actions": [
|
||
// 此骨架播放指定动画
|
||
["gotoAndPlay", "animationName"],
|
||
// 此骨架播放指定动画并停止
|
||
["gotoAndStop", "animationName"],
|
||
]
|
||
}],
|
||
// 此动画包含的骨骼时间轴列表 (可选属性 默认: null)
|
||
"bone": [{
|
||
// 时间轴名称 (与骨骼名称对应)
|
||
"name": "boneName",
|
||
// 时间轴缩放 (可选属性 默认: 1.00)
|
||
"scale": 1.00,
|
||
// 时间轴偏移 (可选属性 默认: 0.00)
|
||
"offset": 0.00,
|
||
// 此时间轴包含的关键帧列表 (可选属性 默认: null)
|
||
"frame": [{
|
||
// 帧长度 (可选属性 默认: 1)
|
||
"duration": 1,
|
||
// 补间缓动 [0.00: 线性, null: 无缓动] (可选属性 默认: null)
|
||
"tweenEasing": 0.00,
|
||
// 补间缓动曲线 [x1, y1, x2, y2, ...: 贝塞尔曲线] (可选属性 默认: null)
|
||
"curve": [0.00, 0.00, 1.00, 1.00],
|
||
// 帧事件 (可选属性 默认: null)
|
||
"event": "eventName",
|
||
// 帧声音 (可选属性 默认: null)
|
||
"sound": "soundName",
|
||
// 骨骼的位移/ 斜切/ 缩放 (可选属性 默认: null)
|
||
"transform": {
|
||
"x": 0.00, // 水平位移 (可选属性 默认: 0.00)
|
||
"y": 0.00, // 垂直位移 (可选属性 默认: 0.00)
|
||
"skX": 0.0000, // 水平斜切 (可选属性 默认: 0.0000)
|
||
"skY": 0.0000, // 垂直斜切 (可选属性 默认: 0.0000)
|
||
"scX": 1.0000, // 垂直缩放 (可选属性 默认: 1.0000)
|
||
"scY": 1.0000 // 垂直缩放 (可选属性 默认: 1.0000)
|
||
},
|
||
}]
|
||
}],
|
||
// 此动画包含的插槽时间轴列表
|
||
"slot": [{
|
||
// 时间轴名称 (与插槽名称对应)
|
||
"name": "slotName",
|
||
// 此时间轴包含的关键帧列表 (可选属性 默认: null)
|
||
"frame": [{
|
||
// 帧长度 (可选属性 默认: 1)
|
||
"duration": 1,
|
||
// 补间缓动 [0.00: 线性, null: 无缓动] (可选属性 默认: null)
|
||
"tweenEasing": 0.00,
|
||
// 补间缓动曲线 [x1, y1, x2, y2, ...: 贝塞尔曲线] (可选属性 默认: null)
|
||
"curve": [0.00, 0.00, 1.00, 1.00],
|
||
// 此帧的显示对象索引 (皮肤中对应的插槽显示对象列表) (可选属性 默认: 0)
|
||
"displayIndex": 0,
|
||
// 显示对象的颜色叠加 (可选属性 默认: null)
|
||
"color": {
|
||
"aM": 100, // 透明叠加 [0~100] (可选属性 默认: 100)
|
||
"rM": 100, // 红色叠加 [0~100] (可选属性 默认: 100)
|
||
"gM": 100, // 绿色叠加 [0~100] (可选属性 默认: 100)
|
||
"bM": 100, // 蓝色叠加 [0~100] (可选属性 默认: 100)
|
||
"aO": 0.00, // 透明偏移 [-255~255] (可选属性 默认: 0)
|
||
"rO": 0.00, // 红色偏移 [-255~255] (可选属性 默认: 0)
|
||
"gO": 0.00, // 绿色偏移 [-255~255] (可选属性 默认: 0)
|
||
"bO": 0.00, // 蓝色偏移 [-255~255] (可选属性 默认: 0)
|
||
},
|
||
// 播放到当前帧时，执行的动作行为列表 (可选属性 默认: null)
|
||
"actions": [
|
||
// 子骨架播放指定动画 (仅对显示对象为骨架时有效)
|
||
["gotoAndPlay", "animationName"],
|
||
// 子骨架播放指定动画并停止 (仅对显示对象为骨架时有效)
|
||
["gotoAndStop", "animationName"],
|
||
]
|
||
}],
|
||
}],
|
||
// 此动画包含的自由变形时间轴列表 (可选属性 默认: null)
|
||
"ffd": [{
|
||
// 时间轴名称 (与插槽名称对应)
|
||
"name": "slotName",
|
||
// 此时间轴包含的关键帧列表 (可选属性 默认: null)
|
||
"frame": [{
|
||
// 帧长度 (可选属性 默认: 1)
|
||
"duration": 1,
|
||
// 补间缓动 [0.00: 线性, null: 无缓动] (可选属性 默认: null)
|
||
"tweenEasing": 0.00,
|
||
// 补间缓动曲线控制点列表 [x1, y1, x2, y2, ...: 贝塞尔曲线] (可选属性 默认: null)
|
||
"curve": [0.00, 0.00, 1.00, 1.00],
|
||
// 顶点坐标列表索引偏移 (可选属性 默认: 0)
|
||
"offset": 0,
|
||
// 顶点坐标列表 [x0, y0, x1, y1, ...: 相对位移] (可选属性 默认: null)
|
||
"vertices": [0.01, 0.01]
|
||
}]
|
||
}]
|
||
}]
|
||
}]
|
||
}
|
||
```
|
||
|
||
------------------------------
|
||
|
||
# 4.5 相对 4.0 格式变化
|
||
|
||
* Armature
|
||
1. 增加 "frameRate" 属性: 可为每个骨架设置独立帧率
|
||
2. 增加 "type" 属性: 骨骼动画/基本动画/场景动画
|
||
3. 增加 "defaultActions" 列表: 可为骨架分配默认行为 (删除 "gotoAndPlay" 属性, 其功能与 "actions" 合并)
|
||
4. 增加 "ik" 列表
|
||
|
||
* Slot
|
||
1. 增加 "actions" 列表: 插槽可为子骨架分配默认行为 (删除 "gotoAndPlay" 属性, 其功能与 "actions" 合并)
|
||
|
||
* Display
|
||
1. "type" 属性增加 "mesh" 类型以及与其匹配的其他属性
|
||
|
||
* Animation
|
||
1. 增加 "ffd" 时间轴
|
||
|
||
* Frame
|
||
1. 增加 "actions" 列表: 控制子骨架行为 (删除 "action" "gotoAndPlay" 属性, 其功能与 "actions" 合并)
|
||
|
||
* actions
|
||
暂时只支持 "gotoAndPlay" 行为, 后续会扩展更多对动画的控制行为和交互行为
|
||
|
||
------------------------------
|
||
|
||
# 4.0 相对 3.0 格式变化
|
||
|
||
* Armature 中包含Slot列表
|
||
|
||
* Skin 中增加默认Skin, 默认skin有如下特性：
|
||
1. 在skin列表中排第一
|
||
2. 名字为空字符串“”
|
||
3. 包含的slot会同时存在于其他的skin，相当于保存所有其他skin中共有的slot（相当于其他skin的基类）
|
||
|
||
* Skin中包含的Slot的Display的transform属性中不在有pX,pY属性
|
||
1. Display不再有初始轴点属性，所有display的轴点均为中心点。
|
||
2. 因为display在运动时的轴点是骨骼的原点，所以这里的轴点信息可以在初始化时换算成display的位置信息，从而可以完美还原动画。
|
||
|
||
* Animation中有下面的改动
|
||
1. 去掉"tweenEasing": 动画不会覆盖关键帧的缓动值
|
||
2. 去掉"autoTween": 动画不会覆盖关键帧的补件值
|
||
3. "loop"改名为"playtime"
|
||
4. "colorTransform"改名为"color"
|
||
|
||
* 区分Bone时间轴和Slot时间轴
|
||
1. Bone时间轴包含平移旋转缩放，自定义事件和声音事件
|
||
2. Slot时间轴包含颜色变换，dispalyIndex变换和zorder变换
|
||
|
||
* Armature, Bone 和Slot中均添加了userData字段用于记录用户自定义信息，同时方便第三方扩展
|
||
|
||
* Frame中有如下改动
|
||
1. 中去掉了hide 属性，动画中如果想隐藏某个插槽，改为设置dispalyIndex为-1. visible属性完全留给开发者使用，用于动态设置slot是否隐藏。
|
||
2. 增加curve属性，使用贝塞尔曲线描述动画补间的缓动效果
|
||
|
||
## 4.0 数据格式标准说明
|
||
|
||
——DragonBones 4.1 依然沿用 4.0 的数据格式规范——
|
||
|
||
~~~ javascript
|
||
{
|
||
// DB数据名称，不同的DB数据文件内可以有同名的骨架，在这种情况下这个字段用于区分骨架所对应的数据。
|
||
"name": "dataName",
|
||
// DB版本号
|
||
"version": "4.0",
|
||
// DB动画帧频
|
||
"frameRate": 24
|
||
//【可选属性】是否使用绝对数据，默认0（使用相对数据）
|
||
"isGlobal": 0,
|
||
"armature": [{
|
||
"name": "armatureName", // 骨架名称，一个数据文件可以有多个骨架
|
||
"userData": //【可选属性】自定义数据区，可以是任何类型，默认是空
|
||
"bone": [{ // 骨架中拥有的所有骨骼列表
|
||
"name": "boneName" // 骨骼名称
|
||
"parent": "parentBoneName" // 父骨骼名称
|
||
"userData": //【可选属性】自定义数据区，可以是任何类型，默认是空
|
||
"length": 0 //【可选属性】骨骼长度，默认0
|
||
// x：X轴坐标偏移, y: Y轴坐标偏移，默认0
|
||
// scX:X轴缩放值，scY:Y轴缩放值，默认1
|
||
// skX:X轴旋转值，skY:Y轴旋转值, 默认0
|
||
"transform": {x, y, scX, scY, skX, skY}// 骨骼的属性参数（属性可选）
|
||
]
|
||
"slot": [{ // 骨架中拥有的插槽列表
|
||
"name": "slotName" // 插槽名称
|
||
"parent": "parentBoneName" // 插槽绑定的骨骼
|
||
"userData": //【可选属性】自定义数据区，可以是任何类型，默认是空
|
||
"displayIndex": 0 //【可选属性】插槽中的默认图片在插槽包含的图片列表中的索引。默认是0
|
||
"blendMode"="" //【可选属性】混合模式。默认值是空。
|
||
}]
|
||
"skin": [{ // 骨架中拥有的皮肤列表
|
||
"name": "skinName" // 皮肤名称，默认皮肤name为"",包含所有其他皮肤公用的插槽
|
||
"slot": [{ // 皮肤中包含的插槽列表
|
||
"name": "slotName" // 插槽名称
|
||
"display": [{ // 插槽中拥有的显示对象列表
|
||
"name": "displayName" // 显示对象对应的显示对象名称，包含二级目录相对路径
|
||
"type": "image" // 显示对象类型，可为图片（image），子骨架（armature）
|
||
// 可以根据不同引擎自由扩充。
|
||
"transform": {x, y, scX, scY, skX, skY} // 显示对象的属性参数（属性可选），
|
||
// x：X轴坐标偏移, y: Y轴坐标偏移，默认0
|
||
// scX:X轴缩放值，scY:Y轴缩放值，默认1
|
||
// skX:X轴旋转值，skY:Y轴旋转值, 默认0
|
||
}]
|
||
}]
|
||
}]
|
||
"animation": [{ // 骨架中拥有的动画列表
|
||
"name": "animationName" // 动画名称
|
||
"duration":0 // 动画总帧数
|
||
"fadeInTime": 0 //【可选属性】淡入时间，默认为0
|
||
"scale": 1 //【可选属性】动画时间轴的缩放，默认为1，数值越大，播放时间越长, 目前DB Pro暂未实现
|
||
"playTimes": 1 //【可选属性】播放次数，默认为1，0是无限循环
|
||
"frame": [{ // 动画中包含的关键帧列表
|
||
"duration": 1 //【可选属性】关键帧持续帧数，默认1
|
||
"event": //【可选属性】关键帧包含事件名，默认为空
|
||
"sound": //【可选属性】关键帧包含声音名,默认为空
|
||
"action": //【可选属性】跳转动作名，默认为空
|
||
}]
|
||
"bone": [{ // 动画中包含的骨骼列表（骨骼时间轴列表）
|
||
"name": "boneName" // 骨骼名称
|
||
"scale": 1 //【可选属性】骨骼时间轴缩放值，默认是1（不缩放）
|
||
"offset": 0 //【可选属性】骨骼时间轴延时[0, 1]，默认值为0
|
||
// 比如一个循环跑步动作有 4 秒， 其中对腿的动作设置此值为 0.25
|
||
// 那么腿的循环比其他骨骼动作提前1秒。
|
||
"pX": 0 //【可选属性】默认值为0 代表动画的中该骨骼轴点的初始值。
|
||
// 这个属性只有用相对Parent的数据才有意义
|
||
// 如果用相对Global的数据，这个值会在数据解析时被覆盖。
|
||
"pY": 0 //【可选属性】默认值为0 代表动画的中该骨骼轴点的初始值。
|
||
// 这个属性只有用相对Parent的数据才有意义
|
||
// 如果用相对Global的数据，这个值会在数据解析时被覆盖。
|
||
"frame": [{ // 骨骼时间轴包含的关键帧列表
|
||
"duration": 1 //【可选属性】关键帧持续帧数，默认1
|
||
"tweenEasing":0 //【可选属性】是否缓动，默认为NaN,不缓动，0：线性缓动。
|
||
"tweenRotate":0 //【可选属性】顺时针或逆时针旋转几周，从补间动画中读取, 必须为整数，默认值为0。
|
||
"event": //【可选属性】关键帧包含事件名，默认为空
|
||
"sound": //【可选属性】关键帧包含声音名,默认为空
|
||
"transform": {x, y, scX, scY, skX, skY} // 此帧骨骼的属性参数（属性可选）
|
||
// x：X轴坐标偏移, y: Y轴坐标偏移，默认0
|
||
// scX:X轴缩放值，scY:Y轴缩放值，默认1
|
||
// skX:X轴旋转值，skY:Y轴旋转值, 默认0
|
||
}]
|
||
}]
|
||
"slot": [{ // 动画中拥有的插槽列表（插槽时间轴列表）
|
||
"name": "slotName" // 插槽的名称
|
||
"scale": 1 //【可选属性】插槽的缩放值，默认是1
|
||
"offset": 0 //【可选属性】动作的延时[0, 1]，默认值为0
|
||
// 比如一个循环跑步动作有 4 秒，其中对腿的动作设置此值为 0.25
|
||
// 那么腿的循环比其他骨骼动作提前1秒。
|
||
"frame": [{ // 插槽中的关键帧列表
|
||
"duration": 1 //【可选属性】关键帧持续帧数，默认1
|
||
"displayIndex":0 //【可选属性】此帧中显示图片的索引，默认是0， -1不显示
|
||
// 对应是skin里的slot中的图片列表索引
|
||
"visible":1 //【可选属性】此帧中插槽是否可见，默认是1。
|
||
"zOrder": 0 //【可选属性】插槽所在的层级，默认是0
|
||
"hide": 0 //【可选属性】是否隐藏,默认是0（不隐藏）
|
||
"tweenEasing":0 //【可选属性】是否缓动，默认为NaN,不缓动，0：线性缓动。
|
||
"action": //【可选属性】此帧执行的动作,默认是空
|
||
"color": {aM, rM, gM, bM, aO, rO, gO, bO} // 颜色叠加。所有属性均为可选属性，默认值如下：
|
||
// aO,rO,gO,bO默认值为0; aM,rM,gM,bM 默认值为100
|
||
}]
|
||
}]
|
||
}]
|
||
}]
|
||
}
|
||
~~~
|