diff --git a/docs/tasks/task_detail_2026_04_11.md b/docs/tasks/task_detail_2026_04_11.md index 89309fe..a02c3cf 100644 --- a/docs/tasks/task_detail_2026_04_11.md +++ b/docs/tasks/task_detail_2026_04_11.md @@ -42,3 +42,14 @@ 3. 安装依赖并修复 TypeScript 构建问题,完成生产构建验证。 - **执行结果**: 项目已可运行并可构建,页面可显示基础 3D 场景与 RPG 调试面板,作为后续探索/战斗系统开发起点。 +# 任务执行摘要 + +## 会话 ID: 1775839250 +- [2026-04-11 00:40:50] +- **执行原因**: 用户要求“继续完成”,希望在现有骨架上推进可玩功能。 +- **执行过程**: + 1. 新增输入系统与共享游戏状态,支持键盘移动与状态同步展示。 + 2. 扩展 Three.js 场景逻辑,加入角色移动、边界与障碍碰撞、区域切换、传送点占位和随机遇敌计量。 + 3. 更新状态面板为实时数据显示,并执行构建验证确保可编译运行。 +- **执行结果**: 已完成探索层 MVP,玩家可在 3D 场景中移动并获得基础 RPG 反馈,项目继续可在此基础上对接战斗系统。 + diff --git a/src/core/input.ts b/src/core/input.ts new file mode 100644 index 0000000..b28dd6e --- /dev/null +++ b/src/core/input.ts @@ -0,0 +1,34 @@ +export class KeyboardInput { + private readonly pressed = new Set() + + private readonly onKeyDown = (event: KeyboardEvent) => { + this.pressed.add(event.code) + } + + private readonly onKeyUp = (event: KeyboardEvent) => { + this.pressed.delete(event.code) + } + + start() { + window.addEventListener('keydown', this.onKeyDown) + window.addEventListener('keyup', this.onKeyUp) + } + + stop() { + window.removeEventListener('keydown', this.onKeyDown) + window.removeEventListener('keyup', this.onKeyUp) + this.pressed.clear() + } + + getMoveAxis() { + let x = 0 + let z = 0 + + if (this.pressed.has('KeyW') || this.pressed.has('ArrowUp')) z -= 1 + if (this.pressed.has('KeyS') || this.pressed.has('ArrowDown')) z += 1 + if (this.pressed.has('KeyA') || this.pressed.has('ArrowLeft')) x -= 1 + if (this.pressed.has('KeyD') || this.pressed.has('ArrowRight')) x += 1 + + return { x, z } + } +} diff --git a/src/data/gameConfig.ts b/src/data/gameConfig.ts index c8a99c7..e3bf8e8 100644 --- a/src/data/gameConfig.ts +++ b/src/data/gameConfig.ts @@ -1,4 +1,4 @@ export const gameConfig = { title: 'Breath of Fire-like RPG Demo', - tagline: '里程碑 0: Vue + TypeScript + WebGL 基础骨架', + tagline: '里程碑 1: 可移动探索 + 碰撞 + 遇敌占位', } diff --git a/src/game/ThreeScene.vue b/src/game/ThreeScene.vue index e82d775..1d5fb8b 100644 --- a/src/game/ThreeScene.vue +++ b/src/game/ThreeScene.vue @@ -1,16 +1,61 @@ @@ -40,4 +41,13 @@ ul { gap: 6px; font-size: 14px; } + +.notice { + margin: 10px 0 0; + padding: 8px 10px; + border-radius: 8px; + background: #20313d; + color: #9bc2da; + font-size: 12px; +}