feat: add world chat UI

This commit is contained in:
ud18010
2026-07-28 11:54:07 +08:00
parent 09c89aadf0
commit 48aed26725
28 changed files with 5308 additions and 99 deletions
@@ -0,0 +1,168 @@
# UI 生成提示词(AI JSON 生成契约)
> 可直接作为系统提示词投喂给 AI。完整流程、排错和维护说明见 `Client/Assets/Doc/Rule/UIGenerationRules.md`。
你是本项目的 Unity UI 原型生成器。你的**唯一产物是一份 JSON**,写入 `Doc/UIPrefabCreater/{界面名}.json`,由 Unity 编辑器自动转换为 UGUI Prefab。不要输出 HTML、C#、Lua、Markdown 说明或浏览器 CSS。JSON 必须符合 `JsonUIPrefabBuilder` 当前支持的字段和组件能力。
## 1. 强制上下文
生成前必须遵守以下项目文档:
- `Client/Assets/Doc/Rule/UnityProject.md`Unity 工程目录、JSON→Prefab 管线、UI 挂载、资源加载和小游戏规则。
- `Doc/design/UI_Design_Principles.md`:休闲卡通糖果风、配色、字体、控件视觉规范。
- `Doc/design/UI_Pic_Set.md`:通用 UI 切图、Sprite 名、九宫格 Border 与用途。
- `Doc/UIPrefabCreater/UI_LobbyJoystick.json``Doc/UIPrefabCreater/UI_MiniGameResult.json`JSON 写法参考。
## 2. 唯一产物
只输出一个 JSON 根对象,必须包含:
- `schemaVersion`:当前使用 `1`
- `prefabName`Prefab 名,必须与根节点 `name` 完全一致。
- `prefabPath`:必须位于 Unity `Assets/` 下。通用 UI 使用 `Assets/Game/Art/UI/Prefab/{prefabName}.prefab`;小游戏专属 UI 使用对应小游戏目录,不要写入通用 `Game` 目录。
- `description`:说明界面用途、挂载层级、运行时绑定方式和特殊适配原因。
- `canvas.canvasScaler.referenceResolution`:必须为 `[2048, 1024]`
- `assets.sprites`:本 JSON 中所有 Image/Button 使用的 Sprite 短名到资源路径的映射。
- `nodes`:所有需要生成 Unity GameObject 的节点。
- `bindings`:业务代码需要按名访问的节点名数组,可为空数组。
- `events`:点击等事件声明数组,可为空数组。
## 3. JSON 骨架
```json
{
"schemaVersion": 1,
"prefabName": "UI_Example",
"prefabPath": "Assets/Game/Art/UI/Prefab/UI_Example.prefab",
"description": "Normal 层普通功能界面。运行时控制器按 bindings/events 绑定节点。",
"canvas": {
"canvasScaler": {
"referenceResolution": [2048, 1024],
"matchWidthOrHeight": 0.5
}
},
"assets": {
"sprites": {
"ui_panel_main": "Assets/Game/Art/UI/Texture/Common/ui_panel_main.png",
"btn_primary_normal": "Assets/Game/Art/UI/Texture/Common/btn_primary_normal.png",
"btn_primary_hover": "Assets/Game/Art/UI/Texture/Common/btn_primary_hover.png",
"btn_primary_pressed": "Assets/Game/Art/UI/Texture/Common/btn_primary_pressed.png",
"btn_primary_disabled": "Assets/Game/Art/UI/Texture/Common/btn_primary_disabled.png"
}
},
"nodes": [],
"bindings": [],
"events": []
}
```
## 4. 节点规则
每个节点必须声明:
- `name`Unity GameObject 名,使用英文,推荐 `UI_``Panel``Img_``Txt_``Btn_``Content``Item_` 等清晰前缀。
- `parent`:父节点名;根节点为 `null`。父节点必须在 `nodes` 数组中先于子节点出现。
- `active`:是否默认激活。
- `rect`RectTransform 参数。
- `components`:组件数组,可为空数组。
`rect` 优先使用:
- 常规固定位置:`anchorMin``anchorMax``pivot``anchoredPosition``sizeDelta`
- 全屏或拉伸区域:`anchorMin``anchorMax``offsetMin``offsetMax`
同一父节点下,`nodes` 数组越靠后的节点显示在越上层。
## 5. 当前转换器支持的组件
`Client/Assets/Script/Editor/JsonUIPrefabBuilder.cs` 当前代码为准,可直接生成的组件包括:
- `Canvas`
- `CanvasScaler`
- `GraphicRaycaster`
- `CanvasGroup`
- `Image`
- `TextMeshProUGUI`
- `Button`
- `Shadow`
- `Outline`
- `ScrollRect`
- `RectMask2D`
- `Mask`
- `TMP_InputField`
- `VerticalLayoutGroup`
- `ContentSizeFitter`
- `LayoutElement`
- `MonoBehaviour`
以下组件在项目规则中允许声明,但当前转换器尚未完整实现或会跳过,生成时不要依赖它们直接可用:
- `Toggle`
- `TMP_Dropdown`
- `Slider`
- `Scrollbar`
- `ScrollView`
如果需求必须使用这些控件,可以先用 `Image``TextMeshProUGUI``Button``ScrollRect` 等生成可视骨架,并在 `description` 说明需要人工或后续转换器补齐。
## 6. 视觉与素材规则
- 风格必须符合休闲、友好、明快的卡通糖果风:大圆角、深色描边、顶部高光、柔和阴影、高饱和按钮。
- 优先复用 `Assets/Game/Art/UI/Texture/Common` 中的通用切图,Sprite 名参考 `Doc/design/UI_Pic_Set.md`
- 所有可拉伸容器、按钮、输入底、列表项、进度底等必须使用 `"imageType": "Sliced"`
- 普通图标、关闭按钮、返回按钮等使用 `"imageType": "Simple"`
- 文字统一使用 `TextMeshProUGUI`,字体遵循项目默认思源黑体。
- 浅色文字在按钮、复杂背景、深色或高饱和背景上必须使用 `Outline``Shadow`,颜色优先 `#102033``#0B1724`,不要默认纯黑。
- 间距使用 8 的倍数,内容区留白通常不小于 24,安全区不小于 24。
- 按钮优先使用 `Image + Button``Button.transition` 使用 `SpriteSwap`,并提供 normal/hover/pressed/disabled 状态图。
- 需要新贴图时,先在 `description` 标明缺图;实际贴图用 gptimage2 按项目风格生成到对应目录。小游戏专属贴图必须生成到小游戏自己的资源目录结构。
## 7. 事件与绑定
- 业务代码需要访问的节点必须加入 `bindings`,例如 `["Txt_Title", "Btn_Start"]`
- 可点击按钮组件中声明 `onClick` 字符串,并在根对象 `events` 中登记:
```json
"events": [
{ "name": "Example.Start", "node": "Btn_Start" }
]
```
`onClick` 只是事件标记,不会在 Prefab 中写死 Unity 回调。运行时 C# 控制器按事件名和节点名绑定。
需要挂载脚本时,在根节点或业务节点上声明:
```json
{
"type": "MonoBehaviour",
"typeName": "XGame.ExampleController"
}
```
## 8. 层级与挂载意图
`description` 中明确界面所属层级:
- `HUD`:常驻战斗/大厅信息,如血条、摇杆、小地图。
- `Normal`:普通功能面板,如背包、设置、商城。
- `Dialog`:模态弹窗、二次确认。
- `Tips`Toast、飘字、轻提示。
Prefab 生成后运行时必须挂到 `UIRoot` 下对应层级,不要直接挂到 `UIRoot`
## 9. 输出前自检
输出 JSON 前逐条检查:
- [ ] 只输出 JSON,不输出解释文本。
- [ ] `prefabName` 与唯一根节点 `name` 一致。
- [ ] 只有一个 `parent: null` 的根节点。
- [ ] `prefabPath``Assets/` 下,且目录符合通用/小游戏资源规则。
- [ ] `referenceResolution``[2048, 1024]`
- [ ] 每个节点有 `name``parent``active``rect``components`
- [ ] 父节点先于子节点出现,所有父节点名真实存在。
- [ ] 所有 `Image``Button` 使用的 Sprite 都已登记到 `assets.sprites`
- [ ] 九宫格控件声明 `"imageType": "Sliced"`
- [ ] 文字使用 `TextMeshProUGUI`,关键浅色字有轻描边或阴影。
- [ ] 事件节点存在于 `nodes`,绑定节点存在于 `nodes`
- [ ] 不依赖当前转换器未实现的组件完成核心功能。
@@ -0,0 +1,7 @@
fileFormatVersion: 2
guid: 7aa6827799244d9ba13792d52a13f7e9
TextScriptImporter:
externalObjects: {}
userData:
assetBundleName:
assetBundleVariant:
+297
View File
@@ -0,0 +1,297 @@
# UI 生成规则(AI JSON 生成流程 + 人类参考)
> 本文档面向“AI 根据需求生成 JSON → Unity 自动转换为 Prefab → C# 接管业务”的本项目 UI 自动生成流程。
>
> - **Part A**:整体流水线。
> - **Part B**AI 生成契约。
> - **Part C**:生成后接管与排错。
> - **Part D**:后续扩展建议。
>
> 可直接投喂 AI 的精简系统提示词见 `Client/Assets/Doc/Rule/UIGenerationPrompt.md`。
---
## Part A - 整体流水线
本项目采用 JSON-first 流程,不引入参考项目的 HTML 中间层:
```text
需求说明
-> AI 读取项目规则/设计规范/切图清单/现有 JSON 示例
-> 生成 Doc/UIPrefabCreater/{UIName}.json
-> Unity 重新获得焦点或手动菜单触发
-> JsonUIPrefabBuilder 生成 Assets/.../{UIName}.prefab
-> C# MonoBehaviour/业务代码按节点名、bindings、events 接管
```
### A1. 为什么不使用 HTML
参考项目的核心经验是“AI 产物契约 + 自动转换触发 + 自检清单”,不是 HTML 格式本身。本项目已经有 `Doc/UIPrefabCreater/*.json` 到 Prefab 的转换器,直接让 AI 输出 JSON 能减少一层转换误差,并且更贴近 Unity 的 RectTransform、组件、SpriteSwap 和 bindings/events。
### A2. 自动转换入口
转换器相关代码:
- `Client/Assets/Script/Editor/JsonUIPrefabBuilder.cs`
- `Client/Assets/Script/Editor/XWorldUtil.cs`
可用入口:
- Unity 菜单 `Tools/UI/Generate Prefab From JSON...`
- Unity 菜单 `Tools/UI/Generate All Prefabs From JSON`
- Unity 菜单 `XWorld/UI/Convert Changed JSON Prefabs Now`
- Unity 菜单 `XWorld/UI/Auto Convert JSON On Focus`
自动转换开启后,Unity 重新获得焦点时会扫描 `Doc/UIPrefabCreater`,只转换比目标 Prefab 更新的 UI JSON。
### A3. 目录约定
JSON 输入:
- `Doc/UIPrefabCreater/{UIName}.json`
通用 UI 产物:
- `Assets/Game/Art/UI/Prefab/{UIName}.prefab`
- `Assets/Game/Art/UI/Texture/Common/{sprite}.png`
- `Assets/Game/Art/UI/Font/SourceHanSansCN-Regular.otf`
小游戏专属 UI 产物:
-`UnityProject.md` 规则,将通用资源目录中的 `Game` 替换为小游戏名。
- 小游戏专属贴图不要生成到通用 `Assets/Game/...` 目录。
---
## Part B - AI 生成契约
### B1. 输入信息模板
给 AI 生成 UI 时,建议提供以下信息:
```text
界面名:
所属层级:HUD / Normal / Dialog / Tips
使用场景:
目标用户操作:
需要显示的数据:
需要点击/拖拽/输入的控件:
业务绑定节点:
事件名:
是否小游戏专属:
是否需要新贴图:
特殊适配要求:
```
### B2. 必读上下文
AI 生成前必须参考:
- `Client/Assets/Doc/Rule/UnityProject.md`
- `Doc/design/UI_Design_Principles.md`
- `Doc/design/UI_Pic_Set.md`
- `Doc/UIPrefabCreater/UI_LobbyJoystick.json`
- `Doc/UIPrefabCreater/UI_MiniGameResult.json`
- `Client/Assets/Script/Editor/JsonUIPrefabBuilder.cs` 的当前支持能力
### B3. JSON 顶层字段
| 字段 | 要求 |
| --- | --- |
| `schemaVersion` | 当前为 `1` |
| `prefabName` | 与根节点 `name` 完全一致 |
| `prefabPath` | 必须位于 `Assets/` 下 |
| `description` | 描述用途、层级、运行时绑定、特殊适配 |
| `canvas` | 必须包含 `canvasScaler.referenceResolution: [2048,1024]` |
| `assets` | 统一登记 Sprite 短名和路径 |
| `nodes` | 每个 Unity 节点一条记录 |
| `bindings` | C# 需要按名访问的节点 |
| `events` | 事件名与触发节点 |
### B4. 节点命名
节点名必须英文,便于 C# `transform.Find` 或递归查找:
| 类型 | 推荐命名 |
| --- | --- |
| 根节点 | `UI_Xxx` |
| 面板 | `Panel` / `Panel_Main` / `Panel_Content` |
| 图片 | `Img_Mask` / `Img_Bg` / `Img_Icon` |
| 文本 | `Txt_Title` / `Txt_Count` / `Txt_Desc` |
| 按钮 | `Btn_Start` / `Btn_Close` / `Btn_Ok` |
| 列表 | `Scroll_List` / `Viewport` / `Content` / `Item_Template` |
| 业务区域 | `Group_Top` / `Group_Info` / `Group_Actions` |
### B5. 当前可直接生成的组件
`JsonUIPrefabBuilder` 当前可直接创建:
- `Canvas`
- `CanvasScaler`
- `GraphicRaycaster`
- `CanvasGroup`
- `Image`
- `TextMeshProUGUI`
- `Button`
- `Shadow`
- `Outline`
- `ScrollRect`
- `RectMask2D`
- `Mask`
- `TMP_InputField`
- `VerticalLayoutGroup`
- `ContentSizeFitter`
- `LayoutElement`
- `MonoBehaviour`
项目规则文档中出现但当前转换器尚未完整实现的组件,要谨慎使用:
- `Toggle`
- `TMP_Dropdown`
- `Slider`
- `Scrollbar`
- `ScrollView`
其中 `Toggle` 当前会被识别为已知但未实现组件并跳过;`TMP_InputField` 已支持生成与绑定;`ScrollView` 应改用当前代码支持的 `ScrollRect` 结构。
### B6. 常用结构模板
#### 普通面板
- 根节点:可按需要挂 `Canvas``CanvasScaler``GraphicRaycaster`,或作为由外部 Canvas 承载的子树。
- 背景遮罩:Dialog 层使用 `Img_Mask`,全屏拉伸,Sprite `ui_overlay_dim`
- 主面板:`Panel` 使用 `ui_panel_main``ui_panel_popup``imageType: Sliced`
- 标题:`Txt_Title`,字号 36-52,根据界面层级调整。
- 内容区:`ui_panel_content`,留白不小于 24。
- 操作区:按钮组放在底部,主行为用绿色 `btn_primary_*`
#### 按钮
按钮节点通常同时包含 `Image``Button`
```json
{
"type": "Image",
"sprite": "btn_primary_normal",
"imageType": "Sliced",
"raycastTarget": true,
"color": "#FFFFFFFF"
},
{
"type": "Button",
"transition": "SpriteSwap",
"spriteHighlighted": "btn_primary_hover",
"spritePressed": "btn_primary_pressed",
"spriteDisabled": "btn_primary_disabled",
"onClick": "Example.Confirm"
}
```
按钮文字作为按钮子节点,使用 `TextMeshProUGUI`。浅色按钮文字必须加轻量 `Outline``Shadow`
#### 滚动列表
当前使用 `ScrollRect`,推荐结构:
```text
Scroll_List (Image + ScrollRect)
Viewport (Image + RectMask2D)
Content (VerticalLayoutGroup + ContentSizeFitter)
Item_Template (Image + LayoutElement, active=false)
```
`ScrollRect` 组件通过 `viewport``content` 字段引用节点名。
#### HUD
HUD 节点应尽量少用模态遮罩。角落信息使用对应角的锚点;摇杆、血条、状态条等优先使用拉伸或角锚,避免写死只适配一个屏幕比例。
---
## Part C - 生成后接管与排错
### C1. 生成后接管步骤
1. 打开 Unity,确认 JSON 自动转换是否开启,或手动执行 `XWorld/UI/Convert Changed JSON Prefabs Now`
2. 检查 Console 中 `[UIGen]` 日志,确认没有错误,警告均可解释。
3. 打开生成 Prefab,核对层级、RectTransform、Sprite、文字、按钮状态。
4. 根节点或业务节点按需挂 `MonoBehaviour` 控制器,或让 JSON 中的 `MonoBehaviour.typeName` 自动添加。
5. C# 通过 `transform.Find`、递归查找或 `Utility.FindTransform` 获取 `TextMeshProUGUI``Button``Image``RectTransform` 等组件。
6.`bindings``events` 绑定数据刷新与点击回调。
7. 运行时资源加载必须使用异步接口,不要新写同步资源加载。
### C2. 常见问题
| 现象 | 原因 | 处理 |
| --- | --- | --- |
| JSON 不转换 | 自动转换关闭、Unity 未重新获得焦点、JSON 不比 Prefab 新 | 手动执行 `Convert Changed JSON Prefabs Now` |
| `referenceResolution 必须为 [2048, 1024]` | 画布分辨率错误 | 改为 `[2048,1024]`,特殊情况写入 `description` 并同步调整转换器规则 |
| `根节点数量必须为 1` | 多个 `parent:null` | 只保留一个根节点 |
| `prefabName 必须与根节点名一致` | 顶层命名不一致 | 统一 `prefabName` 与根节点 `name` |
| `找不到 Sprite` | `assets.sprites` 短名或路径与真实切图不一致 | 按 `UI_Pic_Set.md` 校正 Sprite 名,确认图片导入为 Sprite |
| 图片存在但非 Sprite | Texture Import 设置错误 | 设置 `Texture Type = Sprite (2D and UI)` |
| Toggle 没生成 | 当前转换器未实现 | 用可视骨架替代,或补转换器 |
| TMP_InputField 文本不显示 | `textComponent` / `placeholderComponent` 指向的节点缺少 `TextMeshProUGUI` 或不在输入框下 | 修正节点名,或省略节点名让转换器自动创建 `Text Area/Text/Placeholder` |
| ScrollView 警告未知 | 当前组件名应为 `ScrollRect` | 改为 `ScrollRect`,并声明 `viewport``content` |
| 文字不可读 | 缺描边/阴影或背景对比不足 | 加 `Outline`/`Shadow`,使用 `#102033``#0B1724` |
### C3. 提交前自检
- [ ] JSON 位于 `Doc/UIPrefabCreater`
- [ ] 顶层字段完整。
- [ ] `prefabName` 与根节点名一致。
- [ ] 只有一个根节点。
- [ ] 节点名英文且不重复。
- [ ] 父节点先于子节点出现。
- [ ] `referenceResolution``[2048,1024]`
- [ ] 所有 Sprite 已登记且路径符合通用/小游戏目录规则。
- [ ] 九宫格图片使用 `Sliced`
- [ ] 文字统一 TMP,关键浅色字有轻描边或阴影。
- [ ] 按钮有 normal/hover/pressed/disabled 状态。
- [ ] `bindings``events` 中的节点真实存在。
- [ ] 不依赖未实现组件完成核心功能。
- [ ] 生成的 Prefab 在 Unity 中打开无明显重叠、越界或丢图。
---
## Part D - 后续扩展建议
### D1. 补齐转换器组件
建议优先补齐以下组件,顺序按 UI 高频程度排列:
1. `Toggle`
2. `Slider`
3. `Scrollbar`
4. `TMP_Dropdown`
每补一个组件,都应同步更新:
- `Client/Assets/Script/Editor/JsonUIPrefabBuilder.cs`
- `Client/Assets/Doc/Rule/UIGenerationPrompt.md`
- `Client/Assets/Doc/Rule/UIGenerationRules.md`
- 对应 EditMode 测试或最小 JSON 样例
### D2. 公共控件识别
参考项目的公共控件自动识别可以作为本项目下一阶段能力,但需要先定义稳定的本项目 canonical Sprite 名和空间约束。可优先考虑:
| 目标 | 识别依据 | 生成结果 |
| --- | --- | --- |
| 通用关闭按钮 | `btn_close` | 替换或规范化为关闭按钮 Prefab |
| 通用返回按钮 | `btn_back` | 替换或规范化为返回按钮 Prefab |
| 标准弹窗 | `ui_overlay_dim` + `ui_panel_popup` + `btn_close` | 标准 Dialog Prefab |
| 资源条 | `ico_coin` / `ico_diamond` + 数值 + `ico_plus` | 标准 Currency 组件 |
| Toast | `toast_bg` + 文本 | 标准 Tips 组件 |
识别器必须保守:缺件、歧义、跨区域时保留原节点并输出 Warning,不要误合并。
### D3. AI 生成质量评审
AI 产出的 UI JSON 应优先检查三件事:
1. **工程可转换**:字段、父子关系、组件名、Sprite 名都能被当前工具处理。
2. **视觉一致**:符合糖果风、配色语义、九宫格、TMP 和可读性规则。
3. **业务可接管**:节点命名稳定,bindings/events 完整,C# 能按名找到控件。
只要这三件事成立,生成的 Prefab 就可以作为程序接管的稳定 UI 骨架。
@@ -0,0 +1,7 @@
fileFormatVersion: 2
guid: b2cd5daa93154de08df4414baf54b7f5
TextScriptImporter:
externalObjects: {}
userData:
assetBundleName:
assetBundleVariant:
+7 -1
View File
@@ -1,5 +1,11 @@
# Unity 项目规则
## Unity 编辑器环境
- Unity 版本:`2022.3.62f3`(见 `Client/ProjectSettings/ProjectVersion.txt`)。
- 本机 Unity Editor 目录:`D:\Program Files\Unity 2022.3.62f3\Editor`
- Unity 可执行文件:`D:\Program Files\Unity 2022.3.62f3\Editor\Unity.exe`
## 美术资源目录
通用资源目录:
- Shader 目录:`Client\Assets\Game\shader`
@@ -68,7 +74,7 @@ UI 预设统一挂在 `UIRoot` 节点下对应的子节点,按界面类型分
- 标题、按钮文字、状态提示、倒计时等关键 UI 文本可使用轻描边或阴影;普通正文、列表、输入框文本不默认加描边,优先通过背景对比度保证可读性。
- TextMeshProUGUI 描边建议保持轻量,常规 UI 使用较小 Outline Width,避免粗黑边导致界面变脏。
- 按钮节点使用 `Button` 组件,`transition` 优先使用 `SpriteSwap`;需要点击事件时在组件中声明 `onClick`,并在根对象 `events` 中登记事件名和节点名。
- 输入框节点使用 `TMP_InputField`,必须声明 `placeholder``characterLimit``contentType`;密码输入使用 `"contentType": "Password"`
- 输入框节点使用 `TMP_InputField`,必须声明 `placeholder``characterLimit``contentType`可声明 `textComponent``placeholderComponent` 绑定已有 `TextMeshProUGUI` 节点,不声明时转换器自动创建 `Text Area/Text/Placeholder` 标准结构;密码输入使用 `"contentType": "Password"`
- Toggle 节点必须声明 `toggleGroup``isOn`,并分别用子节点声明背景和选中标记。
- 需要业务绑定的控件必须加入根对象 `bindings`,例如 `login.username``register.password`;事件统一加入根对象 `events`,例如 `{ "name": "Auth.Login", "node": "Btn_Login" }`
- 需要挂载运行时脚本时使用 `MonoBehaviour` 组件,并声明 `typeName`,例如 `"typeName": "XGame.MatchWaitingController"`