Files
stc32g128k/Docs/40_ui-design/main.md

6.9 KiB
Raw Blame History

UI 设计 (Docs/40_ui-design/main.md)

本章节定义手环 120x240 Truly AMOLED 屏幕的画面布局、各页面坐标位置、中文字体/ASCII 字符对齐基线以及局部刷新逻辑。

1. 屏幕物理参数与刷新机制

  • 屏幕规格0.95寸 Truly AMOLED 屏,物理分辨率 120x240
  • 竖向屏规范:屏幕窗口配置为 120 像素宽,240 像素高。页面中的时钟、菜单、报警元素均采用竖屏垂直居中排版(以 X=60 为几何中线)。
  • 坐标偏移修正 Truly AMOLED 屏幕驱动芯片RM69310控制的 GRAM 存在偏置。为了使画面对齐,写屏窗口渲染必须应用 X 轴偏移量 +4Y 轴偏移量 +0。即:LCD_SetWindow(x1 + 4, x2 + 4, y1, y2)
  • 局部刷新防抖机制:清除重绘标志(Redraw)的动作必须在具体的刷新绘制块结束时重置,防止因为主循环高速轮询而产生屏幕闪烁。

2. 页面布局与坐标坐标规范

2.1 时钟待机界面 (STATE_CLOCK)

时钟页面作为常态显示,包括状态栏、数字时钟和日期行。

+-----------------------------------------+
|  🔒 ARME                       🔋 85%   | <- 状态栏 (Y=24~27)
|                                         |
|                                         |
|                 10:35                   | <- 中央时间 (Y=80~128)
|                                         |
|                                         |
|              VEN. 07-10                 | <- 底部日期 (Y=180)
|                                         |
+-----------------------------------------+
  • 状态栏电量显示(极重要)
    • 电池图标 绘制在 X=82, Y=27
    • 电量百分比 绘制在 X=76, Y=24(以 text-anchor="end" 右对齐绘制)。如果处于充电状态,追加 + 号后缀显示为 85%+,起始绘制坐标向左偏置,以确保与电池图标之间依然有安全间距,不发生碰撞。
  • 安防状态显示
    • 布防状态 (ARMED):状态栏左侧显示红色闭锁 🔒 图标,显示 ARME
    • 撤防状态 (DISARMED):状态栏左侧显示绿色开锁 🔓 图标,显示 DESARME

2.2 主选择菜单页面 (STATE_MENU)

由时钟待机长按 CONFIRM 键 3 秒进入。显示四个功能条目,供滚动选择:

+-----------------------------------------+
|               - MENU -                  | <- 标题 (Y=30)
|                                         |
|            1. DATE/HEURE                | <- 条目 1 (Y=80)
|          > 2. APPAIRAGE <               | <- 选中项高亮并加尖括号 (Y=115)
|            3. ARM/DISARM                | <- 条目 3 (Y=150)
|            4. LIAISON IPC               | <- 条目 4 (Y=185)
+-----------------------------------------+
  • 当前所选中的菜单项前后加上闪烁的 > < 箭头或以高亮粗体形式渲染,其余非选中项正常亮度显示。
  • 短按 ▲ 键向上滚动,▼ 键向下滚动。短按 CONFIRM 键进入该项。

2.3 功能设定与子界面设计

2.3.1 时间日期修改界面 (STATE_SET_TIME)

  • 页面指示:顶部大字 REGLAGE HEURE
  • 数据列表:居中分行显示当前编辑的 HOURMINSECYEARMONTHDAY
  • 光标与交互:当前正在修改的数值行(如修改“小时”)闪烁或带有下划线高亮。按 ▲ 键增加数值,▼ 键减小数值,短按 CONFIRM 确认并跳转至下一项,全部设置完后自动保存返回时钟页。
  • 顶部标题:显示 APPAIRAGE(配对)。
  • 中央图案:绘制雷达搜索波纹动画 SEARCHING...,并闪烁提示 DECLENCH. SENS(触发传感器)。

2.3.3 对码确认与二步微调界面 (STATE_PAIR_CONFIRM)

当手环解码到传感器对码信号后,切入此确认页:

+-----------------------------------------+
|    ✓ RECU               (Y=40)
|       
|       PORTE             (Y=90)  <- 步骤1: 传感器类型 (可按 ▲/▼ 修改)
|       
|       [ 🚪 ICON ]       (Y=130) <- 对应位图图标 (32x32px)
|       
|       [  01  ]          (Y=180) <- 步骤2: 序号选框 (可按 ▲/▼ 修改)
+-----------------------------------------+
  • 二步选择焦点逻辑
    • 步骤1 (编辑类型):焦点在类型文字处(例如类型名称前后有闪烁括号 [ PORTE ]),此时按 ▲/▼ 键可在门磁、红外、烟感等 7 种传感器类型间循环切换,图标实时更换。点击 CONFIRM 键保存当前类型并锁定焦点切换到步骤2。
    • 步骤2 (编辑序号):焦点切换在底部的序号选框 [ 01 ]。此时按 ▲/▼ 键自增或自减数字序号01~99。点击 CONFIRM 键完成最终保存并存入数据库,返回时钟待机。
    • 长按 CONFIRM 键 3 秒放弃修改并直接返回时钟待机

2.3.4 系统布撤防手动选择界面 (STATE_ARM_DISARM_SELECT)

  • 顶部标题:显示 REG. ALARME
  • 两个状态选项
    • [ ARME ]
    • [ DESARME ]
  • 按 ▲ / ▼ 键在这两者之间切换高亮。按 CONFIRM 键确认生效,系统状态转入 ARMED 或 DISARMED 并返回时钟页。

2.3.5 IPC 绑定发射界面 (STATE_IPC_BIND)

  • 页面指示:显示 LIAISON IPC (IPC 绑定)。
  • 发射中提示:中央大字显示 ENVOI EN COURS(正在发送),绘制动态发射波形,系统使用 bracelet_factory_id 自动连续发射 EV1527 数据码为 0x01 的对码广播包。
  • 物理地址展示:屏幕底部显示当前手环出厂唯一地址 ID: 0xXXXXX
  • 退出/返回机制
    1. 自动退出:发射持续约 3 秒后,自动结束并退回时钟待机状态;
    2. 按键退出:长按 CONFIRM 键 3 秒长按 ▼ 键 2 秒 立刻主动退出发射状态并返回时钟待机。

2.4 报警触发与本地 SOS 界面 (STATE_ALARMING / STATE_SOS_EMITTED)

  • 报警提示边框:全屏闪烁的红色警告虚线/实线边框。
  • 中央图标根据触发的防区传感器类型居中绘制对应的单色位图图标32x32px
  • 主动 SOS 界面:大字显示 SOS EMIS,居中显示 🚨 旋转警灯图标。

3. 文字居中对齐与字模基线规范

为保证排版美观,Drivers/lcd_font.h 内的标准字模点阵需要满足如下基线对齐:

  • 水平居中公式
    • 对于标准 8px 宽字符X 轴绘制起点为 (120 - len * 8) / 2
    • 对于双倍放大 16px 宽时钟字符X 轴绘制起点为 (120 - len * 16) / 2
  • 百分号(%)符号基线修正:百分号字符在 lcd_font.h 数组的索引 0x25 中,点阵数据需向上平移 2 像素,以和 0~9 数字的基线保持严格水平对齐,避免百分号整体下沉。