CubismSDK5.x
2014/01/30
-
修正
- 现在可以多次调用init方法了
2014/01/08
-
升级
-
CubismSDK升级到
5.x
- 但部分内容未升级
-
CubismSDK升级到
-
新增
- 添加了触发表情的方法
scence.setExpression
&scence.setOrderExpression
- 现在触发头部点击不再随机播放表情,而是顺序播放 -
xxx.model3.json
新增Transform
用于设置位移和缩放等// xxx.model3.json { "Version": ..., "FileReferences": ..., "Groups": ..., "HitAreas": ..., // 这个优先级最高,未配置则以实例化时传入参数为准,如都没传入则使用默认 "Transform": { "ViewScale": 2.5, // 缩放 "ViewTranslate": { "y": -1.3 } // 位移 } }
- 添加了触发表情的方法
-
修正
- 处理了移动端模糊问题
- 处理了自动呼吸时,同时触发头部和身体摆动的问题 - 也许不是问题,但本项目不需要
第一种
import Live2d from 'charealmlive2d';
第二种,提供一个全局变量
<!DOCTYPE html>
<html>
<head>
...
<!-- Pollyfill script -->
<script src="https://unpkg.com/core-js-bundle@3.6.1/minified.js"></script>
<!-- Live2DCubismCore script -->
<script src = "../../../Core/live2dcubismcore.js"></script>
<!-- Build script -->
<script src = "./dist/bundle.js"></script>
</head>
<body>
<script>
window.Live2d.init(...);
</script>
</body>
函数名 | 说明 |
---|---|
init | 初始化,详见init 方法可用参数
|
model | 获取model 对象 LAppDelegate.getInstance()
|
scene | 获取scene 对象 LAppLive2DManager.getInstance()
|
view | 获取view 对象 模型 |
release | 释放模型 |
参数 | 类型 | 说明 | 默认值 |
---|---|---|---|
Target | HTMLElement | 目标节点 | document.body |
CanvasSize | { width: number; height: number } | string | 画布尺寸 | 'auto' |
ResourcesPath | string | 模型资源地址 | '../../Resources/' |
ModelDir | string[] | 加载模型列表,模型名称和model3.json名称一致 | |
ViewScale | number | 模型缩放比例,0.8 - 2.0 | 1.0 |
ViewTranslate | { x?: number; y?: number } | 模型位移,和ViewScale 一样,都是比例值,缩放比例不同这里位移值也会有变化,可传负值 |
{x: 0, y: 0} |
Motions | string[] | 动作集合,用于执行指定动作时传入名称,现在设计成参数了,但最好不要修改 |
["Normal", "joy", "anger", "Sadness", "surprise", "love", "Fear"] 对应意义:['常', '喜', '怒', '哀', '乐', '爱', '恐'] |
函数名 | 说明 | 参数 |
---|---|---|
startAssignMotion | 执行指定动作 | 1. <string> Normal 动作名称2. <number> 2 优先级,当动作未正确执行时,可考虑提升优先级3. <function> 可选,动作结束后回调 |
setExpression | 执行指定表情 | 1. <string> name 表情名 - Expressions.Name
|
setOrderExpression | 顺序执行表情 | - |
// 可以使用bundle.js提供的全局变量
window.Live2d.init({
ResourcesPath: '../../Resources/', // 资源地址
ModelDir: ['xxx'], // 模型名称
ViewScale: 2.0, // 视图缩放
ViewTranslate: { y: -1.3 } // 视图位移
})
const _scene = window.Live2d.scene;
setTimeout(() => {
console.log('动作1')
_scene.startAssignMotion('anger');
console.log('表情')
_scene.setExpression('exp_01');
}, 1000)
setTimeout(() => {
console.log('动作2')
// 打断之前未完成的动作,需要提高优先级
_scene.startAssignMotion('love', 3, function () {
console.log('动作3')
// 即使动作结束的回调也需要一个延迟,或者再次提高优先级
setTimeout(function () {
_scene.startAssignMotion('Sadness');
}, 16)
});
}, 2000)
setTimeout(() => {
console.log('动作4')
// 动作全部结束后,再执行其他动作可不需再提升优先级
_scene.startAssignMotion('Fear');
}, 15000)