151 lines
6.3 KiB
Plaintext
151 lines
6.3 KiB
Plaintext
# WulaLink UI 修复任务 - Codex 交接文档
|
||
|
||
## 项目概述
|
||
RimWorld Mod: [WulaFallenEmpire](file:///C:/Steam/steamapps/common/RimWorld/Mods/3516260226/Source/WulaFallenEmpire)
|
||
目标: 实现 MomoTalk 风格的悬浮 AI 聊天 UI (WulaLink)，同时确保原有大 UI 不被破坏。
|
||
|
||
## 关键文件路径
|
||
```
|
||
C:\Steam\steamapps\common\RimWorld\Mods\3516260226\Source\WulaFallenEmpire\
|
||
├── EventSystem\
|
||
│ ├── Dialog_CustomDisplay.cs # 基类，包含正确的按钮样式和布局逻辑
|
||
│ └── AI\
|
||
│ ├── AIIntelligenceCore.cs # AI 核心逻辑 (WorldComponent) - 已完成
|
||
│ ├── DebugActions_WulaLink.cs # Debug 入口
|
||
│ └── UI\
|
||
│ ├── Dialog_AIConversation.cs # 大 UI - 需要修复布局
|
||
│ ├── Overlay_WulaLink.cs # 小悬浮框 - 需要修复样式
|
||
│ ├── Overlay_WulaLink_Notification.cs # 通知弹窗 - 已完成
|
||
│ └── WulaLinkStyles.cs # 样式定义 - 需要调整颜色
|
||
```
|
||
|
||
---
|
||
|
||
## 问题 1: 大 UI (Dialog_AIConversation) 布局损坏
|
||
|
||
### 现状
|
||
[Dialog_AIConversation](file:///C:/Steam/steamapps/common/RimWorld/Mods/3516260226/Source/WulaFallenEmpire/EventSystem/AI/UI/Dialog_AIConversation.cs#108-133) 继承自 [Dialog_CustomDisplay](file:///C:/Steam/steamapps/common/RimWorld/Mods/3516260226/Source/WulaFallenEmpire/EventSystem/Dialog_CustomDisplay.cs#10-668)，但 [DoWindowContents](file:///C:/Steam/steamapps/common/RimWorld/Mods/3516260226/Source/WulaFallenEmpire/EventSystem/AI/UI/Dialog_AIConversation.cs#1177-1328) 被完全重写，丢失了原有的沉浸式布局。
|
||
|
||
### 期望效果 (参考用户截图)
|
||
- 左侧: 大尺寸立绘 (占据约 60% 窗口)
|
||
- 右下: 半透明暗红色面板，包含:
|
||
- 标题 "「军团」,P.I.A"
|
||
- 描述文本区域
|
||
- 底部按钮 "打开通讯频道" (使用 [DrawCustomButton](file:///C:/Steam/steamapps/common/RimWorld/Mods/3516260226/Source/WulaFallenEmpire/EventSystem/Dialog_CustomDisplay.cs#388-449) 样式)
|
||
- 点击按钮后进入聊天模式 (显示对话历史)
|
||
|
||
### 修复方案
|
||
恢复 `base.DoWindowContents(inRect)` 的调用，或手动复制 `Dialog_CustomDisplay.DoWindowContents` 的布局逻辑。
|
||
|
||
关键代码参考 ([Dialog_CustomDisplay.cs](file:///C:/Steam/steamapps/common/RimWorld/Mods/3516260226/Source/WulaFallenEmpire/EventSystem/Dialog_CustomDisplay.cs) 第 144-280 行):
|
||
```csharp
|
||
// 1. 绘制背景
|
||
if (background != null) GUI.DrawTexture(inRect, background, ScaleMode.StretchToFill);
|
||
|
||
// 2. 立绘 (Config.showPortrait)
|
||
Rect portraitRect = Config.GetScaledRect(Config.portraitSize, inRect);
|
||
|
||
// 3. 标题 (Config.showLabel)
|
||
Rect labelRect = Config.GetScaledRect(Config.labelSize, inRect);
|
||
|
||
// 4. 描述 (Config.showDescriptions)
|
||
Rect descriptionRect = Config.GetScaledRect(Config.descriptionsSize, inRect);
|
||
|
||
// 5. 选项按钮 (Config.showOptions)
|
||
Rect optionsRect = Config.GetScaledRect(Config.optionsListSize, inRect);
|
||
```
|
||
|
||
---
|
||
|
||
## 问题 2: 小悬浮框 (Overlay_WulaLink) 样式问题
|
||
|
||
### 2.1 背景颜色错误
|
||
**现状**: 使用纯黑背景 `new Color(10, 10, 12, 255)`
|
||
**期望**: 半透明暗红色，与大 UI 一致
|
||
|
||
修改 [WulaLinkStyles.cs](file:///C:/Steam/steamapps/common/RimWorld/Mods/3516260226/Source/WulaFallenEmpire/EventSystem/AI/UI/WulaLinkStyles.cs):
|
||
```csharp
|
||
// 修改前
|
||
public static readonly Color BackgroundColor = new Color32(10, 10, 12, 255);
|
||
|
||
// 修改后
|
||
public static readonly Color BackgroundColor = new Color(0.2f, 0.05f, 0.05f, 0.85f); // 半透明暗红
|
||
```
|
||
|
||
### 2.2 消息间距过大
|
||
**原因**: `role == "tool"` 的消息也被渲染，占用空间但不显示内容。
|
||
|
||
修改 [Overlay_WulaLink.cs](file:///C:/Steam/steamapps/common/RimWorld/Mods/3516260226/Source/WulaFallenEmpire/EventSystem/AI/UI/Overlay_WulaLink.cs) 的 [DrawMessageList](file:///C:/Steam/steamapps/common/RimWorld/Mods/3516260226/Source/WulaFallenEmpire/EventSystem/AI/UI/Overlay_WulaLink.cs#265-344) 方法:
|
||
```csharp
|
||
// 在 foreach 循环中添加过滤
|
||
foreach (var msg in history)
|
||
{
|
||
// 跳过工具调用消息
|
||
if (msg.role == "tool") continue;
|
||
|
||
// ... 其余渲染逻辑
|
||
}
|
||
```
|
||
|
||
### 2.3 气泡无圆角
|
||
**问题**: RimWorld 原生 `Widgets.DrawBoxSolid` 不支持圆角。
|
||
**方案**:
|
||
- 方案 A: 使用 9-slice 圆角贴图 (`Textures/UI/BubbleRounded.png`)
|
||
- 方案 B: 接受直角，但添加边框使其更精致
|
||
|
||
### 2.4 头像无圆形处理
|
||
**方案**: 使用圆形遮罩贴图覆盖在头像上，或创建 `Textures/UI/AvatarMask.png`
|
||
|
||
### 2.5 按钮样式不一致
|
||
**现状**: 使用默认 `Widgets.ButtonText`
|
||
**期望**: 使用 `Dialog_CustomDisplay.DrawCustomButton` 样式
|
||
|
||
修改 [Overlay_WulaLink.cs](file:///C:/Steam/steamapps/common/RimWorld/Mods/3516260226/Source/WulaFallenEmpire/EventSystem/AI/UI/Overlay_WulaLink.cs) 的 [DrawFooter](file:///C:/Steam/steamapps/common/RimWorld/Mods/3516260226/Source/WulaFallenEmpire/EventSystem/AI/UI/Overlay_WulaLink.cs#345-385):
|
||
```csharp
|
||
// 修改前
|
||
if (Widgets.ButtonText(btnRect, ">"))
|
||
|
||
// 修改后 (需要静态化或复制 DrawCustomButton 方法)
|
||
DrawCustomButton(btnRect, ">", isEnabled: true);
|
||
```
|
||
|
||
---
|
||
|
||
## 问题 3: 样式统一 (WulaLinkStyles.cs)
|
||
|
||
需要调整以下颜色以匹配大 UI 的"军团"风格:
|
||
```csharp
|
||
// Header: 深红色，与大 UI 标题栏一致
|
||
public static readonly Color HeaderColor = new Color(0.5f, 0.15f, 0.15f, 1f);
|
||
|
||
// 背景: 半透明暗红
|
||
public static readonly Color BackgroundColor = new Color(0.2f, 0.05f, 0.05f, 0.85f);
|
||
|
||
// AI 气泡: 深灰带红色边框
|
||
public static readonly Color StudentBubbleColor = new Color(0.15f, 0.12f, 0.12f, 1f);
|
||
public static readonly Color StudentStrokeColor = new Color(0.6f, 0.2f, 0.2f, 1f);
|
||
|
||
// 玩家气泡: 暗红色
|
||
public static readonly Color SenseiBubbleColor = new Color(0.4f, 0.15f, 0.15f, 1f);
|
||
```
|
||
|
||
---
|
||
|
||
## 验证清单
|
||
- [ ] 大 UI 显示正确的立绘、标题、描述和按钮布局
|
||
- [ ] 小悬浮框背景为半透明暗红色
|
||
- [ ] 消息之间无多余空白
|
||
- [ ] 按钮使用暗红色自定义样式
|
||
- [ ] (可选) 气泡有圆角
|
||
- [ ] (可选) 头像为圆形
|
||
|
||
## 编译命令
|
||
```powershell
|
||
dotnet build C:\Steam\steamapps\common\RimWorld\Mods\3516260226\Source\WulaFallenEmpire\WulaFallenEmpire.csproj
|
||
```
|
||
|
||
## 测试入口
|
||
1. 启动 RimWorld，加载存档
|
||
2. 打开 Debug Actions Menu
|
||
3. 搜索 "WulaLink" 并点击 "Open WulaLink UI"
|