🎉 easy-live2d v0.2.1 发布啦！ 增加了语音 以及 口型同步功能，现在你的Live2D角色 可以在web里说话了！

🎉 easy-live2d v0.2.1 发布啦！ 增加了语音 以及 口型同步功能，现在你的Live2D角色 可以在web里说话了！

🎉 easy-live2d v0.2.1 发布啦！ 📢 全新版本带来了超强口型同步功能！现在你的Live2D角色可以跟着声音栩栩如生地说话了~

🔥 特性亮点： 实时语音控制以及音频口型同步，让角色表情更生动 修复了若干已知BUG 💻 无论你是VTuber还是想给网站添加交互式角色，easy-live2d都能让你轻松实现！

👉 立即体验：stackblitz

📖 官方仓库&文档

👉 easy-live2d Github 仓库

👉 easy-live2d 官方文档

New Feature: 角色说话（口型同步）

当前音嘴同步 仅支持wav格式

首先确保live2d模型已设置 MouthMovement，没有参考下面方法

前置方法1:

在Live2D模型编辑器 中开启口型同步 设置 MouthMovement

这里方法可以参看 官方文档

前置方法2:

在模型的 xx.model3.json 中 找到 “Groups” 中 那个"Name": "LipSync"的部分，添加："Ids":"ParamMouthOpenY", 参考如下

{
	"Version": 3,
	"FileReferences": {
		"Moc": "xx.moc3",
		"Textures": [
			"xx.2048/texture_00.png"
		],
		"Physics": "xx.physics3.json",
		"DisplayInfo": "xx.cdi3.json",
		"Motions": {
			"test": [],
			"idle": []
		},
		"Expressions": []
	},
	"Groups": [
		{
			"Target": "Parameter",
			"Name": "EyeBlink",
			"Ids": []
		},
		{
			"Target": "Parameter",
			"Name": "LipSync",
			"Ids": [
				"ParamMouthOpenY"
			]
		}
	],
	"HitAreas": []
}

角色说话

// 播放声音
live2DSprite.playVoice({
  // 当前音嘴同步 仅支持wav格式
  voicePath: '/Resources/Huusya/voice/test.wav',
})

// 停止声音
// live2DSprite.stopVoice()

setTimeout(() => {
  // 播放声音
  live2DSprite.playVoice({
    voicePath: '/Resources/Huusya/voice/test.wav',
    immediate: true // 是否立即播放: 默认为true，会把当前正在播放的声音停止并立即播放新的声音
  })
}, 10000)