柴进 / GoogleNanoBananaApp

name: QML PoC 文件结构与设计系统
description: feat/ui-qml-poc 分支的 QML 代码组织、Theme 令牌、组件 API
type: reference
originSessionId: 21abab40-0d6c-449a-ae72-9ca03205f077

目录结构：

qml_poc/
├── main_qml.py            入口：装配 5 桥 + audit_logger + history.refresh()
│                          env 调试：QML_AUTO_LOGIN=1 / QML_DEBUG_TAB=0|1|2
└── qml/
    ├── qmldir             模块声明（singleton Theme 1.0）
    ├── Theme.qml          Singleton 设计令牌
    ├── Main.qml           ApplicationWindow（登录态切换尺寸 + 子页）
    ├── LoginScreen.qml    登录页（接 auth.login，错误展示 + busy）
    ├── MainWindow.qml     主窗口（下划线 TabBar + 任务队列 sidebar 接 taskQueue.model）
    ├── ImageGenTab.qml    图片生成 tab（参考图录入/收藏/下载/预览全接 imageGen）
    ├── HistoryTab.qml     历史记录 tab（ListView + 详情面板，接 history.model）
    ├── StyleDesignerTab.qml 款式设计 tab（8 字段 + 实时 Prompt 预览 + 生成）
    └── components/
        ├── Card.qml             圆角 + 极淡边框，default property 子元素
        ├── PrimaryButton.qml    pill 圆角 + Apple Blue + 120ms ColorAnimation
        ├── SecondaryButton.qml  圆角描边，hover 出灰底
        ├── ThemedTextField.qml  焦点 2px 蓝边动效
        ├── ThemedComboBox.qml   自定义 chevron + popup 圆角
        └── CaptionLabel.qml     12pt DemiBold，组上方标签

Theme.qml 暴露的 token（singleton，QML import 后 Theme.accent 直接用）：

• 颜色：bgCanvas/bgSurface/bgElevated/bgSubtle/bgHover, textPrimary/Secondary/Tertiary/OnAccent, borderDefault/Strong, divider, accent/Hover/Pressed/Subtle, success/warning/danger
• 尺寸：radiusSm/Md/Lg/Pill, space1-6, controlHSm/Md/Lg, fontXs/Sm/Base/Lg/Xl/Xxl
• 字体：fontFamily（按 Qt.platform.os 自动选 SF Pro / Segoe UI Variable）

关键设计规则：

• 所有圆角用 Theme.radiusXxx，不要硬编码
• 所有颜色用 Theme.xxx，不要硬编码 hex
• caption + control 用 ColumnLayout spacing 4-6，组之间 spacing 12-16
• Card 内 anchors.margins 用 Theme.space4 (16) 保证一致
• 主按钮（生成 / 登录 / 提交）一律 PrimaryButton（pill 圆角）
• 次按钮（添加 / 下载 / 取消）一律 SecondaryButton（描边圆角）
• 状态色（成功 / 失败 / 等待）用 color: Theme.success/danger/warning

AppState QObject（main_qml.py，作为 contextProperty 暴露）：

• Property: loggedIn (bool), currentTab (int)
• Slot: login(username, password) → bool, logout(), setTab(idx)
• Signal: loggedInChanged, currentTabChanged
• 当前是 PoC 占位（login 接受任意非空），下一步要换成真实 db 认证

业务桥层 TODO（task #12）：除 AppState，还需要暴露：

• imageGen：参考图列表 / 提示词 / 生成方法 / 进度信号
• styleDesigner：字段列表 / 词库管理 / Prompt 预览
• history：QAbstractListModel（复用现有 HistoryListModel）
• taskQueue：QAbstractListModel for 任务列表 + 取消方法
• theme：跟随系统 colorScheme，触发 QML Theme 切换