显示图层适合放那些不属于某个单独页面、但又需要长期显示的内容，例如全局背景、常驻状态条、全局遮罩或悬浮提示。
什么是显示图层
在 LVGL 里，活动屏幕用来承载当前页面；显示图层则是固定挂在显示器上的几层“公共区域”。它们不会随着页面切换一起消失，所以适合放跨页面复用的界面元素。根据 LVGL 官方文档《Screen Layers》 和 《Layers》 的说明，显示器创建后会同时带上活动屏幕、顶部图层、系统图层，以及在 LVGL 9.x 中提供的底部图层；其中顶部图层和系统图层默认都是透明、不可滚动、不可点击，底部图层位于活动屏幕下方，默认透明且可点击。
可以把它理解成下面这组叠放关系：
| 图层 | 位置 | 适合放什么 |
|---|---|---|
| 底部图层 | 在页面下方 | 全局背景、装饰底图 |
| 活动屏幕 | 页面主体 | 当前页面自己的内容 |
| 顶部图层 | 在页面上方 | 常驻状态栏、全局悬浮按钮、遮罩 |
| 系统图层 | 最上方 | 必须始终压在最上层的提示或系统级覆盖内容 |
其中：
- 活动屏幕 适合页面内容本身。
- 顶部图层 更适合大多数跨页面浮层。
- 系统图层 优先级最高，只有明确需要“永远压在最上面”时再用。
- 底部图层 只在 LVGL 9.x 可用，适合做全局背景。
四种层级分别适合放什么
活动屏幕
活动屏幕就是当前正在显示的页面主体。它负责承载当前页面自己的内容，切换页面时也会随之变化。
典型元素包括：
- 当前页面的主要布局
- 页面里的按钮、列表、表单、图表
- 只属于当前页面的标题、说明文字和图片
- 跟随页面一起进入和退出的交互元素
如果某块内容只在某一个页面里使用，不需要跨页面常驻，通常就应该放在活动屏幕里。
顶部图层
LVGL 官方文档把顶部图层定义为“位于活动屏幕之上，并在所有屏幕上可见”的共享层，适合放需要跨页面常驻、但又属于业务界面本身的一层界面元素。
典型元素包括：
- 顶部导航栏、标题栏、标签栏
- 全局悬浮按钮
- 全局弹窗宿主、遮罩层
- 跨页面共用的提示条、状态条
如果把顶部图层设为可点击，它会吸收用户点击，表现得像一个模态层。这也是它适合承载遮罩和弹窗的原因之一。
限制与注意事项：
- 按 LVGL 官方默认行为，顶部图层默认不可滚动、不可点击
- 默认透明，所以不会自己挡住下面的页面内容
- 如果你主动把它设为可点击，它会优先吸收点击，下面的页面就无法直接响应
- 适合做全局浮层，但不适合承载需要像普通页面那样滚动浏览的大块内容
系统图层
系统图层位于顶部图层之上，优先级最高。LVGL 官方文档给出的典型例子是鼠标光标，因为这类元素必须始终显示在所有内容之上。
典型元素包括：
- 鼠标光标、触控指示器
- 系统级提示
- 必须压住所有业务界面的紧急提示或覆盖层
- 调试用的性能信息、系统状态浮层
如果一个元素只是“希望固定显示”，通常优先放在顶部图层；只有当它必须始终压在最上面时，再考虑放到系统图层。
限制与注意事项：
- 按 LVGL 官方默认行为，系统图层默认不可滚动、不可点击
- 它始终位于顶部图层之上，优先级最高
- 默认透明，但一旦放入可见元素，就会压在所有业务界面之上
- 更适合系统级提示、光标、调试覆盖层，不建议放普通业务内容
底部图层
底部图层位于活动屏幕下方，只在 LVGL 9.x 可用。LVGL 官方文档特别说明：只有当前活动屏幕的背景不是完全不透明时，底部图层才会露出来。
典型元素包括：
- 全局背景图
- 固定的装饰底板
- 需要通过半透明页面透出的背景元素
- 跨页面共用的底纹、氛围层
如果当前页面背景完全不透明，那么底部图层上的内容通常看不见。这一点在设计时尤其要注意。
限制与注意事项：
- 按 LVGL 官方默认行为，底部图层默认不可滚动，但可点击
- 它位于活动屏幕下方，只有当前活动屏幕背景不是完全不透明时才会露出来
- 只在 LVGL 9.x 提供；如果项目目标版本不支持，检查器里不会提供这个选项
- 更适合做背景和底纹，不适合放需要稳定露出的前景交互元素
什么时候用，什么时候不用
适合用显示图层的情况：
- 切换页面后，这块内容还要继续保留
- 多个页面共用同一套悬浮元素
- 需要固定在最上层或最下层显示
不适合用显示图层的情况：
- 内容只属于某一个页面
- 元素需要跟随页面一起进出场
- 只是想做页面内部的前后遮挡关系
一个简单判断方法是：如果它应该跟着页面走，就放在活动屏幕；如果它应该一直留在显示器上，就用显示图层。
在编辑器里怎么用
1. 先创建一个屏幕
显示图层在编辑器里也是以屏幕的形式编辑的，所以你可以先像平时一样创建一个屏幕。
2. 在检查器里设置“显示图层”
选中这个屏幕后，在检查器里把它的显示图层改成目标图层，例如“顶部图层”“系统图层”，或者在 LVGL 9.x 下选择“底部图层”。
这个选项最直接的用途是：当你把一个屏幕设计完后，才发现它其实放错了图层，可以在这里切换到正确的显示图层。 比如原本放在活动屏幕里设计，后来发现它应该是跨页面常驻的导航栏或全局浮层，就可以在检查器里改过来。
如果你想把它恢复成 LVGL 官方语义里的“活动屏幕”，就在这里把显示图层切回编辑器里的 “无（普通屏幕）”。
如果某个图层选项没有出现，通常表示当前 LVGL 版本不支持它。
同一个显示图层一次只能对应一个屏幕，所以更适合承载“全局公共内容”，而不是拆成很多页面分别管理。
不过从实际使用上，更推荐的方式是：先在导航器里选中目标图层，再开始设计这个图层里的内容。
例如要做常驻导航栏，最好先进入“顶部图层”再开始摆放组件，而不是先按活动屏幕设计完，再回来切换。这样更不容易在结构、层级和交互预期上返工。
3. 像编辑活动屏幕一样编辑内容
进入该图层后，仍然可以在画布里放置组件、调整布局、编辑样式。不同之处在于，这些内容会按图层规则叠放在其他页面的上方或下方，而不是作为一个活动屏幕被切换显示。
4. 在预览中验证叠放效果
切换普通页面时，图层内容会继续保留。你可以重点检查这几件事：
- 是否真的需要跨页面常驻
- 是否遮挡了页面上的可点击区域
- 顶层提示是否压住了应该显示的页面内容
- 底部图层上的背景是否真的透出来了
使用建议
- 优先少用、用准：图层很适合做全局元素，但不适合承载大量页面业务内容。
- 顶部图层比系统图层更常用：除非你明确需要最高优先级，否则优先放在“顶部图层”。
- 一层只放一类职责：例如“底部图层”放背景，“顶部图层”放全局悬浮界面元素，避免后期难以维护。
- 先从活动屏幕开始：只有当你确认内容需要跨页面保留时，再改成显示图层。