refactor(game): 移除已弃用的事件常量
- 删除 UpdateHero 和 UpdateFightHero 事件 - 移除 MISSION_UPDATE 事件常量 - 优化游戏事件枚举定义
This commit is contained in:
panw
423
.qoder/repowiki/zh/content/奖励系统/奖励UI交互/奖励UI交互.md
Normal file
423
.qoder/repowiki/zh/content/奖励系统/奖励UI交互/奖励UI交互.md
Normal file
@@ -0,0 +1,423 @@
|
||||
# 奖励UI交互
|
||||
|
||||
<cite>
|
||||
**本文档中引用的文件**
|
||||
- [MissionComp.ts](file://assets/script/game/map/MissionComp.ts)
|
||||
- [VictoryComp.ts](file://assets/script/game/map/VictoryComp.ts)
|
||||
- [MissionHeroComp.ts](file://assets/script/game/map/MissionHeroComp.ts)
|
||||
- [MissionMonComp.ts](file://assets/script/game/map/MissionMonComp.ts)
|
||||
- [MissionHomeComp.ts](file://assets/script/game/map/MissionHomeComp.ts)
|
||||
- [GameEvent.ts](file://assets/script/game/common/config/GameEvent.ts)
|
||||
- [GameUIConfig.ts](file://assets/script/game/common/config/GameUIConfig.ts)
|
||||
- [SingletonModuleComp.ts](file://assets/script/game/common/SingletonModuleComp.ts)
|
||||
</cite>
|
||||
|
||||
## 目录
|
||||
1. [系统概述](#系统概述)
|
||||
2. [核心组件架构](#核心组件架构)
|
||||
3. [事件驱动机制](#事件驱动机制)
|
||||
4. [奖励触发条件](#奖励触发条件)
|
||||
5. [UI界面展示](#ui界面展示)
|
||||
6. [数据绑定与状态管理](#数据绑定与状态管理)
|
||||
7. [界面过渡动画](#界面过渡动画)
|
||||
8. [用户交互反馈](#用户交互反馈)
|
||||
9. [系统集成流程](#系统集成流程)
|
||||
10. [故障排除指南](#故障排除指南)
|
||||
|
||||
## 系统概述
|
||||
|
||||
奖励系统UI交互是游戏战斗胜利后的重要组成部分，负责在玩家完成战斗后展示奖励选项、经验值、金币和钻石等资源。系统采用事件驱动架构，通过MissionComp作为核心控制器，协调各个子组件完成完整的奖励展示流程。
|
||||
|
||||
### 系统特点
|
||||
- **事件驱动**：基于GameEvent机制的松耦合设计
|
||||
- **数据驱动**：使用MVVM模式实现数据绑定
|
||||
- **状态管理**：通过SingletonModuleComp统一管理游戏状态
|
||||
- **动画流畅**：支持平滑的界面过渡效果
|
||||
|
||||
## 核心组件架构
|
||||
|
||||
```mermaid
|
||||
classDiagram
|
||||
class MissionComp {
|
||||
+rewards : any[]
|
||||
+game_data : any
|
||||
+onLoad() void
|
||||
+do_hero_dead(event, data) void
|
||||
+fight_end() void
|
||||
+mission_start() void
|
||||
+to_fight() void
|
||||
}
|
||||
class VictoryComp {
|
||||
+reward_lv : number
|
||||
+reward_num : number
|
||||
+rewards : any[]
|
||||
+game_data : any
|
||||
+onAdded(args) void
|
||||
+victory_end() void
|
||||
+restart() void
|
||||
+double_reward() void
|
||||
}
|
||||
class MissionHeroCompComp {
|
||||
+Friend_is_dead : boolean
|
||||
+current_hero_uuid : number
|
||||
+heros : any[]
|
||||
+onLoad() void
|
||||
+fight_ready() void
|
||||
+addHero(uuid, is_zhaohuan) void
|
||||
}
|
||||
class MissionMonCompComp {
|
||||
+monsterQueue : Array
|
||||
+spawnInterval : number
|
||||
+spawnCount : number
|
||||
+onLoad() void
|
||||
+fight_ready() void
|
||||
+generateMonstersFromStageConfig(configs) void
|
||||
}
|
||||
class MissionHomeComp {
|
||||
+onLoad() void
|
||||
+home_active() void
|
||||
+mission_end() void
|
||||
}
|
||||
class SingletonModuleComp {
|
||||
+mission : any
|
||||
+vmdata : any
|
||||
+guides : any[]
|
||||
+data : any
|
||||
}
|
||||
MissionComp --> VictoryComp : "触发FightEnd事件"
|
||||
MissionComp --> SingletonModuleComp : "更新游戏状态"
|
||||
VictoryComp --> SingletonModuleComp : "读取游戏数据"
|
||||
MissionHeroCompComp --> SingletonModuleComp : "监控英雄状态"
|
||||
MissionMonCompComp --> SingletonModuleComp : "监控怪物状态"
|
||||
MissionHomeComp --> SingletonModuleComp : "监控关卡状态"
|
||||
```
|
||||
|
||||
**图表来源**
|
||||
- [MissionComp.ts](file://assets/script/game/map/MissionComp.ts#L15-L151)
|
||||
- [VictoryComp.ts](file://assets/script/game/map/VictoryComp.ts#L15-L75)
|
||||
- [MissionHeroComp.ts](file://assets/script/game/map/MissionHeroComp.ts#L12-L81)
|
||||
- [MissionMonComp.ts](file://assets/script/game/map/MissionMonComp.ts#L15-L240)
|
||||
- [MissionHomeComp.ts](file://assets/script/game/map/MissionHomeComp.ts#L12-L54)
|
||||
- [SingletonModuleComp.ts](file://assets/script/game/common/SingletonModuleComp.ts#L25-L195)
|
||||
|
||||
**章节来源**
|
||||
- [MissionComp.ts](file://assets/script/game/map/MissionComp.ts#L1-L151)
|
||||
- [VictoryComp.ts](file://assets/script/game/map/VictoryComp.ts#L1-L75)
|
||||
- [MissionHeroComp.ts](file://assets/script/game/map/MissionHeroComp.ts#L1-L81)
|
||||
- [MissionMonComp.ts](file://assets/script/game/map/MissionMonComp.ts#L1-L240)
|
||||
- [MissionHomeComp.ts](file://assets/script/game/map/MissionHomeComp.ts#L1-L54)
|
||||
|
||||
## 事件驱动机制
|
||||
|
||||
### 核心事件流程
|
||||
|
||||
```mermaid
|
||||
sequenceDiagram
|
||||
participant Player as 玩家
|
||||
participant MissionComp as MissionComp
|
||||
participant GameEvent as GameEvent
|
||||
participant VictoryComp as VictoryComp
|
||||
participant GUI as GUI系统
|
||||
participant SM as SingletonModule
|
||||
Player->>MissionComp : 战斗结束
|
||||
MissionComp->>GameEvent : dispatchEvent(FightEnd)
|
||||
GameEvent->>MissionComp : 监听FightEnd事件
|
||||
MissionComp->>SM : 更新游戏状态
|
||||
MissionComp->>GUI : oops.gui.open(UIID.Victory)
|
||||
GUI->>VictoryComp : 创建胜利界面
|
||||
VictoryComp->>VictoryComp : onAdded(args)
|
||||
VictoryComp->>VictoryComp : 展示奖励数据
|
||||
VictoryComp->>Player : 显示奖励选项
|
||||
Note over Player,SM : 奖励界面完全加载并显示
|
||||
```
|
||||
|
||||
**图表来源**
|
||||
- [MissionComp.ts](file://assets/script/game/map/MissionComp.ts#L32-L35)
|
||||
- [GameEvent.ts](file://assets/script/game/common/config/GameEvent.ts#L40-L41)
|
||||
- [GameUIConfig.ts](file://assets/script/game/common/config/GameUIConfig.ts#L12-L13)
|
||||
|
||||
### 事件监听与响应
|
||||
|
||||
系统通过事件总线机制实现组件间的解耦通信：
|
||||
|
||||
1. **FightEnd事件触发**：当所有英雄死亡时，MissionComp检测到战斗结束状态
|
||||
2. **状态更新**：更新SingletonModuleComp中的游戏状态
|
||||
3. **界面打开**：通过GUI系统打开胜利界面
|
||||
4. **数据传递**：将rewards和game_data参数传递给Victory界面
|
||||
|
||||
**章节来源**
|
||||
- [MissionComp.ts](file://assets/script/game/map/MissionComp.ts#L55-L65)
|
||||
- [GameEvent.ts](file://assets/script/game/common/config/GameEvent.ts#L40-L41)
|
||||
- [GameUIConfig.ts](file://assets/script/game/common/config/GameUIConfig.ts#L12-L13)
|
||||
|
||||
## 奖励触发条件
|
||||
|
||||
### 英雄死亡触发机制
|
||||
|
||||
```mermaid
|
||||
flowchart TD
|
||||
Start([战斗开始]) --> Monitor[监控英雄状态]
|
||||
Monitor --> CheckHero{检查英雄数量}
|
||||
CheckHero --> |英雄存活| Continue[继续战斗]
|
||||
CheckHero --> |英雄死亡| Decrement[减少英雄数量]
|
||||
Decrement --> CheckAllDead{所有英雄死亡?}
|
||||
CheckAllDead --> |否| Continue
|
||||
CheckAllDead --> |是| TriggerFightEnd[触发FightEnd事件]
|
||||
TriggerFightEnd --> OpenVictory[打开胜利界面]
|
||||
OpenVictory --> PassData[传递奖励数据]
|
||||
PassData --> End([流程结束])
|
||||
Continue --> Monitor
|
||||
```
|
||||
|
||||
**图表来源**
|
||||
- [MissionComp.ts](file://assets/script/game/map/MissionComp.ts#L55-L65)
|
||||
|
||||
### 怪物击杀触发机制
|
||||
|
||||
系统通过MissionMonComp监控怪物状态，每击杀一只怪物会：
|
||||
- 更新怪物数量计数器
|
||||
- 触发相应的事件通知
|
||||
- 记录战斗统计数据
|
||||
|
||||
### 基地保护触发机制
|
||||
|
||||
MissionHomeComp负责监控基地状态，当基地受到威胁时：
|
||||
- 更新基地保护状态
|
||||
- 触发防御机制
|
||||
- 记录基地受损情况
|
||||
|
||||
**章节来源**
|
||||
- [MissionComp.ts](file://assets/script/game/map/MissionComp.ts#L47-L52)
|
||||
- [MissionMonComp.ts](file://assets/script/game/map/MissionMonComp.ts#L47-L52)
|
||||
- [MissionHomeComp.ts](file://assets/script/game/map/MissionHomeComp.ts#L25-L35)
|
||||
|
||||
## UI界面展示
|
||||
|
||||
### 胜利界面结构
|
||||
|
||||
VictoryComp负责展示战斗胜利后的奖励界面，包含以下核心元素：
|
||||
|
||||
| 组件名称 | 功能描述 | 数据绑定 |
|
||||
|---------|---------|---------|
|
||||
| title.victory | 胜利标题显示 | 自动激活 |
|
||||
| btns.next | 下一步按钮 | 延迟0.2秒激活 |
|
||||
| reward_lv | 奖励等级 | 动态计算 |
|
||||
| reward_num | 奖励数量 | 固定值2 |
|
||||
| game_data.exp | 经验值奖励 | 从MissionComp传递 |
|
||||
| game_data.gold | 金币奖励 | 从MissionComp传递 |
|
||||
| game_data.diamond | 钻石奖励 | 从MissionComp传递 |
|
||||
|
||||
### 界面初始化流程
|
||||
|
||||
```mermaid
|
||||
flowchart TD
|
||||
Load[VictoryComp加载] --> ReceiveArgs[接收参数]
|
||||
ReceiveArgs --> CheckGameData{检查game_data}
|
||||
CheckGameData --> |存在| AssignData[分配游戏数据]
|
||||
CheckGameData --> |不存在| UseDefault[使用默认数据]
|
||||
AssignData --> ShowTitle[显示胜利标题]
|
||||
UseDefault --> ShowTitle
|
||||
ShowTitle --> HideButton[隐藏下一步按钮]
|
||||
HideButton --> DelayShow[延迟0.2秒显示按钮]
|
||||
DelayShow --> Ready[界面准备就绪]
|
||||
```
|
||||
|
||||
**图表来源**
|
||||
- [VictoryComp.ts](file://assets/script/game/map/VictoryComp.ts#L28-L42)
|
||||
|
||||
**章节来源**
|
||||
- [VictoryComp.ts](file://assets/script/game/map/VictoryComp.ts#L15-L75)
|
||||
|
||||
## 数据绑定与状态管理
|
||||
|
||||
### MVVM数据流
|
||||
|
||||
系统采用MVVM架构实现数据绑定：
|
||||
|
||||
```mermaid
|
||||
graph TB
|
||||
subgraph "数据层"
|
||||
VMData[vmdata对象]
|
||||
GameData[game_data]
|
||||
Rewards[rewards数组]
|
||||
end
|
||||
subgraph "视图层"
|
||||
VictoryUI[胜利界面UI]
|
||||
HeroStats[英雄统计]
|
||||
RewardDisplay[奖励展示]
|
||||
end
|
||||
subgraph "控制层"
|
||||
VictoryComp[VictoryComp组件]
|
||||
SingletonModule[SingletonModuleComp]
|
||||
end
|
||||
VMData --> VictoryComp
|
||||
GameData --> VictoryComp
|
||||
Rewards --> VictoryComp
|
||||
VictoryComp --> VictoryUI
|
||||
VictoryComp --> HeroStats
|
||||
VictoryComp --> RewardDisplay
|
||||
SingletonModule --> VMData
|
||||
```
|
||||
|
||||
**图表来源**
|
||||
- [VictoryComp.ts](file://assets/script/game/map/VictoryComp.ts#L18-L25)
|
||||
- [SingletonModuleComp.ts](file://assets/script/game/common/SingletonModuleComp.ts#L45-L65)
|
||||
|
||||
### 状态同步机制
|
||||
|
||||
SingletonModuleComp作为全局状态管理中心，维护以下关键状态：
|
||||
|
||||
| 状态字段 | 类型 | 描述 | 更新时机 |
|
||||
|---------|------|------|---------|
|
||||
| mission.status | number | 游戏状态(0:未开始, 1:进行中, 2:胜利, 3:失败) | 战斗开始/结束时 |
|
||||
| mission.play | boolean | 游戏是否在播放 | 战斗开始/结束时 |
|
||||
| mission.pause | boolean | 游戏是否暂停 | 暂停/恢复时 |
|
||||
| vmdata.mission_data.mon_num | number | 怪物数量 | 怪物生成/死亡时 |
|
||||
| vmdata.mission_data.hero_num | number | 英雄数量 | 英雄生成/死亡时 |
|
||||
| vmdata.mission_data.fight_time | number | 战斗时间 | 每帧更新 |
|
||||
|
||||
**章节来源**
|
||||
- [SingletonModuleComp.ts](file://assets/script/game/common/SingletonModuleComp.ts#L25-L45)
|
||||
- [MissionComp.ts](file://assets/script/game/map/MissionComp.ts#L130-L140)
|
||||
|
||||
## 界面过渡动画
|
||||
|
||||
### 打开动画流程
|
||||
|
||||
```mermaid
|
||||
sequenceDiagram
|
||||
participant GUI as GUI系统
|
||||
participant VictoryComp as VictoryComp
|
||||
participant UI as UI节点
|
||||
participant Player as 玩家
|
||||
GUI->>VictoryComp : open(UIID.Victory)
|
||||
VictoryComp->>VictoryComp : onAdded(args)
|
||||
VictoryComp->>UI : 设置初始状态
|
||||
UI->>Player : 隐藏胜利标题
|
||||
UI->>Player : 隐藏下一步按钮
|
||||
VictoryComp->>VictoryComp : scheduleOnce(0.2秒)
|
||||
VictoryComp->>UI : 显示下一步按钮
|
||||
UI->>Player : 平滑显示界面
|
||||
Note over Player : 界面完全加载并显示
|
||||
```
|
||||
|
||||
**图表来源**
|
||||
- [VictoryComp.ts](file://assets/script/game/map/VictoryComp.ts#L28-L42)
|
||||
|
||||
### 关闭动画流程
|
||||
|
||||
界面关闭时的清理流程：
|
||||
1. 调用victory_end()方法
|
||||
2. 清理游戏数据
|
||||
3. 分发MissionEnd事件
|
||||
4. 通过GUI系统移除界面节点
|
||||
|
||||
**章节来源**
|
||||
- [VictoryComp.ts](file://assets/script/game/map/VictoryComp.ts#L44-L50)
|
||||
|
||||
## 用户交互反馈
|
||||
|
||||
### 按钮交互机制
|
||||
|
||||
胜利界面提供多种用户交互选项：
|
||||
|
||||
| 按钮功能 | 触发事件 | 动作描述 |
|
||||
|---------|---------|---------|
|
||||
| next按钮 | 点击 | 调用victory_end() |
|
||||
| restart按钮 | 点击 | 调用restart() |
|
||||
| double_reward按钮 | 点击 | 调用double_reward() |
|
||||
| watch_ad按钮 | 点击 | 调用watch_ad() |
|
||||
|
||||
### 交互状态管理
|
||||
|
||||
```mermaid
|
||||
stateDiagram-v2
|
||||
[*] --> Loading : 界面加载
|
||||
Loading --> Ready : 0.2秒后激活按钮
|
||||
Ready --> Restart : 点击重启
|
||||
Ready --> Next : 点击下一步
|
||||
Ready --> Double : 点击双倍奖励
|
||||
Ready --> Ad : 点击观看广告
|
||||
Restart --> [*] : 重新开始
|
||||
Next --> [*] : 结束战斗
|
||||
Double --> [*] : 双倍奖励
|
||||
Ad --> [*] : 广告奖励
|
||||
```
|
||||
|
||||
**图表来源**
|
||||
- [VictoryComp.ts](file://assets/script/game/map/VictoryComp.ts#L44-L65)
|
||||
|
||||
**章节来源**
|
||||
- [VictoryComp.ts](file://assets/script/game/map/VictoryComp.ts#L44-L75)
|
||||
|
||||
## 系统集成流程
|
||||
|
||||
### 完整奖励流程
|
||||
|
||||
```mermaid
|
||||
flowchart TD
|
||||
Start([战斗开始]) --> FightLoop[战斗循环]
|
||||
FightLoop --> CheckConditions{检查胜利条件}
|
||||
CheckConditions --> |英雄存活| ContinueFight[继续战斗]
|
||||
CheckConditions --> |英雄死亡| TriggerFightEnd[触发FightEnd]
|
||||
TriggerFightEnd --> UpdateState[更新游戏状态]
|
||||
UpdateState --> OpenVictory[打开胜利界面]
|
||||
OpenVictory --> BindData[绑定奖励数据]
|
||||
BindData --> ShowRewards[展示奖励选项]
|
||||
ShowRewards --> WaitInput[等待用户输入]
|
||||
WaitInput --> ProcessChoice{用户选择}
|
||||
ProcessChoice --> |继续| NextLevel[下一关卡]
|
||||
ProcessChoice --> |重新开始| Restart[重新开始]
|
||||
ProcessChoice --> |双倍奖励| DoubleReward[双倍奖励]
|
||||
ProcessChoice --> |观看广告| WatchAd[观看广告]
|
||||
NextLevel --> Start
|
||||
Restart --> Start
|
||||
DoubleReward --> Start
|
||||
WatchAd --> Start
|
||||
```
|
||||
|
||||
**图表来源**
|
||||
- [MissionComp.ts](file://assets/script/game/map/MissionComp.ts#L55-L65)
|
||||
- [VictoryComp.ts](file://assets/script/game/map/VictoryComp.ts#L44-L75)
|
||||
|
||||
### 错误处理机制
|
||||
|
||||
系统包含完善的错误处理机制：
|
||||
- **网络错误**：通过GUI系统显示错误提示
|
||||
- **数据同步错误**：自动回滚操作并提示用户
|
||||
- **界面加载错误**：提供重试机制
|
||||
- **事件监听错误**：记录日志并尝试恢复
|
||||
|
||||
**章节来源**
|
||||
- [MissionComp.ts](file://assets/script/game/map/MissionComp.ts#L1-L151)
|
||||
- [VictoryComp.ts](file://assets/script/game/map/VictoryComp.ts#L1-L75)
|
||||
|
||||
## 故障排除指南
|
||||
|
||||
### 常见问题及解决方案
|
||||
|
||||
| 问题描述 | 可能原因 | 解决方案 |
|
||||
|---------|---------|---------|
|
||||
| 胜利界面无法打开 | UIID配置错误 | 检查GameUIConfig.ts中的UIID.Victory配置 |
|
||||
| 奖励数据不显示 | 数据绑定失败 | 验证SingletonModuleComp中的vmdata结构 |
|
||||
| 事件监听失效 | 组件未正确注册 | 检查@ecs.register装饰器的使用 |
|
||||
| 界面动画异常 | 节点状态错误 | 确保节点的active状态正确管理 |
|
||||
| 数据同步失败 | 网络连接问题 | 实现重试机制并提供用户提示 |
|
||||
|
||||
### 性能优化建议
|
||||
|
||||
1. **事件监听优化**：及时移除不需要的事件监听器
|
||||
2. **内存管理**：确保组件正确销毁避免内存泄漏
|
||||
3. **数据缓存**：合理使用SingletonModuleComp进行数据缓存
|
||||
4. **异步加载**：使用async/await模式处理异步操作
|
||||
|
||||
### 调试技巧
|
||||
|
||||
- 使用console.log记录关键事件的触发
|
||||
- 监控SingletonModuleComp的状态变化
|
||||
- 检查GUI系统的open和remove调用
|
||||
- 验证数据绑定的路径正确性
|
||||
|
||||
**章节来源**
|
||||
- [MissionComp.ts](file://assets/script/game/map/MissionComp.ts#L140-L151)
|
||||
- [SingletonModuleComp.ts](file://assets/script/game/common/SingletonModuleComp.ts#L100-L150)
|
||||
Reference in New Issue
Block a user