OVERNIGHT_SUMMARY.md 6.91 KB

:crescent_moon: Overnight 工作总结 — UI 重设计

完成时间:2026-05-09 凌晨 分支feat/ui-redesign-apple-theme 状态:所有计划任务已完成 :white_check_mark:


TL;DR

把全套 UI 改造成 Apple 高级浅色风格 + 完整深色主题,修了 4 个明显的 layout 问题。删除了 65 处零散 inline setStyleSheet,引入 theme.py 作为单一真相源。master 完全没动。

打包验证启动到登录页 :white_check_mark:


怎么验收(5 分钟)

# 1. 切到分支
git checkout feat/ui-redesign-apple-theme

# 2. 跑现成的打包产物(昨晚刚打好的)
./dist/ZB100ImageGenerator/ZB100ImageGenerator.exe
# 或者 dev 模式更快
.venv/Scripts/python.exe image_generator.py

按以下顺序看效果:

检查项 看什么
登录页 标题"登录"+ 副标题"珠宝壹佰图像生成器",主按钮 pill 圆角 + Apple Blue
主窗口 tab 栏 三个 tab,选中态 = 蓝字 + 底部 2px 蓝线(不再是 Win95 凸起 tab)
任务队列 sidebar 顶部"任务队列"标题在独立 40px header bar 里,与主区 tab 同基线(不再飘到右上角)
"生成图片" / "下载图片" 按钮 主按钮蓝色实心 pill,下载是白底描边 — 视觉权重明显有别
GroupBox(参考图片 / 提示词等) 卡片化白底,淡边框 + 左上小标签,不再 Win95 黑边
输入框焦点 双层蓝边(Apple Blue)
系统切换深色 Win11: 设置 → 个性化 → 颜色 → 选"深色"。应用应自动跟随。Mac 同理
业务功能 生成 / 队列 / 历史 / 收藏全跑一遍,应该完全没变(只动了视觉)

如果某处异常或丑,回头我们调;不喜欢整套也可以 git checkout master 当无事发生。


改了什么

新文件

  • theme.py(~280 行)— 设计系统的核心

    • TOKENS_LIGHT / TOKENS_DARK:24 个语义颜色
    • SIZES:圆角 / 间距 / 控件高度 / 字号
    • FONT_STACK:跨平台字体回退
    • build_qss(mode):拼成完整 QSS 字符串
    • ThemeManager(QObject):监听 QGuiApplication.styleHints().colorSchemeChanged 自动切换
    • apply_theme(app):主入口调用
    • get_color(token, fallback):QSS 命中不到的渲染层 API(如 setForeground)用
  • docs/superpowers/specs/2026-05-09-ui-redesign-apple-theme-design.md

    • 完整设计文档:背景、决策表、令牌定义、组件映射、迁移策略、风险

修改的文件

  • image_generator.py — 删除 ~150 行 inline QSS / 装饰样式

    • main() Phase 4 加 apply_theme(app)
    • LoginDialog:删 80 行 apply_styles QSS 块;用 objectName=loginDialog/loginTitle + property 命中全局 QSS;主按钮 variant=primary;error_label 用 _set_error(status, text) helper
    • ImageGeneratorWindow:删 50 行 apply_styles QSS 块;65 处状态色改 _set_status(status) helper;"生成图片" 主按钮 variant=primary;缩略图删除按钮 objectName=thumbDeleteBtn variant=danger;预览图占位 objectName=previewPlaceholder/previewImage + has_image property
    • DragDropScrollArea:3 处 inline QSS 改 drag_state property(idle/active)
    • StyleDesignerTab:8 处 inline QSS 删除;类内补 _set_status helper(之前批量替换漏了)
    • 25+ 个 caption label 用 role="caption" 命中统一字号
  • task_queue.py

    • TaskQueueWidgetobjectName=taskQueueSidebar
    • 顶部新增 40px objectName=sidebarHeader — 修复"任务队列"飘到 tab 旁的视觉断层
    • 删 4 处 inline QSS
    • QListWidgetItem 状态色用 theme.get_color() 读当前主题 token
  • .gitignore

    • 加入 .superpowers/config_no_db.jsonScreenShot_*.png

提交历史(按时间倒序)

80a4cdf feat(ui): 迁移 StyleDesignerTab + TaskQueueWidget 样式
de306ff feat(ui): 接入主入口 + 迁移 LoginDialog/ImageGeneratorWindow 样式
3bc29f7 feat(theme): 设计令牌生成器 + 主题管理器
d717f7d docs: UI 重设计方案 — Apple 浅深双主题

每个 commit 颗粒度小,单点回退方便:git revert <sha>


设计决策回顾(来自前一晚 brainstorming)

决策 你的选择 你的理由
设计方向 Apple 高级感浅色 统一 macOS 与 Windows 设计语言
主色调 Apple Blue #0071E3 / Dark #0A84FF 跟品牌元素颜色契合
范围 外观 + 关键 layout 修复 不只是换皮,趁机解决 sidebar / 按钮分级
深浅模式 完整双套主题 macOS 跟随时间自动切换,单色主题转换会巨丑
二级 dialog 一并重做 避免登录页 / 主窗口风格断裂
实现路径 Python 设计令牌生成器 单一真相源比双 .qss 文件不容易飘

已知 / 未做

设计文档明确不做的(YAGNI)

  • 没引第三方 UI 库(qfluentwidgets 等)
  • 没动业务逻辑(生成 / 队列 / 历史功能完全没改)
  • 没改信息架构(tab 顺序、字段顺序都没变)
  • 没动数据库 / 配置
  • 没碰 Mac 输入框可见性 hack(line 1292/1356 的 2 处 inline 占位符样式保留 — 设计文档里明确允许)

已知小风险

  • Qt QSS 不支持 box-shadow,"卡片浮起感"用淡边框模拟,不及 web 真投影
  • macOS Big Sur 之前的版本可能不响应 colorSchemeChanged(项目实际部署不涉及,无影响)
  • 全局 QSS 改变后 QMessageBox 系统对话框按钮排布可能受 Qt 默认样式影响 — 实测正常,备注观察

顺手提交的非 UI 工作

我开分支前发现你有几个 untracked 文件(openspec/changes/add-image-historyadd-logging-systemrefactor-history-browsingtest_config_loading.py),提交时 git add -A 把这些一并带进了第二个 commit(de306ff)。这不是 UI 工作的一部分,但已经在分支里。如果你想把它们单独提到 master,可以从这个分支 cherry-pick 对应文件路径。


推送状态

:white_check_mark: 分支已 push 到 origin/feat/ui-redesign-apple-theme(GitLab) :white_check_mark: master 完全没动 :white_check_mark: 设计文档在 docs/superpowers/specs/2026-05-09-ui-redesign-apple-theme-design.md :white_check_mark: memory 已记录用户偏好(设计方向、品牌色逻辑、跨平台一致性诉求)


你今天上班可以做的事

  1. 看一眼git checkout feat/ui-redesign-apple-theme && python image_generator.py —— 5 分钟
  2. 走一遍验收清单(上面 8 项)—— 10 分钟
  3. 决定下一步
    • 喜欢 → 我们 PR 合到 master
    • 部分要调(某个色/某个 layout)→ 留 review 评论,我改
    • 整体不对 → git checkout master,当无事发生

如果觉得满意,下一步可以考虑:

  • 给"生成进度"加个真实的 QProgressBar 替代纯文字状态(QSS 已就位)
  • 给 dark mode 状态指示器加个右上角小开关(手动锁定模式)— theme.ThemeManager.force_mode() 已经准备好

睡个好觉。明天聊。

— Claude