---
url: /design/firmware-system-chrome.md
---
# 固件系统栏与应用画布

> 适用设备：Read Pico，684 × 1216 物理像素。

固件将状态栏、App Bar 和底部导航作为系统组件。页面或应用只声明需要的系统栏及动作；系统负责绘制、命中区、刷新和画布分配。页面内容获得完整宽度的 `application_canvas`，并自行在其中遵守 36 px 内容边距。

## 声明接口

`rui_chrome_spec_t` 是固件内的声明：

* `fullscreen` 与 `status_bar`：确定状态栏是否保留。非全屏页始终显示状态栏。
* `title`、`back`、`back_id` 与 `actions`：声明 App Bar 标题、返回和最多两个高频动作。
* `navigation` 与 `navigation_active`：声明 2 至 5 项底部导航及选中项。
* `separator_top`、`separator_bottom`：仅在页面有明确需要时请求系统轻分隔线。

渲染后，系统把计算结果写入 `rui_state_t.application_canvas`。应用不能在系统栏或系统命中保留区绘制可点击内容。

## 固定几何

| 组件 | 可见几何 | 触摸与规则 |
| --- | --- | --- |
| 状态栏 | y=0，40 px 高；左右 24 px；时间 24 px；同步点阵 26 px，Wi-Fi／电池点阵 28 px | 无点阵回退图标为 24 px；真实状态变化时更新，空间不足先隐藏次要状态 |
| App Bar | 有状态栏时可见行 y=56…104；根页标题 x=36、48 px；动作 48 × 48，动作间 24 px | 返回可见箭头 24 px，热区 72 × 80；二级标题 40 px、从 x=96 开始 |
| 底部导航 | y=1136…1200；底部留白 16 px；图标 48 × 48 | 4 项图标 x=48、228、408、588；选中线 64 × 4，底边 y=1200 |

三栏齐全时，系统画布是 `(0, 104, 684, 1032)`，页面的建议内容区为 `(36, 120, 612, 1000)`。只有状态栏和 App Bar 的页面仍获得 `(0, 104, 684, 1112)` 的全宽画布。应用根页需要分页时，应用宫格结束于 y=1024，分页控件占用 y=1040…1120，与 y=1136…1200 的底部导航保持 16 px 间隔。

## 当前视图声明

| 视图 | 系统组件 | 内容画布用途 |
| --- | --- | --- |
| 首页、书库、应用、设置根页 | 状态栏、App Bar、四项底部导航 | 首页阅读摘要、CoverGrid、应用 IconGrid、设置分类 |
| 阅读设置、目录、Wi-Fi、连接、字体、设备、更新、书签、搜索、跳转、图片与阅读 | 状态栏、带返回的 App Bar | 各自的列表、表单、分页或阅读内容 |

首页、书库、设置和应用根页的底部导航由同一声明式数组生成，因此图标位置、选中线和命中区不再由页面复制维护。应用列表使用动态 3 × 4 IconGrid；插件数量变化时按整页分页，不缩小图标和文字。

## 色彩与排版

系统栏及其内容只使用 `background=255`、`foreground=0`、`secondary=51` 与 `disabled=204` 四个灰阶 Token。字号、字重和行框使用[固件实机排版映射](/design/firmware-type-mapping)中的 `RUI_CAL_*` Token；页面不再自行写入未校准的灰度或字号。