From 411c34d664775deecb401dff2ef632a56f06bc4c Mon Sep 17 00:00:00 2001
From: Shiliang <shiliang@jinmt.com>
Date: Wed, 27 May 2026 15:52:23 +0800
Subject: [PATCH] =?UTF-8?q?docs(UI):=20=E6=9B=B4=E6=96=B0UI=E7=95=8C?=
 =?UTF-8?q?=E9=9D=A2=E6=8B=BC=E6=8E=A5=E8=AE=BE=E8=AE=A1=E6=8C=87=E5=8D=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

添加双向转换功能说明：
- 正向转换：JSON配置 → UI预制体
- 反向转换：UI预制体 → JSON配置

新增支持的组件类型：
- InputField、ScrollRect、GridLayoutGroup、VerticalLayoutGroup、HorizontalLayoutGroup

新增命令支持：
- ExportPrefabToJson：从预制体反向导出JSON

更新使用示例：
- 外部命令触发方式
- Unity编辑器菜单入口
- 代码调用示例
---
 03_核心功能/UI/UI界面拼接设计指南.md | 47 ++++++++++++++++++++++------
 1 file changed, 38 insertions(+), 9 deletions(-)

diff --git a/03_核心功能/UI/UI界面拼接设计指南.md b/03_核心功能/UI/UI界面拼接设计指南.md
index d03e295..dfd75c2 100644
--- a/03_核心功能/UI/UI界面拼接设计指南.md
+++ b/03_核心功能/UI/UI界面拼接设计指南.md
@@ -167,13 +167,18 @@ Window
 
 ### 8.1 概述
 
-本项目支持通过JSON配置文件自动生成Unity UI预制体，实现UI界面的快速构建和迭代。
+本项目支持JSON配置与Unity预制体的双向转换：
+- **正向转换**：JSON配置 → UI预制体
+- **反向转换**：UI预制体 → JSON配置
+
+实现UI界面的快速构建、迭代和版本控制。
 
 ### 8.2 核心组件
 
 | 组件 | 职责 | 文件路径 |
 |-----|------|---------|
 | **UIPrefabGenerator** | 解析JSON并生成UI预制体 | `Assets/Editor/Command/UIPrefabGenerator.cs` |
+| **UIPrefabToJson** | 从预制体反向导出JSON | `Assets/Editor/Command/UIPrefabToJson.cs` |
 | **RemoteCommand** | 提供外部调用接口 | `Assets/Editor/Command/RemoteCommand.cs` |
 | **ExternalCommandListener** | 监听外部命令触发文件 | `Assets/Editor/Command/ExternalCommandListener.cs` |
 
@@ -214,11 +219,16 @@ Window
 
 | 类型 | 对应Unity组件 | 关键属性 |
 |-----|-------------|---------|
-| **Image** | Image | sprite, color, type (Simple/Sliced/Tiled/Filled) |
-| **Text** | TextMeshProUGUI | text, font, fontSize, color |
-| **Button** | Button | onClick, targetGraphic, transition |
-| **Slider** | Slider | minValue, maxValue, value, fillRect |
-| **Toggle** | Toggle | isOn, targetGraphic |
+| **Image** | Image | sprite, color, type, preserveAspect |
+| **TextMeshProUGUI** | TextMeshProUGUI | text, font, fontSize, color, alignment |
+| **Button** | Button | interactable, transition, navigationMode |
+| **Slider** | Slider | minValue, maxValue, value, wholeNumbers, direction |
+| **Toggle** | Toggle | isOn, toggleTransition, transition |
+| **InputField** | InputField | text, placeholder, characterLimit, contentType |
+| **ScrollRect** | ScrollRect | horizontal, vertical, movementType |
+| **GridLayoutGroup** | GridLayoutGroup | cellSize, spacing, constraint, padding |
+| **VerticalLayoutGroup** | VerticalLayoutGroup | spacing, childAlignment, padding |
+| **HorizontalLayoutGroup** | HorizontalLayoutGroup | spacing, childAlignment, padding |
 
 ### 8.5 外部命令触发机制
 
@@ -241,6 +251,7 @@ GenerateUIPrefab:Assets/Editor/UI/BagWindow.json
 | 命令 | 参数 | 说明 |
 |-----|------|------|
 | **GenerateUIPrefab** | `jsonPath` [, `prefabPath`] | 根据JSON生成UI预制体 |
+| **ExportPrefabToJson** | `prefabPath` [, `jsonPath`] | 从预制体反向导出JSON |
 | **ReadJson** | [参数列表] | 读取JSON配置（测试用） |
 
 #### 8.5.3 完整执行流程
@@ -282,32 +293,50 @@ GenerateUIPrefab:Assets/Editor/UI/BagWindow.json
 
 | 菜单路径 | 功能 |
 |---------|------|
+| `Tools > UI > Export Prefab to JSON` | 选择预制体导出JSON |
+| `Tools > UI > Generate BagWindow Prefab` | 生成BagWindow预制体 |
 | `Tools > External > Test ReadJson` | 测试ReadJson命令 |
-| `Tools > External > Test GenerateUIPrefab` | 测试GenerateUIPrefab命令 |
+| `Tools > External > Test GenerateUIPrefab` | 测试正向生成 |
+| `Tools > External > Test ExportPrefabToJson` | 测试反向导出 |
 
 ### 8.7 使用示例
 
 #### 方式一：外部命令触发
 
 ```bash
-# 创建触发文件
+# 正向：从JSON生成预制体
 echo "GenerateUIPrefab:Assets/Editor/UI/BagWindow.json" > "F:\JMNet\CrystalBattle_Client\Trigger_Command.txt"
+
+# 反向：从预制体导出JSON
+echo "ExportPrefabToJson:Assets/Game/GameHFResource/CN/UIWindows/BagWindow/BagWindow.prefab" > "F:\JMNet\CrystalBattle_Client\Trigger_Command.txt"
 ```
 
 #### 方式二：Unity编辑器菜单
 
+**正向生成**：
 1. 打开Unity编辑器
 2. 点击菜单 `Tools > External > Test GenerateUIPrefab`
 3. 查看Console窗口日志确认执行结果
 
+**反向导出**：
+1. 打开Unity编辑器
+2. 点击菜单 `Tools > UI > Export Prefab to JSON`
+3. 选择要导出的预制体文件
+
 #### 方式三：代码调用
 
 ```csharp
-// 直接调用生成方法
+// 正向：从JSON生成预制体
 UIPrefabGenerator.GeneratePrefabFromJson(
     "Assets/Editor/UI/BagWindow.json",
     "Assets/Game/GameHFResource/CN/UIWindows/BagWindow/BagWindow.prefab"
 );
+
+// 反向：从预制体导出JSON
+UIPrefabToJson.ExportPrefabToJson(
+    "Assets/Game/GameHFResource/CN/UIWindows/BagWindow/BagWindow.prefab",
+    "Assets/Editor/UI/BagWindow.json"
+);
 ```
 
 ### 8.8 注意事项