You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
74 lines
1.8 KiB
74 lines
1.8 KiB
|
1 month ago
|
# 游戏教程功能设计
|
||
|
|
|
||
|
|
## 概述
|
||
|
|
|
||
|
|
创建一个游戏教程/介绍界面,在玩家创建角色后自动弹出,展示游戏世界观、装备系统、丹药系统、境界等级等信息,采用分页展示,使用 TextType 组件逐字显示文字。
|
||
|
|
|
||
|
|
## 功能需求
|
||
|
|
|
||
|
|
1. **自动触发**:玩家创建角色成功后自动弹出教程
|
||
|
|
2. **手动触发**:游戏主界面有"游戏指南"按钮可再次查看
|
||
|
|
3. **全屏弹窗**:覆盖整个屏幕的模态窗口
|
||
|
|
4. **分页展示**:多个页面分别为世界观、装备、丹药、境界等
|
||
|
|
5. **退出方式**:底部"跳过"按钮关闭
|
||
|
|
|
||
|
|
## UI/UX 设计
|
||
|
|
|
||
|
|
### 布局
|
||
|
|
|
||
|
|
- 全屏覆盖弹窗(`position: fixed`)
|
||
|
|
- 顶部:页面标题 + 页码指示器(如 1/4)
|
||
|
|
- 中间:内容区域,支持滚动
|
||
|
|
- 底部:"跳过"按钮
|
||
|
|
|
||
|
|
### 分页结构
|
||
|
|
|
||
|
|
1. **第一页:世界观**
|
||
|
|
- 游戏背景介绍
|
||
|
|
- 修炼体系说明
|
||
|
|
|
||
|
|
2. **第二页:装备系统**
|
||
|
|
- 装备分类(武器、防具、饰品等)
|
||
|
|
- 装备品质说明
|
||
|
|
|
||
|
|
3. **第三页:丹药系统**
|
||
|
|
- 各类丹药介绍
|
||
|
|
- 丹药用途
|
||
|
|
|
||
|
|
4. **第四页:境界等级**
|
||
|
|
- 境界划分
|
||
|
|
- 修炼路线
|
||
|
|
|
||
|
|
### 交互
|
||
|
|
|
||
|
|
- 左右滑动或按钮切换页面
|
||
|
|
- TextType 组件逐字显示文字
|
||
|
|
- 最后一页显示"开始游戏"按钮
|
||
|
|
|
||
|
|
## 技术实现
|
||
|
|
|
||
|
|
### 文件结构
|
||
|
|
|
||
|
|
```
|
||
|
|
Build_God_Game/src/views/TutorialView.vue # 新建
|
||
|
|
Build_God_Game/src/router/index.ts # 修改
|
||
|
|
```
|
||
|
|
|
||
|
|
### 路由
|
||
|
|
|
||
|
|
- 路径:`/tutorial`
|
||
|
|
- 需要认证:`requiresAuth: true`
|
||
|
|
|
||
|
|
### 组件设计
|
||
|
|
|
||
|
|
- 使用 TextType 组件显示文字
|
||
|
|
- 使用分页组件管理多页内容
|
||
|
|
- 支持键盘/按钮导航
|
||
|
|
|
||
|
|
## 验收标准
|
||
|
|
|
||
|
|
1. 创建角色后自动跳转到教程页面
|
||
|
|
2. 教程使用 TextType 动画显示文字
|
||
|
|
3. 可通过分页按钮切换页面
|
||
|
|
4. 点击"跳过"或"开始游戏"进入游戏主界面
|
||
|
|
5. GameView 有"游戏指南"按钮可重新查看
|