github地址如下:
原资源位置:
下载原资源后打开
根据原SampleApp1.html内容重新建立html页面
下面是依照修改的页面 => 下面删除了改变模型的按钮
main.js中引入的文件如下
文件结构如下
修改原SampleApp文件有:SampleApp1.js LAppDefine.js
SampleApp1.js
删除了按钮的定义
浏览器警告:给其添加passive参数
注释了这一条代码,这个会影响点击感受 => mousedown时会设置 焦点,人物会看向鼠标
增加这一行代码,让鼠标在区域内移动时,会设置焦点
设置 mouseevent 的函数中 注释了mouseup的情况,因为前面已经取消了mousedown 时
设置焦点
LAppDefine.js
重新设置模版配置的路径
补充的修改:LAppLive2DManager.js
初始是 –1 这里修改成 4 。就是修改init()时加载的默认模版 这里改的默认模版是shizuku
module.json
观察:shizuku.module.json
textures:是身体部件
physics:是物理配置 => 决定人物头发应该怎么动等
pose: 配置人物的姿势
expressions :配置人物表情
layout:布局配置
motions :定义动作
idle :空闲时
tap_body: 点击身体时
pinch_in: 被捏时
pinch_out 被撑开时
shake: 被摇时
flick_head : 被拍打头部时
最后效果: