Ui
界面总览
WinCode 主界面各区域职责与交互方式一览
界面总览
WinCode 的主界面由标题栏、侧边栏、标签页系统、内容区域和可选的右侧资源面板组成。整体采用三栏布局,各区域可独立调整大小或隐藏。

整体布局
┌──────────────────────────────────────────────────────────────┐
│ 标题栏 (全局操作按钮) │
├──────────┬──────────────────────────────────┬────────────────┤
│ │ 多标签页切换 │ │
│ 侧边栏 ├──────────────────────────────────┤ 右侧资源面板 │
│ │ 内容区域 │ │
│ - 项目分组│ │ - 文件树 │
│ - 会话列表│ │ - 文件内容 │
│ - 搜索 │ │ │
│ │ 底部输入区 │ │
└──────────┴──────────────────────────────────┴────────────────┘标题栏
标题栏支持拖动窗口,从左到右包含:
- 左侧 -- 侧边栏切换按钮
- 居中 -- WinCode Logo + 版本号
- 右侧 -- Gateway 状态指示灯、配对按钮、企业认证、主题切换、右侧面板切换、设置按钮
侧边栏
侧边栏位于左侧,最小宽度 220px,可通过拖拽边缘调整大小,也可通过快捷键 Cmd+Shift+S 切换显示。
侧边栏收起后,鼠标悬停在左边缘 3px 区域会触发「窥视」(peek) 效果,以浮层形式临时显示侧边栏内容。鼠标离开后自动收起。
标签页系统
标签页区域分为上方的标签栏和下方的内容区域。
标签栏仅在标签数 > 1 时显示,每个标签以胶囊形状呈现,支持点击切换和关闭。
内容区域根据标签类型渲染不同的工作区视图。WinCode 支持以下视图类型:
| 视图类型 | 说明 |
|---|---|
welcome | 欢迎页,含输入框和键盘提示 |
chat | AI 会话界面 |
extension-center | MCP / Skills / Plugins 管理 |
online-documents | 在线文档 |
tfs-work-items | TFS 工作项 |
skills | 技能视图 |
标签切换时会保留每个标签页的内部状态(如滚动位置、输入内容等)。
右侧资源面板
当标签类型为 chat 且会话关联了项目路径时,可以打开右侧资源面板。面板支持拖拽调整宽度。
快捷键 Cmd+Shift+E 切换右侧面板。
全局快捷键
| 快捷键 | 功能 |
|---|---|
Cmd+, | 打开设置 |
Cmd+Shift+S | 切换左侧边栏 |
Cmd+Shift+E | 切换右侧资源面板 |
Cmd+I | 聚焦输入框 |