+ {/* live2d */}
+
- useEffect(() => {
- // expose PIXI to window so that this plugin is able to
- // reference window.PIXI.Ticker to automatically update Live2D models
- //@ts-ignore
- typeof window !== 'undefined' && (window.PIXI = PIXI);
- (async function () {
- const app = new PIXI.Application({
- view: document.getElementById('canvas') as HTMLCanvasElement,
- backgroundAlpha: 1
- });
+ {/* 旧叉 */}
+ {/*
- {
- typeof window !== 'undefined'
- && typeof window.Live2D !== 'undefined'
- && (
- );
-}
\ No newline at end of file
+ {/* 输入框 */}
+
+ )}
+
+ {response ? response : "请输入文字和我聊天吧"}
+
*/}
- const model = await Live2DModel.from('https://cdn.jsdelivr.net/gh/guansss/pixi-live2d-display/test/assets/shizuku/shizuku.model.json');
+ {/* 角色信息 */}
+
+
+
- app.stage.addChild(model);
- const scaleX = (innerWidth * 0.4) / model.width;
- const scaleY = (innerHeight * 0.8) / model.height;
+ {/* 消息泡泡 */}
+ 昵称
+
+ {response ? response : "请输入文字和我聊天吧"}
+
- // fit the window
- model.scale.set(0.3);
+ {/* 选项 */}
+
+ {opList.map((item) => (
+
- model.y = innerHeight * 0.1;
+ {/* 旧叉 */}
+ {/* */}
+ {/*
+ */}
- draggable(model);
- addFrame(model);
- addHitAreaFrames(model);
- setModel(model);
- model.on('hit', (hitAreas) => {
- if (hitAreas.includes('body')) {
- model.motion('tap_body');
- model.motion('speak')
- }
- });
- })();
- }, [])
- return (
-
-
+
+ ))}
+
+ 
+
+ {item.title}
+
-
-
)
- }
- {response ? response : "请输入文字和我聊天吧"}
-
-
-
- {
- setInputText(e.target.value);
- console.log(e.target.value)
- }}>
-
-
+
+ {useVoice ? (
+
+ ) : (
+ {
+ setInputText(e.target.value);
+ console.log(e.target.value);
+ }}
+ >
+ )}
+
+
+