LVGL 中设置 UI 层局部透明,显示下方视频层

LVGL层次

LVGL自上而下分别是layer_sys > layer_top > lv_sreen_active > layer_bottom

即 系统层、顶层、活动屏幕、底层

原理

如果将UI设置为局部透明,显示下方的视频层,不仅仅需要将当前活动屏幕的背景设置为透明,还需要将底层背景也设置为透明。(实测不需要将顶层和系统层设置为透明,当然设置为透明也没问题)

代码

复制代码
lv_obj_set_style_bg_opa(lv_screen_active(), LV_OPA_TRANSP, LV_PART_MAIN)
lv_obj_set_style_bg_opa(lv_layer_bottom(), LV_OPA_TRANSP, LV_PART_MAIN)
lv_display_set_color_format(disp, LV_COLOR_FORMAT_ARGB8888)

这里说一个坑,LVGL中32位的颜色深度除了LV_COLOR_FORMAT_ARGB8888之外还有LV_COLOR_FORMAT_XRGB8888, 后面这个XRGB888像素格式中的X表示没有透明度。

如果之前设置显示器display为了XRGB8888,无法透明掉背景,需要按上述代码最后一句将display设置位ARGB8888格式。

相关推荐
rjc_lihui15 小时前
IntelliSense: 无法打开 源 文件 “ui_mainwindow.h“ demo\qtdemosrc\mainwindow
ui
老星*1 天前
Lucide Icons:开源、轻量、设计师友好的现代图标库
ui·开源·github
Swift社区1 天前
AI 驱动 UI:鸿蒙 ArkUI 的新可能
人工智能·ui·harmonyos
Feng-licong2 天前
告别手写 UI:当 Google Stitch 遇上 Flutter,2026 年的“Vibe Coding”开发流
flutter·ui
一字白首2 天前
微信小程序进阶实战:从 UI 组件库到全局状态管理全解DAY05
ui·微信小程序·小程序
Rabbit_QL2 天前
【前端UI行话】前端 UI 术语速查表
前端·ui·状态模式
console.log('npc')2 天前
响应式布局的 Element UI、Ant Design 24栅格布局
vue.js·ui
田里的水稻2 天前
EI_openclaw_UI交互
人工智能·ui·机器人
NGBQ121382 天前
Adobe-Photoshop-2026-27.4.0.15-m0nkrus 全解析:专业图片处理软件深度指南
ui·adobe·photoshop
mxwin2 天前
Unity Shader UI 流光效果完全推导指南
ui·unity·游戏引擎·shader·uv