Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
32 changes: 12 additions & 20 deletions src/en/live2D.md
Original file line number Diff line number Diff line change
@@ -1,37 +1,29 @@
# About Live2D
This engine now supports using live2D models. If you want to use live2D models, please follow the steps below:
This engine now supports the use of Live2D models. If you want to use Live2D models, please follow these steps:

:::info
Note: The following steps are all based on the WebGAL source code, you can find the WebGAL source code on GitHub.
Note: Some of the following steps are based on the WebGAL source code, which you can find on GitHub.

[WebGAL Source Code](https://github.com/OpenWebGAL/WebGAL)

About building WebGAL from source, please refer to [WebGAL Build](developers)
For information on how to build WebGAL from source, please refer to [WebGAL Build](developers)
:::

1. Obtain the authorization of Live2D by yourself
1. Obtain a Live2D license yourself.

2. Download Live2D and Cubismcore from https://cdn.jsdelivr.net/gh/dylanNew/live2d/webgl/Live2D/lib/live2d.min.js and https://cubism.live2d.com/sdk-web/cubismcore/live2dcubismcore.min.js respectively
2. Go to https://cdn.jsdelivr.net/gh/dylanNew/live2d/webgl/Live2D/lib/live2d.min.js and https://cubism.live2d.com/sdk-web/cubismcore/live2dcubismcore.min.js to download Live2D and cubismcore respectively.

3. Rename them to `live2d.min.js` and `live2dcubismcore.min.js` respectively, then put the files in `packages/webgal/public/lib`, then go to `packages/webgal/index.html`, uncomment the following two lines to make them:
```html
<script src="lib/live2d.min.js" ></script>
<script src="lib/live2dcubismcore.min.js"></script>
```
4. Go to `packages/webgal/src/Core/controller/stage/pixi/PixiController.ts`, uncomment
`import { Live2DModel, SoundManager } from 'pixi-live2d-display';` and `public addLive2dFigure(key: string, jsonPath: string, pos: string, motion: string) {...... uncomment this whole function}`

Note: If the IDE prompts that there are unimported variables, please import them according to the prompts.

5. Go to `packages/webgal/src/Components/Stage/MainStage/useSetFigure.ts` and uncomment `return WebGAL.gameplay.pixiStage?.addLive2dFigure(...args);`
3. Rename them to `live2d.min.js` and `live2dcubismcore.min.js` respectively, and then put the files in **one of the specified directories**.

6. Now you can start using Live2D as illustrations. You need to put the directory of the entire model in the `game/figure` directory. The way to call the illustration is to call the JSON file of the illustration.
- Custom engine directory: `[WebGal]/assets/templates/Derivative_Engine/[Your custom engine]/lib`
- Game directory (applies to a single project): `[WebGal]/public/games/[Your game]/lib`
- WebGal source code directory: `[WebGal source code]/packages/webgal/public/lib`

7. If you need to build a production package, or use it in WebGAL Terre, please run the `yarn build` command to build WebGAL. After completion, please refer to [How to use a custom engine](derivative) to use the modified engine.
4. Now you can start using Live2D as a figure. You need to put the entire model directory into the `game/figure` directory. The way to call the figure is to call the figure's json file.

**Note: The author of this project did not use any source code and models of Live2D SDK. Any copyright disputes caused by the use of Live2D shall be borne by the secondary developer or producer!**
**Note: The author of this project does not use any source code or models of the Live2D SDK. Any copyright disputes arising from the use of Live2D are the sole responsibility of the secondary developer or creator!**

## Switch actions and expressions
## Switching Motions and Expressions

You can use the `-motion=motionName` or `-expression=expressionName` parameters to switch expressions, such as:

Expand Down
35 changes: 14 additions & 21 deletions src/ja/live2D.md
Original file line number Diff line number Diff line change
@@ -1,38 +1,31 @@
# Live2Dについて
本エンジンはlive2D立ち絵の使用をサポートするようになりました。live2D立ち絵を使用する場合は、以下の手順に従ってください
このエンジンは現在、Live2D立ち絵の使用をサポートしています。Live2D立ち絵を使用する場合は、次の手順に従ってください

:::info
注意:以下の手順はすべてWebGALのソースコードに基づいて操作する必要があります。WebGALのソースコードはGitHubにあります
注意:以下の手順の一部はWebGALソースコードの操作に基づいています。WebGALのソースコードはGitHubで見つけることができます

[WebGAL ソースコード](https://github.com/OpenWebGAL/WebGAL)
[WebGALソースコード](https://github.com/OpenWebGAL/WebGAL)

WebGAL のソースコードからのビルド方法については、[WebGAL ビルド](developers) を参照してください。
ソースコードからWebGALをビルドする方法については、[WebGALビルド](developers)を参照してください。
:::

1、Live2Dのライセンスを自分で取得する
1. 自身でLive2Dのライセンスを取得してください。

2https://cdn.jsdelivr.net/gh/dylanNew/live2d/webgl/Live2D/lib/live2d.min.jsとhttps://cubism.live2d.com/sdk-web/cubismcore/live2dcubismcore.min.jsから、それぞれLive2DとCubismCoreをダウンロードする
2. https://cdn.jsdelivr.net/gh/dylanNew/live2d/webgl/Live2D/lib/live2d.min.js と https://cubism.live2d.com/sdk-web/cubismcore/live2dcubismcore.min.js からそれぞれLive2Dとcubismcoreをダウンロードしてください。

3、それぞれ「live2d.min.js」と「live2dcubismcore.min.js」に名前を変更し、ファイルを「packages/webgal/public/lib」に配置し、「packages/webgal/index.html」に移動して、次の2行のコメントを外して次のように変更する。
```html
<script src="lib/live2d.min.js" ></script>
<script src="lib/live2dcubismcore.min.js"></script>
```
4、「packages/webgal/src/Core/controller/stage/pixi/PixiController.ts」に移動して、「import { Live2DModel, SoundManager } from 'pixi-live2d-display';」と「public addLive2dFigure(key: string, jsonPath: string, pos: string, motion: string) {...... この関数をすべてコメント解除する}」のコメントを外す

注意:IDEがインポートされていない変数があると警告する場合は、警告に従ってインポートしてください。

5、「packages/webgal/src/Components/Stage/MainStage/useSetFigure.ts」に移動して、「return WebGAL.gameplay.pixiStage?.addLive2dFigure(...args);」のコメントを外す
3. それぞれ`live2d.min.js`と`live2dcubismcore.min.js`にリネームし、ファイルを**指定されたディレクトリのいずれか**に配置してください。

6、これでLive2Dを立ち絵として使用できるようになりました。モデルのディレクトリ全体を「game/figure」ディレクトリに配置する必要があります。立ち絵を呼び出す方法は、立ち絵のJSONファイルを使用することです。
- カスタムエンジンディレクトリ:`[WebGal]/assets/templates/Derivative_Engine/[あなたのカスタムエンジン]/lib`
- ゲームディレクトリ(単一のプロジェクトに適用):`[WebGal]/public/games/[あなたのゲーム]/lib`
- WebGalソースコードディレクトリ:`[WebGalソースコード]/packages/webgal/public/lib`

7、プロダクションビルドが必要な場合、または WebGAL Terre で使用する場合は、`yarn build` コマンドを実行して WebGAL をビルドしてください。完了したら、[カスタムエンジンを使用する方法](derivative) を参照して、変更したエンジンを使用してください
4. これで、Live2Dを立ち絵として使用できるようになりました。モデル全体のディレクトリを`game/figure`ディレクトリに配置する必要があります。立ち絵を呼び出す方法は、立ち絵のjsonファイルを呼び出すことです

**注意:このプロジェクトの作者は、Live2D SDKのソースコードやモデルを一切使用していません。Live2Dの使用によって生じた著作権上の紛争は、二次開発者または制作者がすべて責任を負うものとします!**
**注意:このプロジェクトの作者は、Live2D SDKのソースコードやモデルを一切使用していません。Live2Dの使用に起因する著作権紛争は、すべて二次開発者または制作者が責任を負うものとします。**

## モーションと表情を切り替える
## モーションと表情の切り替え

`-motion=motionName`または`-expression=expressionName`パラメータを使用して、表情を切り替えることができます。例えば
`-motion=motionName`または`-expression=expressionName`パラメータを使用して表情を切り替えることができます。例

```
changeFigure:xxx.json -motion=angry -expression=angry01;
Expand Down
20 changes: 6 additions & 14 deletions src/live2D.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
本引擎现已支持使用 live2D 立绘。如果你要使用 live2D 立绘,请遵循以下步骤:

:::info
注意:以下步骤都需要基于 WebGAL 源代码操作,你可以在 GitHub 找到 WebGAL 的源代码。
注意:以下某些步骤基于 WebGAL 源代码操作,你可以在 GitHub 找到 WebGAL 的源代码。

[WebGAL 源代码](https://github.com/OpenWebGAL/WebGAL)

Expand All @@ -13,24 +13,16 @@

2、到 https://cdn.jsdelivr.net/gh/dylanNew/live2d/webgl/Live2D/lib/live2d.min.js 和 https://cubism.live2d.com/sdk-web/cubismcore/live2dcubismcore.min.js 分别下载 live2D 和 cubismcore

3、分别重命名为 `live2d.min.js` 和 `live2dcubismcore.min.js` ,然后将文件放到`packages/webgal/public/lib`,然后到 `packages/webgal/index.html`,取消注释以下两行,使其变为:
```html
<script src="lib/live2d.min.js" ></script>
<script src="lib/live2dcubismcore.min.js"></script>
```
4、到 `packages/webgal/src/Core/controller/stage/pixi/PixiController.ts` ,取消注释
`import { Live2DModel, SoundManager } from 'pixi-live2d-display';` 和 `public addLive2dFigure(key: string, jsonPath: string, pos: string, motion: string) {...... 取消注释这一整个函数}`

注意:如果 IDE 提示有未导入的变量,请根据提示导入。
3、分别重命名为 `live2d.min.js` 和 `live2dcubismcore.min.js` ,然后将文件放到**其中一个指定目录**

5、到 `packages/webgal/src/Components/Stage/MainStage/useSetFigure.ts` 取消注释 `return WebGAL.gameplay.pixiStage?.addLive2dFigure(...args);`
- 定制引擎目录:`[WebGal]/assets/templates/Derivative_Engine/[你的定制引擎]/lib`
- 游戏目录(作用于单个项目):`[WebGal]/public/games/[你的游戏]/lib`
- WebGal源码目录:`[WebGal源码]/packages/webgal/public/lib`

6、现在开始你可以使用 live2D 作为立绘了。你需要将整个模型的目录放入 `game/figure` 目录中,调用立绘的方法是调用立绘的 json 文件。
4、现在开始你可以使用 live2D 作为立绘了。你需要将整个模型的目录放入 `game/figure` 目录中,调用立绘的方法是调用立绘的 json 文件。

**注意:本项目的作者没有使用任何 live2D SDK 的源码和模型,由于使用 live2D 造成的任何版权纠纷,皆由二次开发者或制作者自行承担!**

7、如果你需要构建生产包,或在 WebGAL Terre 中使用,请运行 `yarn build` 指令构建 WebGAL。完成后,请参考 [如何使用定制引擎](derivative) 使用修改后的引擎。

## 切换动作和表情

你可以使用 `-motion=motionName` 或 `-expression=expressionName` 参数来切换表情,如:
Expand Down