翻译注释

translate
孙羽 2023-10-23 11:30:41 +08:00
parent a1c5667449
commit a5fd852e63
18 changed files with 1501 additions and 435 deletions

6
.vscode/launch.json vendored
View File

@ -2,10 +2,10 @@
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"type": "firefox",
"request": "launch",
"name": "Launch Chrome",
"url": "http://localhost:5000/Samples/TypeScript/Demo/",
"name": "Launch Firefox",
"url": "http://localhost:8080/Samples/TypeScript/Demo/",
"webRoot": "${workspaceFolder}",
"sourceMaps": true,
"sourceMapPathOverrides": {

View File

@ -1,3 +1,4 @@
{
"typescript.tsdk": "./Samples/TypeScript/Demo/node_modules/typescript/lib"
"typescript.tsdk": "./Samples/TypeScript/Demo/node_modules/typescript/lib",
"cmake.configureOnOpen": true
}

367
Core/live2dcubismcore.d.ts vendored Normal file
View File

@ -0,0 +1,367 @@
/**
* Copyright(c) Live2D Inc. All rights reserved.
*
* Use of this source code is governed by the Live2D Proprietary Software license
* that can be found at https://www.live2d.com/eula/live2d-proprietary-software-license-agreement_en.html.
*/
declare namespace Live2DCubismCore {
/** Cubism version identifier. */
type csmVersion = number;
/** moc3 version identifier. */
type csmMocVersion = number;
/** Parameter type identifier. */
type csmParameterType = number;
/** Necessary alignment for mocs (in bytes). */
const AlignofMoc: number;
/** Necessary alignment for models (in bytes). */
const AlignofModel: number;
/** .moc3 file version Unknown */
const MocVersion_Unknown: number;
/** .moc3 file version 3.0.00 - 3.2.07 */
const MocVersion_30: number;
/** .moc3 file version 3.3.00 - 3.3.03 */
const MocVersion_33: number;
/** .moc3 file version 4.0.00 - 4.1.05 */
const MocVersion_40: number;
/** .moc3 file version 4.2.00 - 4.2.04 */
const MocVersion_42: number;
/** .moc3 file version 5.0.00 - */
const MocVersion_50: number;
/** Normal Parameter. */
const ParameterType_Normal: number;
/** Parameter for blend shape. */
const ParameterType_BlendShape: number;
/** Log handler.
*
* @param message Null-terminated string message to log.
*/
interface csmLogFunction {
(message: string): void;
}
/** Cubism version. */
class Version {
/**
* Queries Core version.
*
* @return Core version.
*/
static csmGetVersion(): csmVersion;
/**
* Gets Moc file supported latest version.
*
* @return Moc file latest format version.
*/
static csmGetLatestMocVersion(): csmMocVersion;
/**
* Gets Moc file format version.
*
* @param moc Moc
*
* @return csmMocVersion
*/
static csmGetMocVersion(moc: Moc, mocBytes: ArrayBuffer): csmMocVersion;
private constructor();
}
/** Cubism logging. */
class Logging {
private static logFunction;
/**
* Sets log handler.
*
* @param handler Handler to use.
*/
static csmSetLogFunction(handler: csmLogFunction): void;
/**
* Queries log handler.
*
* @return Log handler.
*/
static csmGetLogFunction(): csmLogFunction;
/**
* Wrap log function.
*
* @param messagePtr number
*
* @return string
*/
private static wrapLogFunction;
private constructor();
}
/** Cubism moc. */
class Moc {
/**
* Checks consistency of a moc.
*
* @param mocBytes Moc bytes.
*
* @returns '1' if Moc is valid; '0' otherwise.
*/
hasMocConsistency(mocBytes: ArrayBuffer): number;
/** Creates [[Moc]] from [[ArrayBuffer]].
*
* @param buffer Array buffer
*
* @return [[Moc]] on success; [[null]] otherwise.
*/
static fromArrayBuffer(buffer: ArrayBuffer): Moc;
/** Releases instance. */
_release(): void;
/** Native moc. */
_ptr: number;
/**
* Initializes instance.
*
* @param mocBytes Moc bytes.
*/
private constructor();
}
/** Cubism model. */
class Model {
/** Parameters. */
parameters: Parameters;
/** Parts. */
parts: Parts;
/** Drawables. */
drawables: Drawables;
/** Canvas information. */
canvasinfo: CanvasInfo;
/**
* Creates [[Model]] from [[Moc]].
*
* @param moc Moc
*
* @return [[Model]] on success; [[null]] otherwise.
*/
static fromMoc(moc: Moc): Model;
/** Updates instance. */
update(): void;
/** Releases instance. */
release(): void;
/** Native model. */
_ptr: number;
/**
* Initializes instance.
*
* @param moc Moc
*/
private constructor();
}
/** Canvas information interface. */
class CanvasInfo {
/** Width of native model canvas. */
CanvasWidth: number;
/** Height of native model canvas. */
CanvasHeight: number;
/** Coordinate origin of X axis. */
CanvasOriginX: number;
/** Coordinate origin of Y axis. */
CanvasOriginY: number;
/** Pixels per unit of native model. */
PixelsPerUnit: number;
/**
* Initializes instance.
*
* @param modelPtr Native model pointer.
*/
constructor(modelPtr: number);
}
/** Cubism model parameters */
class Parameters {
/** Parameter count. */
count: number;
/** Parameter IDs. */
ids: Array<string>;
/** Minimum parameter values. */
minimumValues: Float32Array;
/** Parameter types. */
types: Int32Array;
/** Maximum parameter values. */
maximumValues: Float32Array;
/** Default parameter values. */
defaultValues: Float32Array;
/** Parameter values. */
values: Float32Array;
/** Number of key values of each parameter. */
keyCounts: Int32Array;
/** Key values of each parameter. */
keyValues: Array<Float32Array>;
/**
* Initializes instance.
*
* @param modelPtr Native model.
*/
constructor(modelPtr: number);
}
/** Cubism model parts */
class Parts {
/** Part count. */
count: number;
/** Part IDs. */
ids: Array<string>;
/** Opacity values. */
opacities: Float32Array;
/** Part's parent part indices. */
parentIndices: Int32Array;
/**
* Initializes instance.
*
* @param modelPtr Native model.
*/
constructor(modelPtr: number);
}
/** Cubism model drawables */
class Drawables {
/** Drawable count. */
count: number;
/** Drawable IDs. */
ids: Array<string>;
/** Constant drawable flags. */
constantFlags: Uint8Array;
/** Dynamic drawable flags. */
dynamicFlags: Uint8Array;
/** Drawable texture indices. */
textureIndices: Int32Array;
/** Drawable draw orders. */
drawOrders: Int32Array;
/** Drawable render orders. */
renderOrders: Int32Array;
/** Drawable opacities. */
opacities: Float32Array;
/** Mask count for each drawable. */
maskCounts: Int32Array;
/** Masks for each drawable. */
masks: Array<Int32Array>;
/** Number of vertices of each drawable. */
vertexCounts: Int32Array;
/** 2D vertex position data of each drawable. */
vertexPositions: Array<Float32Array>;
/** 2D texture coordinate data of each drawables. */
vertexUvs: Array<Float32Array>;
/** Number of triangle indices for each drawable. */
indexCounts: Int32Array;
/** Triangle index data for each drawable. */
indices: Array<Uint16Array>;
/** Information multiply color. */
multiplyColors: Float32Array;
/** Information Screen color. */
screenColors: Float32Array;
/** Indices of drawables parent part. */
parentPartIndices: Int32Array;
/** Resets all dynamic drawable flags.. */
resetDynamicFlags(): void;
/** Native model. */
private _modelPtr;
/**
* Initializes instance.
*
* @param modelPtr Native model.
*/
constructor(modelPtr: number);
}
/** Utility functions. */
class Utils {
/**
* Checks whether flag is set in bitfield.
*
* @param bitfield Bitfield to query against.
*
* @return [[true]] if bit set; [[false]] otherwise
*/
static hasBlendAdditiveBit(bitfield: number): boolean;
/**
* Checks whether flag is set in bitfield.
*
* @param bitfield Bitfield to query against.
*
* @return [[true]] if bit set; [[false]] otherwise
*/
static hasBlendMultiplicativeBit(bitfield: number): boolean;
/**
* Checks whether flag is set in bitfield.
*
* @param bitfield Bitfield to query against.
*
* @return [[true]] if bit set; [[false]] otherwise
*/
static hasIsDoubleSidedBit(bitfield: number): boolean;
/**
* Checks whether flag is set in bitfield.
*
* @param bitfield Bitfield to query against.
*
* @return [[true]] if bit set; [[false]] otherwise
*/
static hasIsInvertedMaskBit(bitfield: number): boolean;
/**
* Checks whether flag is set in bitfield.
*
* @param bitfield Bitfield to query against.
*
* @return [[true]] if bit set; [[false]] otherwise
*/
static hasIsVisibleBit(bitfield: number): boolean;
/**
* Checks whether flag is set in bitfield.
*
* @param bitfield Bitfield to query against.
*
* @return [[true]] if bit set; [[false]] otherwise
*/
static hasVisibilityDidChangeBit(bitfield: number): boolean;
/**
* Checks whether flag is set in bitfield.
*
* @param bitfield Bitfield to query against.
*
* @return [[true]] if bit set; [[false]] otherwise
*/
static hasOpacityDidChangeBit(bitfield: number): boolean;
/**
* Checks whether flag is set in bitfield.
*
* @param bitfield Bitfield to query against.
*
* @return [[true]] if bit set; [[false]] otherwise
*/
static hasDrawOrderDidChangeBit(bitfield: number): boolean;
/**
* Checks whether flag is set in bitfield.
*
* @param bitfield Bitfield to query against.
*
* @return [[true]] if bit set; [[false]] otherwise
*/
static hasRenderOrderDidChangeBit(bitfield: number): boolean;
/**
* Checks whether flag is set in bitfield.
*
* @param bitfield Bitfield to query against.
*
* @return [[true]] if bit set; [[false]] otherwise
*/
static hasVertexPositionsDidChangeBit(bitfield: number): boolean;
/**
* Checks whether flag is set in bitfield.
*
* @param bitfield Bitfield to query against.
*
* @return [[true]] if bit set; [[false]] otherwise
*/
static hasBlendColorDidChangeBit(bitfield: number): boolean;
}
/** Memory functions. */
class Memory {
/**
* HACK:
* Extend memory size allocated during module initialization.
* If the specified size is less than or equal to 16777216(byte), the default of 16 MB is allocated.
*
* @see https://github.com/emscripten-core/emscripten/blob/main/src/settings.js#L161
*
* @param size allocated memory size [byte(s)]
*/
static initializeAmountOfMemory(size: number): void;
private constructor();
}
/** Emscripten Cubism Core module. */
}

686
Core/live2dcubismcore.js Normal file

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

9
Core/live2dcubismcore.min.js vendored Normal file

File diff suppressed because one or more lines are too long

View File

@ -8,13 +8,13 @@
import { LogLevel } from '@framework/live2dcubismframework';
/**
* Sample App使
* Sample App使
*/
// Canvas width and height pixel values, or dynamic screen size ('auto').
// Canvas的宽和高的像素值,或动态屏幕大小('auto')。
export const CanvasSize: { width: number; height: number } | 'auto' = 'auto';
// 画面
// 屏幕
export const ViewScale = 1.0;
export const ViewMaxScale = 2.0;
export const ViewMinScale = 0.8;
@ -29,21 +29,21 @@ export const ViewLogicalMaxRight = 2.0;
export const ViewLogicalMaxBottom = -2.0;
export const ViewLogicalMaxTop = 2.0;
// 相対パス
// 相对路径
export const ResourcesPath = '../../Resources/';
// モデルの後ろにある背景の画像ファイル
// 在模型后面的背景图片文件
export const BackImageName = 'back_class_normal.png';
// 歯車
// 齿轮
export const GearImageName = 'icon_gear.png';
// 終了ボタン
// 关闭按钮
export const PowerImageName = 'CloseNormal.png';
// モデル定義---------------------------------------------
// モデルを配置したディレクトリ名の配列
// ディレクトリ名とmodel3.jsonの名前を一致させておくこと
// 模型定义---------------------------------------------
// 部署模型的目录名数组
// 请将目录名和model3.json的名字匹配
export const ModelDir: string[] = [
'Haru',
'Hiyori',
@ -55,30 +55,30 @@ export const ModelDir: string[] = [
];
export const ModelDirSize: number = ModelDir.length;
// 外部定義ファイルjsonと合わせる
export const MotionGroupIdle = 'Idle'; // アイドリング
export const MotionGroupTapBody = 'TapBody'; // 体をタップしたとき
// 与外部定义文件json匹配
export const MotionGroupIdle = 'Idle'; // 空闲
export const MotionGroupTapBody = 'TapBody'; // 点击身体时
// 外部定義ファイルjsonと合わせる
// 与外部定义文件json匹配
export const HitAreaNameHead = 'Head';
export const HitAreaNameBody = 'Body';
// モーションの優先度定数
// 动作的优先级常量
export const PriorityNone = 0;
export const PriorityIdle = 1;
export const PriorityNormal = 2;
export const PriorityForce = 3;
// MOC3の一貫性検証オプション
// MOC3的一致性验证选项
export const MOCConsistencyValidationEnable = true;
// デバッグ用ログの表示オプション
// 显示用于调试的日志的选项
export const DebugLogEnable = true;
export const DebugTouchLogEnable = false;
// Frameworkから出力するログのレベル設定
// 设置从框架输出的日志的级别
export const CubismLoggingLevel: LogLevel = LogLevel.LogLevel_Verbose;
// デフォルトのレンダーターゲットサイズ
// 默认的渲染目标大小
export const RenderTargetWidth = 1900;
export const RenderTargetHeight = 1000;

View File

@ -19,15 +19,15 @@ export let gl: WebGLRenderingContext = null;
export let frameBuffer: WebGLFramebuffer = null;
/**
*
* Cubism SDK
*
* Cubism SDK
*/
export class LAppDelegate {
/**
*
*
*
*
*
* @return
* @return
*/
public static getInstance(): LAppDelegate {
if (s_instance == null) {
@ -38,7 +38,7 @@ export class LAppDelegate {
}
/**
*
*
*/
public static releaseInstance(): void {
if (s_instance != null) {
@ -49,13 +49,13 @@ export class LAppDelegate {
}
/**
* APP
* APP西
*/
public initialize(): boolean {
// キャンバスの作成
// 创建画布
canvas = document.createElement('canvas');
// glコンテキストを初期化
// 初始化webgl上下文
// @ts-ignore
gl = canvas.getContext('webgl') || canvas.getContext('experimental-webgl');
@ -66,11 +66,11 @@ export class LAppDelegate {
document.body.innerHTML =
'This browser does not support the <code>&lt;canvas&gt;</code> element.';
// gl初期化失敗
// webgl初始化失败
return false;
}
// キャンバスを DOM に追加
// 将画布添加到DOM中
document.body.appendChild(canvas);
if (LAppDefine.CanvasSize === 'auto') {
@ -84,29 +84,29 @@ export class LAppDelegate {
frameBuffer = gl.getParameter(gl.FRAMEBUFFER_BINDING);
}
// 透過設定
// 启用透明设置
gl.enable(gl.BLEND);
gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
const supportTouch: boolean = 'ontouchend' in canvas;
if (supportTouch) {
// タッチ関連コールバック関数登録
// 注册触摸相关的回调函数
canvas.addEventListener('touchstart', onTouchBegan, { passive: true });
canvas.addEventListener('touchmove', onTouchMoved, { passive: true });
canvas.addEventListener('touchend', onTouchEnded, { passive: true });
canvas.addEventListener('touchcancel', onTouchCancel, { passive: true });
} else {
// マウス関連コールバック関数登録
// 注册鼠标相关的回调函数
canvas.addEventListener('mousedown', onClickBegan, { passive: true });
canvas.addEventListener('mousemove', onMouseMoved, { passive: true });
canvas.addEventListener('mouseup', onClickEnded, { passive: true });
}
// AppViewの初期化
// 初始化AppView
this._view.initialize();
// Cubism SDKの初期化
// 初始化Cubism SDK
this.initializeCubism();
return true;
@ -122,7 +122,7 @@ export class LAppDelegate {
}
/**
*
*
*/
public release(): void {
this._textureManager.release();
@ -131,59 +131,59 @@ export class LAppDelegate {
this._view.release();
this._view = null;
// リソースを解放
// 释放资源
LAppLive2DManager.releaseInstance();
// Cubism SDKの解放
// 释放Cubism SDK
CubismFramework.dispose();
}
/**
*
*
*/
public run(): void {
// メインループ
// 主循环
const loop = (): void => {
// インスタンスの有無の確認
// 检查实例是否存在
if (s_instance == null) {
return;
}
// 時間更新
// 更新时间
LAppPal.updateTime();
// 画面の初期化
// 初始化屏幕
gl.clearColor(0.0, 0.0, 0.0, 1.0);
// 深度テストを有効化
// 启用深度测试
gl.enable(gl.DEPTH_TEST);
// 近くにある物体は、遠くにある物体を覆い隠す
// 近处的物体会覆盖远处的物体
gl.depthFunc(gl.LEQUAL);
// カラーバッファや深度バッファをクリアする
// 清除颜色缓冲区和深度缓冲区
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
gl.clearDepth(1.0);
// 透過設定
// 启用透明设置
gl.enable(gl.BLEND);
gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
// 描画更新
// 更新绘制
this._view.render();
// ループのために再帰呼び出し
// 为了循环再次调用
requestAnimationFrame(loop);
};
loop();
}
/**
*
*
*/
public createShader(): WebGLProgram {
// バーテックスシェーダーのコンパイル
// 编译顶点着色器
const vertexShaderId = gl.createShader(gl.VERTEX_SHADER);
if (vertexShaderId == null) {
@ -205,7 +205,7 @@ export class LAppDelegate {
gl.shaderSource(vertexShaderId, vertexShader);
gl.compileShader(vertexShaderId);
// フラグメントシェーダのコンパイル
// 编译片段着色器
const fragmentShaderId = gl.createShader(gl.FRAGMENT_SHADER);
if (fragmentShaderId == null) {
@ -225,7 +225,7 @@ export class LAppDelegate {
gl.shaderSource(fragmentShaderId, fragmentShader);
gl.compileShader(fragmentShaderId);
// プログラムオブジェクトの作成
// 创建程序对象
const programId = gl.createProgram();
gl.attachShader(programId, vertexShaderId);
gl.attachShader(programId, fragmentShaderId);
@ -233,7 +233,7 @@ export class LAppDelegate {
gl.deleteShader(vertexShaderId);
gl.deleteShader(fragmentShaderId);
// リンク
// 链接
gl.linkProgram(programId);
gl.useProgram(programId);
@ -242,7 +242,7 @@ export class LAppDelegate {
}
/**
* View
* View
*/
public getView(): LAppView {
return this._view;
@ -253,7 +253,7 @@ export class LAppDelegate {
}
/**
*
*
*/
constructor() {
this._captured = false;
@ -267,18 +267,18 @@ export class LAppDelegate {
}
/**
* Cubism SDK
* Cubism SDK
*/
public initializeCubism(): void {
// setup cubism
// 设置cubism
this._cubismOption.logFunction = LAppPal.printMessage;
this._cubismOption.loggingLevel = LAppDefine.CubismLoggingLevel;
CubismFramework.startUp(this._cubismOption);
// initialize cubism
// 初始化cubism
CubismFramework.initialize();
// load model
// 加载模型
LAppLive2DManager.getInstance();
LAppPal.updateTime();
@ -287,7 +287,7 @@ export class LAppDelegate {
}
/**
* Resize the canvas to fill the screen.
*
*/
private _resizeCanvas(): void {
canvas.width = canvas.clientWidth * window.devicePixelRatio;
@ -295,17 +295,17 @@ export class LAppDelegate {
gl.viewport(0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight);
}
_cubismOption: Option; // Cubism SDK Option
_view: LAppView; // View情報
_captured: boolean; // クリックしているか
_mouseX: number; // マウスX座標
_mouseY: number; // マウスY座標
_isEnd: boolean; // APP終了しているか
_textureManager: LAppTextureManager; // テクスチャマネージャー
_cubismOption: Option; // Cubism SDK选项
_view: LAppView; // View信息
_captured: boolean; // 是否要捕获
_mouseX: number; // 鼠标X坐标
_mouseY: number; // 鼠标Y坐标
_isEnd: boolean; // APP是否已结束
_textureManager: LAppTextureManager; // 纹理管理器
}
/**
*
*
*/
function onClickBegan(e: MouseEvent): void {
if (!LAppDelegate.getInstance()._view) {
@ -321,7 +321,7 @@ function onClickBegan(e: MouseEvent): void {
}
/**
*
*
*/
function onMouseMoved(e: MouseEvent): void {
if (!LAppDelegate.getInstance()._captured) {
@ -341,7 +341,7 @@ function onMouseMoved(e: MouseEvent): void {
}
/**
*
*
*/
function onClickEnded(e: MouseEvent): void {
LAppDelegate.getInstance()._captured = false;
@ -358,7 +358,7 @@ function onClickEnded(e: MouseEvent): void {
}
/**
*
*
*/
function onTouchBegan(e: TouchEvent): void {
if (!LAppDelegate.getInstance()._view) {
@ -375,7 +375,7 @@ function onTouchBegan(e: TouchEvent): void {
}
/**
*
*
*/
function onTouchMoved(e: TouchEvent): void {
if (!LAppDelegate.getInstance()._captured) {
@ -396,7 +396,7 @@ function onTouchMoved(e: TouchEvent): void {
}
/**
*
*
*/
function onTouchEnded(e: TouchEvent): void {
LAppDelegate.getInstance()._captured = false;
@ -415,7 +415,7 @@ function onTouchEnded(e: TouchEvent): void {
}
/**
*
*
*/
function onTouchCancel(e: TouchEvent): void {
LAppDelegate.getInstance()._captured = false;

View File

@ -17,15 +17,14 @@ import { LAppPal } from './lapppal';
export let s_instance: LAppLive2DManager = null;
/**
* CubismModel
*
* CubismModel
*
*/
export class LAppLive2DManager {
/**
*
*
*
* @return
*
*
* @return
*/
public static getInstance(): LAppLive2DManager {
if (s_instance == null) {
@ -36,7 +35,7 @@ export class LAppLive2DManager {
}
/**
*
*
*/
public static releaseInstance(): void {
if (s_instance != null) {
@ -47,10 +46,10 @@ export class LAppLive2DManager {
}
/**
*
*
*
* @param no
* @return NULL
* @param no
* @return NULL
*/
public getModel(no: number): LAppModel {
if (no < this._models.getSize()) {
@ -61,7 +60,7 @@ export class LAppLive2DManager {
}
/**
*
*
*/
public releaseAllModel(): void {
for (let i = 0; i < this._models.getSize(); i++) {
@ -73,10 +72,9 @@ export class LAppLive2DManager {
}
/**
*
*
* @param x X
* @param y Y
*
* @param x - x
* @param y - y
*/
public onDrag(x: number, y: number): void {
for (let i = 0; i < this._models.getSize(); i++) {
@ -89,10 +87,14 @@ export class LAppLive2DManager {
}
/**
*
*
*
* @param x X
* @param y Y
* @param x X
* @param y Y
* Lapplive2DManageronTap
*
*
* xy
*/
public onTap(x: number, y: number): void {
if (LAppDefine.DebugLogEnable) {
@ -127,8 +129,8 @@ export class LAppLive2DManager {
}
/**
*
*
*
*
*/
public onUpdate(): void {
const { width, height } = canvas;
@ -141,27 +143,27 @@ export class LAppLive2DManager {
if (model.getModel()) {
if (model.getModel().getCanvasWidth() > 1.0 && width < height) {
// 横に長いモデルを縦長ウィンドウに表示する際モデルの横サイズでscaleを算出する
// 当在纵向窗口中显示横向模型时,根据模型的横向大小计算比例
model.getModelMatrix().setWidth(2.0);
projection.scale(1.0, width / height);
} else {
projection.scale(height / width, 1.0);
}
// 必要があればここで乗算
// 如果需要,在这里进行乘法
if (this._viewMatrix != null) {
projection.multiplyByMatrix(this._viewMatrix);
}
}
model.update();
model.draw(projection); // 参照渡しなのでprojectionは変質する
model.draw(projection); // 传递引用所以projection会改变
}
}
/**
*
*
*
*
*/
public nextScene(): void {
const no: number = (this._sceneIndex + 1) % LAppDefine.ModelDirSize;
@ -169,8 +171,9 @@ export class LAppLive2DManager {
}
/**
*
*
*
* @param index -
* @returns void
*/
public changeScene(index: number): void {
this._sceneIndex = index;
@ -178,9 +181,9 @@ export class LAppLive2DManager {
LAppPal.printMessage(`[APP]model index: ${this._sceneIndex}`);
}
// ModelDir[]に保持したディレクトリ名から
// model3.jsonのパスを決定する
// ディレクトリ名とmodel3.jsonの名前を一致させておくこと
// 根据在ModelDir[]中保存的目录名称
// 确定model3.json的路径
// 目录名称和model3.json的名称应保持一致
const model: string = LAppDefine.ModelDir[index];
const modelPath: string = LAppDefine.ResourcesPath + model + '/';
let modelJsonName: string = LAppDefine.ModelDir[index];
@ -198,7 +201,7 @@ export class LAppLive2DManager {
}
/**
*
*
*/
constructor() {
this._viewMatrix = new CubismMatrix44();
@ -207,10 +210,10 @@ export class LAppLive2DManager {
this.changeScene(this._sceneIndex);
}
_viewMatrix: CubismMatrix44; // モデル描画に用いるview行列
_models: csmVector<LAppModel>; // モデルインスタンスのコンテナ
_sceneIndex: number; // 表示するシーンのインデックス値
// モーション再生終了のコールバック関
_viewMatrix: CubismMatrix44; // 用于模型绘制的视图矩阵
_models: csmVector<LAppModel>; // 模型实例的容器
_sceneIndex: number; // 要显示的场景的索引值
// 动作播放结束的回调函
_finishedMotion = (self: ACubismMotion): void => {
LAppPal.printMessage('Motion Finished:');
console.log(self);

View File

@ -72,12 +72,12 @@ enum LoadStep {
}
/**
* 使<br>
*
* 使
*
*/
export class LAppModel extends CubismUserModel {
/**
* model3.json
* model3.json
* @param dir
* @param fileName
*/
@ -92,19 +92,19 @@ export class LAppModel extends CubismUserModel {
arrayBuffer.byteLength
);
// ステートを更新
// 更新状态
this._state = LoadStep.LoadModel;
// 結果を保存
// 保存结果
this.setupModel(setting);
});
}
/**
* model3.json
* model3.json
* model3.json
* model3.json
*
* @param setting ICubismModelSetting
* @param setting ICubismModelSetting
*/
private setupModel(setting: ICubismModelSetting): void {
this._updating = true;
@ -355,22 +355,22 @@ export class LAppModel extends CubismUserModel {
const motionGroupCount: number = this._modelSetting.getMotionGroupCount();
// モーションの総数を求める
// 计算动作总数
for (let i = 0; i < motionGroupCount; i++) {
group[i] = this._modelSetting.getMotionGroupName(i);
this._allMotionCount += this._modelSetting.getMotionCount(group[i]);
}
// モーションの読み込み
// 加载动作
for (let i = 0; i < motionGroupCount; i++) {
this.preLoadMotionGroup(group[i]);
}
// モーションがない場合
// 如果没有动作
if (motionGroupCount == 0) {
this._state = LoadStep.LoadTexture;
// 全てのモーションを停止する
// 停止所有动作
this._motionManager.stopAllMotions();
this._updating = false;
@ -384,7 +384,7 @@ export class LAppModel extends CubismUserModel {
}
/**
*
*
*/
private setupTextures(): void {
// iPhoneでのアルファ品質向上のためTypescriptではpremultipliedAlphaを採用
@ -434,7 +434,7 @@ export class LAppModel extends CubismUserModel {
}
/**
*
*
*/
public reloadRenderer(): void {
this.deleteRenderer();
@ -455,13 +455,13 @@ export class LAppModel extends CubismUserModel {
this._dragX = this._dragManager.getX();
this._dragY = this._dragManager.getY();
// モーションによるパラメータ更新の有無
// 参数更新是否由动作引起
let motionUpdated = false;
//--------------------------------------------------------------------------
this._model.loadParameters(); // 前回セーブされた状態をロード
this._model.loadParameters(); // 加载上一次保存的状态
if (this._motionManager.isFinished()) {
// モーションの再生がない場合、待機モーションの中からランダムで再生する
// 如果没有动作播放,随机从待机动作中选择一个播放
this.startRandomMotion(
LAppDefine.MotionGroupIdle,
LAppDefine.PriorityIdle
@ -470,55 +470,55 @@ export class LAppModel extends CubismUserModel {
motionUpdated = this._motionManager.updateMotion(
this._model,
deltaTimeSeconds
); // モーションを更新
); // 更新动作
}
this._model.saveParameters(); // 状態を保存
this._model.saveParameters(); // 保存状态
//--------------------------------------------------------------------------
// まばたき
// 闪烁
if (!motionUpdated) {
if (this._eyeBlink != null) {
// メインモーションの更新がないとき
this._eyeBlink.updateParameters(this._model, deltaTimeSeconds); // 目パチ
// 当主要动作没有更新时
this._eyeBlink.updateParameters(this._model, deltaTimeSeconds); // 眨眼
}
}
if (this._expressionManager != null) {
this._expressionManager.updateMotion(this._model, deltaTimeSeconds); // 表情でパラメータ更新(相対変化)
this._expressionManager.updateMotion(this._model, deltaTimeSeconds); // 通过表情更新参数(相对变化)
}
// ドラッグによる変化
// ドラッグによる顔の向きの調整
this._model.addParameterValueById(this._idParamAngleX, this._dragX * 30); // -30から30の値を加える
// 由拖动引起的改变
// 调整由拖动引起的脸部方向
this._model.addParameterValueById(this._idParamAngleX, this._dragX * 30); // 添加-30到30的值
this._model.addParameterValueById(this._idParamAngleY, this._dragY * 30);
this._model.addParameterValueById(
this._idParamAngleZ,
this._dragX * this._dragY * -30
);
// ドラッグによる体の向きの調整
// 调整由拖动引起的身体方向
this._model.addParameterValueById(
this._idParamBodyAngleX,
this._dragX * 10
); // -10から10の値を加える
); // 添加-10到10的值
// ドラッグによる目の向きの調整
this._model.addParameterValueById(this._idParamEyeBallX, this._dragX); // -1から1の値を加える
// 调整由拖动引起的眼睛方向
this._model.addParameterValueById(this._idParamEyeBallX, this._dragX); // 添加-1到1的值
this._model.addParameterValueById(this._idParamEyeBallY, this._dragY);
// 呼吸など
// 呼吸
if (this._breath != null) {
this._breath.updateParameters(this._model, deltaTimeSeconds);
}
// 物理演算の設定
// 设置物理运算
if (this._physics != null) {
this._physics.evaluate(this._model, deltaTimeSeconds);
}
// リップシンクの設定
// 设置唇形同步
if (this._lipsync) {
let value = 0.0; // リアルタイムでリップシンクを行う場合、システムから音量を取得して、0~1の範囲で値を入力します
let value = 0.0; // 如果要实时进行唇形同步从系统中获取音量并输入0~1的范围内的值
this._wavFileHandler.update(deltaTimeSeconds);
value = this._wavFileHandler.getRms();
@ -528,7 +528,7 @@ export class LAppModel extends CubismUserModel {
}
}
// ポーズの設定
// 设置姿势
if (this._pose != null) {
this._pose.updateParameters(this._model, deltaTimeSeconds);
}
@ -537,12 +537,12 @@ export class LAppModel extends CubismUserModel {
}
/**
*
* @param group
* @param no
* @param priority
* @param onFinishedMotionHandler
* @return isFinished()使[-1]
*
* @param group
* @param no
* @param priority
* @param onFinishedMotionHandler
* @return isFinished()[-1]
*/
public startMotion(
group: string,
@ -591,7 +591,7 @@ export class LAppModel extends CubismUserModel {
}
motion.setEffectIds(this._eyeBlinkIds, this._lipSyncIds);
autoDelete = true; // 終了時にメモリから削
autoDelete = true; // 结束时从内存中删
});
} else {
motion.setFinishedMotionHandler(onFinishedMotionHandler);
@ -616,11 +616,11 @@ export class LAppModel extends CubismUserModel {
}
/**
*
* @param group
* @param priority
* @param onFinishedMotionHandler
* @return isFinished()使[-1]
*
* @param group
* @param priority
* @param onFinishedMotionHandler
* @return isFinished()[-1]
*/
public startRandomMotion(
group: string,
@ -639,9 +639,9 @@ export class LAppModel extends CubismUserModel {
}
/**
*
*
*
* @param expressionId ID
* @param expressionId ID
*/
public setExpression(expressionId: string): void {
const motion: ACubismMotion = this._expressions.getValue(expressionId);
@ -664,7 +664,7 @@ export class LAppModel extends CubismUserModel {
}
/**
*
*
*/
public setRandomExpression(): void {
if (this._expressions.getSize() == 0) {
@ -683,22 +683,22 @@ export class LAppModel extends CubismUserModel {
}
/**
*
*
*/
public motionEventFired(eventValue: csmString): void {
CubismLogInfo('{0} is fired on LAppModel!!', eventValue.s);
}
/**
*
*
*
* ID
*
* @param hitArenaName ID
* @param x X
* @param y Y
* @param hitArenaName ID
* @param x X
* @param y Y
*/
public hitTest(hitArenaName: string, x: number, y: number): boolean {
// 透明時は当たり判定無し
// 透明时无碰撞检测
if (this._opacity < 1) {
return false;
}
@ -716,10 +716,10 @@ export class LAppModel extends CubismUserModel {
}
/**
*
* ModelSetting
*
* ModelSetting
*
* @param group
* @param group
*/
public preLoadMotionGroup(group: string): void {
for (let i = 0; i < this._modelSetting.getMotionCount(group); i++) {
@ -763,7 +763,7 @@ export class LAppModel extends CubismUserModel {
if (this._motionCount >= this._allMotionCount) {
this._state = LoadStep.LoadTexture;
// 全てのモーションを停止する
// 停止所有动作
this._motionManager.stopAllMotions();
this._updating = false;
@ -778,26 +778,26 @@ export class LAppModel extends CubismUserModel {
}
/**
*
*
*/
public releaseMotions(): void {
this._motions.clear();
}
/**
*
*
*/
public releaseExpressions(): void {
this._expressions.clear();
}
/**
* View-Projection
* View-Projection
*/
public doDraw(): void {
if (this._model == null) return;
// キャンバスサイズを渡す
// 传递画布大小
const viewport: number[] = [0, 0, canvas.width, canvas.height];
this.getRenderer().setRenderState(frameBuffer, viewport);
@ -805,14 +805,14 @@ export class LAppModel extends CubismUserModel {
}
/**
* View-Projection
* View-Projection
*/
public draw(matrix: CubismMatrix44): void {
if (this._model == null) {
return;
}
// 各読み込み終了後
// 各读取完成后
if (this._state == LoadStep.CompleteSetup) {
matrix.multiplyByMatrix(this._modelMatrix);
@ -847,7 +847,7 @@ export class LAppModel extends CubismUserModel {
}
/**
*
*
*/
public constructor() {
super();
@ -856,11 +856,11 @@ export class LAppModel extends CubismUserModel {
this._modelHomeDir = null;
this._userTimeSeconds = 0.0;
this._eyeBlinkIds = new csmVector<CubismIdHandle>();
this._lipSyncIds = new csmVector<CubismIdHandle>();
this._eyeBlinkIds = new csmVector<CubismIdHandle>(); // 模型设置的眨眼功能参数ID
this._lipSyncIds = new csmVector<CubismIdHandle>(); // 模型设置的唇形同步功能参数ID
this._motions = new csmMap<string, ACubismMotion>();
this._expressions = new csmMap<string, ACubismMotion>();
this._motions = new csmMap<string, ACubismMotion>(); // 已加载的动作列表
this._expressions = new csmMap<string, ACubismMotion>(); // 已加载的表情列表
this._hitArea = new csmVector<csmRect>();
this._userArea = new csmVector<csmRect>();
@ -897,31 +897,31 @@ export class LAppModel extends CubismUserModel {
this._consistency = false;
}
_modelSetting: ICubismModelSetting; // モデルセッティング情報
_modelHomeDir: string; // モデルセッティングが置かれたディレクトリ
_userTimeSeconds: number; // デルタ時間の積算値[秒]
_modelSetting: ICubismModelSetting; // 模型设置信息
_modelHomeDir: string; // 放置模型设置的目录
_userTimeSeconds: number; // 时间增量的累积值[秒]
_eyeBlinkIds: csmVector<CubismIdHandle>; // モデルに設定された瞬き機能用パラメータID
_lipSyncIds: csmVector<CubismIdHandle>; // モデルに設定されたリップシンク機能用パラメータID
_eyeBlinkIds: csmVector<CubismIdHandle>; // 模型设定的眨眼功能参数ID
_lipSyncIds: csmVector<CubismIdHandle>; // 模型设定的唇形同步功能参数ID
_motions: csmMap<string, ACubismMotion>; // 読み込まれているモーションのリスト
_expressions: csmMap<string, ACubismMotion>; // 読み込まれている表情のリスト
_motions: csmMap<string, ACubismMotion>; // 已加载的动作列表
_expressions: csmMap<string, ACubismMotion>; // 已加载的表情列表
_hitArea: csmVector<csmRect>;
_userArea: csmVector<csmRect>;
_idParamAngleX: CubismIdHandle; // パラメータID: ParamAngleX
_idParamAngleY: CubismIdHandle; // パラメータID: ParamAngleY
_idParamAngleZ: CubismIdHandle; // パラメータID: ParamAngleZ
_idParamEyeBallX: CubismIdHandle; // パラメータID: ParamEyeBallX
_idParamEyeBallY: CubismIdHandle; // パラメータID: ParamEyeBAllY
_idParamBodyAngleX: CubismIdHandle; // パラメータID: ParamBodyAngleX
_idParamAngleX: CubismIdHandle; // 参数ID: ParamAngleX
_idParamAngleY: CubismIdHandle; // 参数ID: ParamAngleY
_idParamAngleZ: CubismIdHandle; // 参数ID: ParamAngleZ
_idParamEyeBallX: CubismIdHandle; // 参数ID: ParamEyeBallX
_idParamEyeBallY: CubismIdHandle; // 参数ID: ParamEyeBAllY
_idParamBodyAngleX: CubismIdHandle; // 参数ID: ParamBodyAngleX
_state: LoadStep; // 現在のステータス管理用
_expressionCount: number; // 表情データカウント
_textureCount: number; // テクスチャカウント
_motionCount: number; // モーションデータカウント
_allMotionCount: number; // モーション総
_wavFileHandler: LAppWavFileHandler; //wavファイルハンドラ
_consistency: boolean; // MOC3一貫性チェック管理用
_state: LoadStep; // 当前的状态管理用
_expressionCount: number; // 表情数据计数
_textureCount: number; // 纹理计数
_motionCount: number; // 动作数据计数
_allMotionCount: number; // 动作总
_wavFileHandler: LAppWavFileHandler; //wav文件处理器
_consistency: boolean; // MOC3一致性检查管理用
}

View File

@ -6,19 +6,19 @@
*/
/**
* Cubism Platform Abstraction Layer.
* Cubism Platform Abstraction Layer .
*
*
* .
*/
export class LAppPal {
/**
*
*
*
* @param filePath
* @param filePath
* @return
* {
* buffer,
* size
* buffer,
* size
* }
*/
public static loadFileAsBytes(
@ -31,8 +31,8 @@ export class LAppPal {
}
/**
*
* @return [ms]
*
* @return [ms]
*/
public static getDeltaTime(): number {
return this.s_deltaTime;
@ -45,8 +45,8 @@ export class LAppPal {
}
/**
*
* @param message
*
* @param message
*/
public static printMessage(message: string): void {
console.log(message);

View File

@ -8,18 +8,18 @@
import { canvas, gl } from './lappdelegate';
/**
*
*
*
* Rect
* IDRect
*/
export class LAppSprite {
/**
*
* @param x x
* @param y y
* @param width
* @param height
* @param textureId
*
* @param x x
* @param y y
* @param width
* @param height
* @param textureId
*/
constructor(
x: number,
@ -50,7 +50,7 @@ export class LAppSprite {
}
/**
*
*
*/
public release(): void {
this._rect = null;
@ -69,54 +69,54 @@ export class LAppSprite {
}
/**
*
*
*/
public getTexture(): WebGLTexture {
return this._texture;
}
/**
*
* @param programId
* @param canvas
*
* @param programId
* @param canvas
*/
public render(programId: WebGLProgram): void {
if (this._texture == null) {
// ロードが完了していない
// 加载未完成
return;
}
// 初回描画時
// 首次绘制
if (this._firstDraw) {
// 何番目のattribute変数か取得
// 获取attribute变量的索引
this._positionLocation = gl.getAttribLocation(programId, 'position');
gl.enableVertexAttribArray(this._positionLocation);
this._uvLocation = gl.getAttribLocation(programId, 'uv');
gl.enableVertexAttribArray(this._uvLocation);
// 何番目のuniform変数か取得
// 获取uniform变量的索引
this._textureLocation = gl.getUniformLocation(programId, 'texture');
// uniform属性の登録
// 注册uniform属性
gl.uniform1i(this._textureLocation, 0);
// uvバッファ、座標初期
// uv缓冲,坐标初始
{
this._uvArray = new Float32Array([
1.0, 0.0, 0.0, 0.0, 0.0, 1.0, 1.0, 1.0
]);
// uvバッファを作成
// 创建uv缓冲
this._uvBuffer = gl.createBuffer();
}
// 頂点バッファ、座標初期
// 顶点缓冲,坐标初始
{
const maxWidth = canvas.width;
const maxHeight = canvas.height;
// 頂点データ
// 顶点数据
this._positionArray = new Float32Array([
(this._rect.right - maxWidth * 0.5) / (maxWidth * 0.5),
(this._rect.up - maxHeight * 0.5) / (maxHeight * 0.5),
@ -128,41 +128,41 @@ export class LAppSprite {
(this._rect.down - maxHeight * 0.5) / (maxHeight * 0.5)
]);
// 頂点バッファを作成
// 创建顶点缓冲
this._vertexBuffer = gl.createBuffer();
}
// 頂点インデックスバッファ、初期
// 顶点索引缓冲,初始
{
// インデックスデータ
// 索引数据
this._indexArray = new Uint16Array([0, 1, 2, 3, 2, 0]);
// インデックスバッファを作成
// 创建索引缓冲
this._indexBuffer = gl.createBuffer();
}
this._firstDraw = false;
}
// UV座標登録
// 注册UV坐标
gl.bindBuffer(gl.ARRAY_BUFFER, this._uvBuffer);
gl.bufferData(gl.ARRAY_BUFFER, this._uvArray, gl.STATIC_DRAW);
// attribute属性を登録
// 注册attribute属性
gl.vertexAttribPointer(this._uvLocation, 2, gl.FLOAT, false, 0, 0);
// 頂点座標を登録
// 注册顶点坐标
gl.bindBuffer(gl.ARRAY_BUFFER, this._vertexBuffer);
gl.bufferData(gl.ARRAY_BUFFER, this._positionArray, gl.STATIC_DRAW);
// attribute属性を登録
// 注册attribute属性
gl.vertexAttribPointer(this._positionLocation, 2, gl.FLOAT, false, 0, 0);
// 頂点インデックスを作成
// 创建顶点索引
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this._indexBuffer);
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this._indexArray, gl.DYNAMIC_DRAW);
// モデルの描画
// 绘制模型
gl.bindTexture(gl.TEXTURE_2D, this._texture);
gl.drawElements(
gl.TRIANGLES,
@ -173,15 +173,15 @@ export class LAppSprite {
}
/**
*
* @param pointX x
* @param pointY y
*
* @param pointX x
* @param pointY y
*/
public isHit(pointX: number, pointY: number): boolean {
// 画面サイズを取得する
// 获取屏幕大小
const { height } = canvas;
// Y座標は変換する必要あり
// Y坐标需要转换
const y = height - pointY;
return (
@ -192,10 +192,10 @@ export class LAppSprite {
);
}
_texture: WebGLTexture; // テクスチャ
_vertexBuffer: WebGLBuffer; // 頂点バッファ
_uvBuffer: WebGLBuffer; // uv頂点バッファ
_indexBuffer: WebGLBuffer; // 頂点インデックスバッファ
_texture: WebGLTexture; // 纹理
_vertexBuffer: WebGLBuffer; // 顶点缓冲
_uvBuffer: WebGLBuffer; // uv顶点缓冲
_indexBuffer: WebGLBuffer; // 顶点索引缓冲
_rect: Rect; // 矩形
_positionLocation: number;
@ -210,8 +210,8 @@ export class LAppSprite {
}
export class Rect {
public left: number; // 左
public right: number; // 右
public up: number; // 上
public down: number; // 下
public left: number; // 左
public right: number; // 右
public up: number; // 上
public down: number; // 下
}

View File

@ -10,19 +10,19 @@ import { csmVector, iterator } from '@framework/type/csmvector';
import { gl } from './lappdelegate';
/**
*
*
*
*
*/
export class LAppTextureManager {
/**
*
*
*/
constructor() {
this._textures = new csmVector<TextureInfo>();
}
/**
*
*
*/
public release(): void {
for (
@ -36,18 +36,18 @@ export class LAppTextureManager {
}
/**
*
*
*
* @param fileName
* @param usePremultiply Premult
* @return null
* @param fileName
* @param usePremultiply Premult
* @return null
*/
public createTextureFromPngFile(
fileName: string,
usePremultiply: boolean,
callback: (textureInfo: TextureInfo) => void
): void {
// search loaded texture already
// 搜索已加载的纹理
for (
let ite: iterator<TextureInfo> = this._textures.begin();
ite.notEqual(this._textures.end());
@ -57,9 +57,9 @@ export class LAppTextureManager {
ite.ptr().fileName == fileName &&
ite.ptr().usePremultply == usePremultiply
) {
// 2回目以降はキャッシュが使用される(待ち時間なし)
// WebKitでは同じImageのonloadを再度呼ぶには再インスタンスが必要
// 詳細https://stackoverflow.com/a/5024181
// 第二次及以后使用缓存(无等待时间)
// 在 WebKit 中,需要重新实例化 Image 才能再次调用相同的 onload
// 详情https://stackoverflow.com/a/5024181
ite.ptr().img = new Image();
ite
.ptr()
@ -71,18 +71,18 @@ export class LAppTextureManager {
}
}
// データのオンロードをトリガーにする
// 以数据加载为触发器
const img = new Image();
img.addEventListener(
'load',
(): void => {
// テクスチャオブジェクトの作成
// 创建纹理对象
const tex: WebGLTexture = gl.createTexture();
// テクスチャを選択
// 选择纹理
gl.bindTexture(gl.TEXTURE_2D, tex);
// テクスチャにピクセルを書き込む
// 将像素写入纹理
gl.texParameteri(
gl.TEXTURE_2D,
gl.TEXTURE_MIN_FILTER,
@ -90,12 +90,12 @@ export class LAppTextureManager {
);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
// Premult処理を行わせる
// 启用 Premult 处理
if (usePremultiply) {
gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, 1);
}
// テクスチャにピクセルを書き込む
// 将像素写入纹理
gl.texImage2D(
gl.TEXTURE_2D,
0,
@ -105,10 +105,10 @@ export class LAppTextureManager {
img
);
// ミップマップを生成
// 生成 Mipmap
gl.generateMipmap(gl.TEXTURE_2D);
// テクスチャをバインド
// 绑定纹理
gl.bindTexture(gl.TEXTURE_2D, null);
const textureInfo: TextureInfo = new TextureInfo();
@ -130,9 +130,9 @@ export class LAppTextureManager {
}
/**
*
*
*
*
*
*/
public releaseTextures(): void {
for (let i = 0; i < this._textures.getSize(); i++) {
@ -143,10 +143,10 @@ export class LAppTextureManager {
}
/**
*
*
*
*
* @param texture
*
* @param texture
*/
public releaseTextureByTexture(texture: WebGLTexture): void {
for (let i = 0; i < this._textures.getSize(); i++) {
@ -161,10 +161,10 @@ export class LAppTextureManager {
}
/**
*
*
*
*
* @param fileName
*
* @param fileName
*/
public releaseTextureByFilePath(fileName: string): void {
for (let i = 0; i < this._textures.getSize(); i++) {
@ -180,13 +180,13 @@ export class LAppTextureManager {
}
/**
*
*
*/
export class TextureInfo {
img: HTMLImageElement; // 画像
id: WebGLTexture = null; // テクスチャ
width = 0; // 横幅
height = 0; // 高
usePremultply: boolean; // Premult処理を有効にするか
fileName: string; // ファイル
img: HTMLImageElement; // 图片
id: WebGLTexture = null; // 纹理
width = 0; // 宽度
height = 0; // 高
usePremultply: boolean; // 是否启用 Premult 处理
fileName: string; // 文件
}

View File

@ -17,29 +17,29 @@ import { TextureInfo } from './lapptexturemanager';
import { TouchManager } from './touchmanager';
/**
*
*
*/
export class LAppView {
/**
*
*
*/
constructor() {
this._programId = null;
this._back = null;
this._gear = null;
// タッチ関係のイベント管理
// 触摸相关事件管理
this._touchManager = new TouchManager();
// デバイス座標からスクリーン座標に変換するための
// 从设备坐标到屏幕坐标的转换矩阵
this._deviceToScreen = new CubismMatrix44();
// 画面の表示の拡大縮小や移動の変換を行う行列
// 屏幕显示的缩放和移动转换矩阵
this._viewMatrix = new CubismViewMatrix();
}
/**
*
*
*/
public initialize(): void {
const { width, height } = canvas;
@ -50,7 +50,7 @@ export class LAppView {
const bottom: number = LAppDefine.ViewLogicalLeft;
const top: number = LAppDefine.ViewLogicalRight;
this._viewMatrix.setScreenRect(left, right, bottom, top); // デバイスに対応する画面の範囲。 Xの左端、Xの右端、Yの下端、Yの上端
this._viewMatrix.setScreenRect(left, right, bottom, top); // 设备对应的屏幕范围。 X的左端X的右端Y的下端Y的上端
this._viewMatrix.scale(LAppDefine.ViewScale, LAppDefine.ViewScale);
this._deviceToScreen.loadIdentity();
@ -63,11 +63,11 @@ export class LAppView {
}
this._deviceToScreen.translateRelative(-width * 0.5, -height * 0.5);
// 表示範囲の設定
this._viewMatrix.setMaxScale(LAppDefine.ViewMaxScale); // 限界拡張
this._viewMatrix.setMinScale(LAppDefine.ViewMinScale); // 限界縮小率
// 设置显示范围
this._viewMatrix.setMaxScale(LAppDefine.ViewMaxScale); // 最大扩展
this._viewMatrix.setMinScale(LAppDefine.ViewMinScale); // 最大缩小率
// 表示できる最大範囲
// 可显示的最大范围
this._viewMatrix.setMaxScreenRect(
LAppDefine.ViewLogicalMaxLeft,
LAppDefine.ViewLogicalMaxRight,
@ -77,7 +77,7 @@ export class LAppView {
}
/**
*
*
*/
public release(): void {
this._viewMatrix = null;
@ -95,7 +95,7 @@ export class LAppView {
}
/**
*
*
*/
public render(): void {
gl.useProgram(this._programId);
@ -117,7 +117,7 @@ export class LAppView {
}
/**
*
*
*/
public initializeSprite(): void {
const width: number = canvas.width;
@ -128,10 +128,10 @@ export class LAppView {
let imageName = '';
// 背景画像初期
// 背景图片初始
imageName = LAppDefine.BackImageName;
// 非同期なのでコールバック関数を作成
// 因为是异步的所以创建回调函数
const initBackGroundTexture = (textureInfo: TextureInfo): void => {
const x: number = width * 0.5;
const y: number = height * 0.5;
@ -147,7 +147,7 @@ export class LAppView {
initBackGroundTexture
);
// 歯車画像初期
// 齿轮图片初始
imageName = LAppDefine.GearImageName;
const initGearTexture = (textureInfo: TextureInfo): void => {
const x = width - textureInfo.width * 0.5;
@ -163,17 +163,17 @@ export class LAppView {
initGearTexture
);
// シェーダーを作成
// 创建着色器
if (this._programId == null) {
this._programId = LAppDelegate.getInstance().createShader();
}
}
/**
*
*
*
* @param pointX X
* @param pointY Y
* @param pointX X
* @param pointY Y
*/
public onTouchesBegan(pointX: number, pointY: number): void {
this._touchManager.touchesBegan(
@ -183,10 +183,10 @@ export class LAppView {
}
/**
*
*
*
* @param pointX X
* @param pointY Y
* @param pointX X
* @param pointY Y
*/
public onTouchesMoved(pointX: number, pointY: number): void {
const viewX: number = this.transformViewX(this._touchManager.getX());
@ -202,31 +202,31 @@ export class LAppView {
}
/**
*
*
*
* @param pointX X
* @param pointY Y
* @param pointX X
* @param pointY Y
*/
public onTouchesEnded(pointX: number, pointY: number): void {
// タッチ終了
// 触摸结束
const live2DManager: LAppLive2DManager = LAppLive2DManager.getInstance();
live2DManager.onDrag(0.0, 0.0);
{
// シングルタップ
// 单次触摸
const x: number = this._deviceToScreen.transformX(
this._touchManager.getX()
); // 論理座標変換した座標を取得
); // 获取经过逻辑坐标转换的坐标
const y: number = this._deviceToScreen.transformY(
this._touchManager.getY()
); // 論理座標変化した座標を取得
); // 获取经过逻辑坐标转换的坐标
if (LAppDefine.DebugTouchLogEnable) {
LAppPal.printMessage(`[APP]touchesEnded x: ${x} y: ${y}`);
}
live2DManager.onTap(x, y);
// 歯車にタップしたか
// 点击了齿轮?
if (
this._gear.isHit(
pointX * window.devicePixelRatio,
@ -239,48 +239,48 @@ export class LAppView {
}
/**
* XView
* XView
*
* @param deviceX X
* @param deviceX X
*/
public transformViewX(deviceX: number): number {
const screenX: number = this._deviceToScreen.transformX(deviceX); // 論理座標変換した座標を取得
return this._viewMatrix.invertTransformX(screenX); // 拡大、縮小、移動後の値
const screenX: number = this._deviceToScreen.transformX(deviceX); // 获取经过逻辑坐标转换的坐标
return this._viewMatrix.invertTransformX(screenX); // 获取缩放,移动后的值
}
/**
* YView
* YView
*
* @param deviceY Y
* @param deviceY Y
*/
public transformViewY(deviceY: number): number {
const screenY: number = this._deviceToScreen.transformY(deviceY); // 論理座標変換した座標を取得
const screenY: number = this._deviceToScreen.transformY(deviceY); // 获取经过逻辑坐标转换的坐标
return this._viewMatrix.invertTransformY(screenY);
}
/**
* XScreen
* @param deviceX X
* XScreen
* @param deviceX X
*/
public transformScreenX(deviceX: number): number {
return this._deviceToScreen.transformX(deviceX);
}
/**
* YScreen
* YScreen
*
* @param deviceY Y
* @param deviceY Y
*/
public transformScreenY(deviceY: number): number {
return this._deviceToScreen.transformY(deviceY);
}
_touchManager: TouchManager; // タッチマネージャー
_deviceToScreen: CubismMatrix44; // デバイスからスクリーンへの行列
_touchManager: TouchManager; // 触摸管理器
_deviceToScreen: CubismMatrix44; // 从设备到屏幕的矩阵
_viewMatrix: CubismViewMatrix; // viewMatrix
_programId: WebGLProgram; // シェーダID
_back: LAppSprite; // 背景画像
_gear: LAppSprite; // ギア画像
_changeModel: boolean; // モデル切り替えフラグ
_isClick: boolean; // クリック中
_programId: WebGLProgram; // 着色器ID
_back: LAppSprite; // 背景图片
_gear: LAppSprite; // 齿轮图片
_changeModel: boolean; // 模型切换标志
_isClick: boolean; // 正在点击
}

View File

@ -11,10 +11,9 @@ export let s_instance: LAppWavFileHandler = null;
export class LAppWavFileHandler {
/**
*
*
*
*
* @return
* @return
*/
public static getInstance(): LAppWavFileHandler {
if (s_instance == null) {
@ -25,7 +24,7 @@ export class LAppWavFileHandler {
}
/**
*
*
*/
public static releaseInstance(): void {
if (s_instance != null) {
@ -39,7 +38,7 @@ export class LAppWavFileHandler {
let goalOffset: number;
let rms: number;
// データロード前/ファイル末尾に達した場合は更新しない
// 如果在加载数据之前/达到文件末尾,则不更新
if (
this._pcmData == null ||
this._sampleOffset >= this._wavFileInfo._samplesPerChannel
@ -48,7 +47,7 @@ export class LAppWavFileHandler {
return false;
}
// 経過時間後の状態を保持
// 保持经过时间后的状态
this._userTimeSeconds += deltaTimeSeconds;
goalOffset = Math.floor(
this._userTimeSeconds * this._wavFileInfo._samplingRate
@ -57,7 +56,7 @@ export class LAppWavFileHandler {
goalOffset = this._wavFileInfo._samplesPerChannel;
}
// RMS計測
// RMS测量
rms = 0.0;
for (
let channelCount = 0;
@ -85,11 +84,11 @@ export class LAppWavFileHandler {
}
public start(filePath: string): void {
// サンプル位参照位置を初期化
// 初始化样本位参考位置
this._sampleOffset = 0;
this._userTimeSeconds = 0.0;
// RMS値をリセット
// 重置RMS值
this._lastRms = 0.0;
if (!this.loadWavFile(filePath)) {
@ -108,7 +107,7 @@ export class LAppWavFileHandler {
this.releasePcmData();
}
// ファイルロード
// 文件加载
const asyncFileLoad = async () => {
return fetch(filePath).then(responce => {
return responce.arrayBuffer();
@ -121,7 +120,7 @@ export class LAppWavFileHandler {
this._byteReader._fileSize = this._byteReader._fileByte.byteLength;
this._byteReader._readOffset = 0;
// ファイルロードに失敗しているか、先頭のシグネチャ"RIFF"を入れるサイズもない場合は失敗
// 如果文件加载失败或者没有足够的大小来插入顶部的签名"RIFF",则失败
if (
this._byteReader._fileByte == null ||
this._byteReader._fileSize < 4
@ -129,50 +128,50 @@ export class LAppWavFileHandler {
return false;
}
// ファイル
// 文件
this._wavFileInfo._fileName = filePath;
try {
// シグネチャ "RIFF"
// 签名 "RIFF"
if (!this._byteReader.getCheckSignature('RIFF')) {
ret = false;
throw new Error('Cannot find Signeture "RIFF".');
}
// ファイルサイズ-8読み飛ばし
// 文件大小-8跳过
this._byteReader.get32LittleEndian();
// シグネチャ "WAVE"
// 签名 "WAVE"
if (!this._byteReader.getCheckSignature('WAVE')) {
ret = false;
throw new Error('Cannot find Signeture "WAVE".');
}
// シグネチャ "fmt "
// 签名 "fmt "
if (!this._byteReader.getCheckSignature('fmt ')) {
ret = false;
throw new Error('Cannot find Signeture "fmt".');
}
// fmtチャンクサイズ
// fmt块大小
const fmtChunkSize = this._byteReader.get32LittleEndian();
// フォーマットIDは1リニアPCM以外受け付けない
// 格式ID不接受1线性PCM以外的格式
if (this._byteReader.get16LittleEndian() != 1) {
ret = false;
throw new Error('File is not linear PCM.');
}
// チャンネル数
// 通道数量
this._wavFileInfo._numberOfChannels =
this._byteReader.get16LittleEndian();
// サンプリングレート
// 采样率
this._wavFileInfo._samplingRate = this._byteReader.get32LittleEndian();
// データ速度[byte/sec](読み飛ばし
// 数据速度[byte/sec](跳过
this._byteReader.get32LittleEndian();
// ブロックサイズ(読み飛ばし
// 块大小(跳过
this._byteReader.get16LittleEndian();
// 量子化ビット
// 量化位
this._wavFileInfo._bitsPerSample = this._byteReader.get16LittleEndian();
// fmtチャンクの拡張部分の読み飛ばし
// 跳过fmt块的扩展部分
if (fmtChunkSize > 16) {
this._byteReader._readOffset += fmtChunkSize - 16;
}
// "data"チャンクが出現するまで読み飛ばし
// 跳过直到出现"data"块
while (
!this._byteReader.getCheckSignature('data') &&
this._byteReader._readOffset < this._byteReader._fileSize
@ -180,12 +179,12 @@ export class LAppWavFileHandler {
this._byteReader._readOffset +=
this._byteReader.get32LittleEndian() + 4;
}
// ファイル内に"data"チャンクが出現しなかった
// 文件中没有出现"data"块
if (this._byteReader._readOffset >= this._byteReader._fileSize) {
ret = false;
throw new Error('Cannot find "data" Chunk.');
}
// サンプル数
// 样本数量
{
const dataChunkSize = this._byteReader.get32LittleEndian();
this._wavFileInfo._samplesPerChannel =
@ -193,7 +192,7 @@ export class LAppWavFileHandler {
(this._wavFileInfo._bitsPerSample *
this._wavFileInfo._numberOfChannels);
}
// 領域確
// 留区域
this._pcmData = new Array(this._wavFileInfo._numberOfChannels);
for (
let channelCount = 0;
@ -204,7 +203,7 @@ export class LAppWavFileHandler {
this._wavFileInfo._samplesPerChannel
);
}
// 波形データ取得
// 获取波形数据
for (
let sampleCount = 0;
sampleCount < this._wavFileInfo._samplesPerChannel;
@ -231,7 +230,7 @@ export class LAppWavFileHandler {
public getPcmSample(): number {
let pcm32;
// 32ビット幅に拡張してから-11の範囲に丸める
// 在扩展到32位宽度后将其四舍五入到-11的范围内
switch (this._wavFileInfo._bitsPerSample) {
case 8:
pcm32 = this._byteReader.get8() - 128;
@ -244,7 +243,7 @@ export class LAppWavFileHandler {
pcm32 = this._byteReader.get24LittleEndian() << 8;
break;
default:
// 対応していないビット幅
// 不支持的位宽
pcm32 = 0;
break;
}
@ -295,11 +294,11 @@ export class WavFileInfo {
this._samplesPerChannel = 0;
}
_fileName: string; ///< ファイル
_numberOfChannels: number; ///< チャンネル
_bitsPerSample: number; ///< サンプルあたりビット
_samplingRate: number; ///< サンプリングレート
_samplesPerChannel: number; ///< 1チャンネルあたり総サンプル
_fileName: string; ///< 文件
_numberOfChannels: number; ///< 通道
_bitsPerSample: number; ///< 每个样本的位
_samplingRate: number; ///< 采样率
_samplesPerChannel: number; ///< 每个通道的总样本
}
export class ByteReader {
@ -311,8 +310,8 @@ export class ByteReader {
}
/**
* @brief 8
* @return Csm::csmUint8 8
* @brief 8
* @return Csm::csmUint8 8
*/
public get8(): number {
const ret = this._fileDataView.getUint8(this._readOffset);
@ -321,8 +320,8 @@ export class ByteReader {
}
/**
* @brief 16
* @return Csm::csmUint16 16
* @brief 16
* @return Csm::csmUint16 16
*/
public get16LittleEndian(): number {
const ret =
@ -333,8 +332,8 @@ export class ByteReader {
}
/**
* @brief 24
* @return Csm::csmUint32 2424
* @brief 24
* @return Csm::csmUint32 2424
*/
public get24LittleEndian(): number {
const ret =
@ -346,8 +345,8 @@ export class ByteReader {
}
/**
* @brief 32
* @return Csm::csmUint32 32
* @brief 32
* @return Csm::csmUint32 32
*/
public get32LittleEndian(): number {
const ret =
@ -360,10 +359,10 @@ export class ByteReader {
}
/**
* @brief
* @param[in] reference
* @retval true
* @retval false
* @brief
* @param[in] reference
* @retval true
* @retval false
*/
public getCheckSignature(reference: string): boolean {
const getSignature: Uint8Array = new Uint8Array(4);
@ -382,8 +381,8 @@ export class ByteReader {
);
}
_fileByte: ArrayBuffer; ///< ロードしたファイルのバイト
_fileByte: ArrayBuffer; ///< 加载的文件字节序
_fileDataView: DataView;
_fileSize: number; ///< ファイルサイズ
_readOffset: number; ///< ファイル参照位置
_fileSize: number; ///< 文件大小
_readOffset: number; ///< 文件引用位置
}

View File

@ -9,12 +9,12 @@ import { LAppDelegate } from './lappdelegate';
import * as LAppDefine from './lappdefine';
/**
*
*
*/
window.addEventListener(
'load',
(): void => {
// create the application instance
// 创建应用实例
if (LAppDelegate.getInstance().initialize() == false) {
return;
}
@ -25,7 +25,7 @@ window.addEventListener(
);
/**
*
*
*/
window.addEventListener(
'beforeunload',
@ -34,7 +34,7 @@ window.addEventListener(
);
/**
* Process when changing screen size.
*
*/
window.addEventListener(
'resize',

View File

@ -7,7 +7,7 @@
export class TouchManager {
/**
*
*
*/
constructor() {
this._startX = 0.0;
@ -91,9 +91,9 @@ export class TouchManager {
}
/**
*
* @param deviceX x
* @param deviceY y
*
* @param deviceX x
* @param deviceY y
*/
public touchesBegan(deviceX: number, deviceY: number): void {
this._lastX = deviceX;
@ -106,9 +106,9 @@ export class TouchManager {
}
/**
*
* @param deviceX x
* @param deviceY y
*
* @param deviceX x
* @param deviceY y
*/
public touchesMoved(deviceX: number, deviceY: number): void {
this._lastX = deviceX;
@ -118,8 +118,8 @@ export class TouchManager {
}
/**
*
* @return
* flick
* @return flick
*/
public getFlickDistance(): number {
return this.calculateDistance(
@ -131,12 +131,12 @@ export class TouchManager {
}
/**
*
* 12
*
* @param x1 x
* @param y1 y
* @param x2 x
* @param y2 y
* @param x1 x
* @param y1 y
* @param x2 x
* @param y2 y
*/
public calculateDistance(
x1: number,
@ -148,13 +148,13 @@ export class TouchManager {
}
/**
*
*
*
* 0
*
* @param v1
* @param v2
* @param v1
* @param v2
*
* @return
* @return
*/
public calculateMovingAmount(v1: number, v2: number): number {
if (v1 > 0.0 != v2 > 0.0) {
@ -169,18 +169,18 @@ export class TouchManager {
);
}
_startY: number; // タッチを開始した時のxの値
_startX: number; // タッチを開始した時のyの値
_lastX: number; // シングルタッチ時のxの値
_lastY: number; // シングルタッチ時のyの値
_lastX1: number; // ダブルタッチ時の一つ目のxの値
_lastY1: number; // ダブルタッチ時の一つ目のyの値
_lastX2: number; // ダブルタッチ時の二つ目のxの値
_lastY2: number; // ダブルタッチ時の二つ目のyの値
_lastTouchDistance: number; // 2本以上でタッチしたときの指の距離
_deltaX: number; // 前回の値から今回の値へのxの移動距離
_deltaY: number; // 前回の値から今回の値へのyの移動距離
_scale: number; // このフレームで掛け合わせる拡大率。拡大操作中以外は1。
_touchSingle: boolean; // シングルタッチ時はtrue
_flipAvailable: boolean; // フリップが有効かどうか
_startY: number; // 触摸开始时的x值
_startX: number; // 触摸开始时的y值
_lastX: number; // 单点触摸时的x值
_lastY: number; // 单点触摸时的y值
_lastX1: number; // 双点触摸时的第一个点的x值
_lastY1: number; // 双点触摸时的第一个点的y值
_lastX2: number; // 双点触摸时的第二个点的x值
_lastY2: number; // 双点触摸时的第二个点的y值
_lastTouchDistance: number; // 当触摸2个以上的点时指的距离
_deltaX: number; // 从上一个值到现在的值的x移动距离
_deltaY: number; // 从上一个值到现在的值的y移动距离
_scale: number; // 这一帧要乘的缩放比例。除了缩放操作中,其他时候为1。
_touchSingle: boolean; // 单点触摸时为true
_flipAvailable: boolean; // flick是否可用
}

View File

@ -34,7 +34,7 @@ module.exports = {
}
],
hot: true,
port: 5000,
port: 8080,
host: '0.0.0.0',
compress: true,
devMiddleware: {