本项目为 RK3506G 开发板的 Linux 系统 LVGL 桌面程序,参考以下开源项目实现:
- lv_port_linux:https://github.com/lvgl/lv_port_linux
- lv_100ask_linux_desktop:https://github.com/100askTeam/lv_100ask_linux_desktop
# 克隆主仓库
git clone https://github.com/Deep-start9527/lv_desktop_demo.git
# 同步子仓库模块
git submodule update --init --recursive修改项目根目录下的 user_cross_compile_setup.cmake 文件,配置交叉编译链路径及工具:
# 用法示例:
# 1. 生成构建文件:cmake -DCMAKE_TOOLCHAIN_FILE=./user_cross_compile_setup.cmake -B build -S .
# 2. 编译项目:make -C build -j
set(CMAKE_SYSTEM_NAME Linux)
set(CMAKE_SYSTEM_PROCESSOR arm)
# 请替换为自身 SDK 中交叉编译链的实际路径
set(tools <SDK>/buildroot/output/rockchip_rk3506_guition/host)
set(CMAKE_C_COMPILER ${tools}/bin/arm-buildroot-linux-gnueabihf-gcc)
set(CMAKE_CXX_COMPILER ${tools}/bin/arm-buildroot-linux-gnueabihf-g++)
set(PKG_CONFIG_EXECUTABLE ${tools}/bin/pkg-config) # 配置 SDK 内置包管理器项目依赖 dbus 库和 freetype 库,因工具链存在已知问题(暂未修复),需手动调整头文件路径,操作如下(请替换为自身 SDK 的实际路径):
# 进入交叉编译链 sysroot 目录
cd JC1060R370C_I/RK3506_LINUX6.1_SDK_Release/buildroot/output/rockchip_rk3506_guition/host/arm-buildroot-linux-gnueabihf/sysroot/
# 处理 dbus 头文件
cp -rf usr/include/dbus-1.0/* usr/include/
cp usr/lib32/dbus-1.0/include/dbus/dbus-arch-deps.h usr/include/dbus/
# 处理 freetype 头文件
cp -rf usr/include/freetype2/* usr/include/进入仓库根目录,执行编译脚本:
./build.sh编译完成后,生成的可执行文件会自动复制到项目根目录的 lv_desktop/app 文件夹中。
将项目中的 lv_desktop 文件夹完整上传到开发板的 /root 目录下;若需上传至其他目录,需修改程序中硬编码的绝对路径(当前程序默认指向 /root 目录)。
将 lv_desktop/server 目录下的服务文件复制到开发板的 DBus 服务目录:
bash
运行
# 开发板端执行
cp -r /root/lv_desktop/server/* /usr/share/dbus-1/services# 启动 DBus 服务(必选)
export $(dbus-launch)
# 运行 LVGL 桌面程序
/root/lv_desktop/app/lv_desktop├── asset # 静态资源(音频、字体、图标等)
│ ├── audio
│ ├── font
│ ├── icon
│ ├── image
│ ├── music
│ ├── service
│ └── test
├── docker # Docker 相关配置
├── example # 示例代码
├── lv_desktop # 程序运行依赖资源&配置
│ ├── app # 编译产物存放目录(自动复制)
│ ├── icon # 桌面应用图标
│ ├── image # 壁纸/图片资源
│ ├── service # DBus 服务配置文件
│ ├── test # 测试脚本
│ ├── config.json # 桌面图标&壁纸核心配置
│ └── rk3506_test.json # 测试功能配置
├── lv_desktop_app # 应用程序源码
│ ├── lv_app_demo_benchmark
│ ├── lv_app_demo_clock
│ ├── lv_app_demo_file
│ ├── lv_app_demo_image
│ ├── lv_app_demo_music
│ ├── lv_app_demo_notepad
│ ├── lv_app_demo_setting
│ ├── lv_app_demo_temp
│ ├── lv_app_demo_test
│ ├── lv_app_demo_video
│ ├── lv_app_demo_weather
│ └── lv_app_demo_widgets
├── lv_desktop_modules # 核心模块源码
│ └── src
│ ├── lv_desktop_backlight # 背光调节模块
│ ├── lv_desktop_dbus_init # DBus 服务初始化
│ ├── lv_desktop_icon_init # 桌面图标初始化
│ ├── lv_desktop_return_btn # 返回桌面按钮
│ ├── lv_desktop_status # LVGL 互斥锁
│ └── lv_desktop_volume # 音量调节模块
├── lvgl # LVGL 核心库
├── scripts # 编译/部署脚本
└── src
└── lib # 通用工具库cp -rf lv_desktop_app/lv_app_demo_temp/ lv_desktop_app/lv_app_demo_widgets修改 lv_desktop_app/CMakeLists.txt,添加新应用的子目录:
add_subdirectory(lv_app_demo_widgets)将 lv_desktop_app/lv_app_demo_widgets/CMakeLists.txt 中所有 lv_app_demo_temp 替换为 lv_app_demo_widgets。
- 在项目
src目录下创建ui_widgets目录,并新增以下文件:
//ui_widgets.h
#ifndef __UI_WIDGETS_H
#define __UI_WIDGETS_H
void ui_widgets_create();
#endif// ui_widgets.c
#include <stdio.h>
#include "lvgl/lvgl.h"
#include "lvgl/demos/lv_demos.h"
#include "ui_widgets.h"
void ui_widgets_create()
{
lv_demo_widgets();
}- 更新应用的 CMake 配置(
lv_desktop_app/lv_app_demo_widgets/CMakeLists.txt),添加新文件的路径:
file(GLOB LV_DESKTOP_MODULES_SRC
src/*.c
src/ui_widgets/*.c # 新增业务代码路径
)
target_include_directories(lv_app_demo_widgets
PRIVATE
${PKG_CONFIG_INC}
${CMAKE_CURRENT_SOURCE_DIR}/src
${CMAKE_SOURCE_DIR}/lvgl/include
${CMAKE_SOURCE_DIR}/src/lib
${LVGL_CONF_INC_DIR}
src/ui_widgets # 新增头文件路径
)在 lv_desktop/service 目录下创建 net.desktop.lvgl.Widgets.service,内容如下:
[D-BUS Service]
Name=net.desktop.lvgl.Widget
Exec=/root/lv_desktop/app/lv_app_demo_widgets # 开发板中应用的绝对路径
修改 lv_desktop/config.json,在对应 page 节点下添加应用配置:
{
"background":"/root/lv_desktop/image/image3.png",
"page":[
{
"id": 0,
"app": [
{"name":"lock", "path":"net.desktop.lvgl.Clock","icon_path":"/root/lv_desktop/icon/lock.png"},
{"name":"lock", "path":"net.desktop.lvgl.music","icon_path":"/root/lv_desktop/icon/icon_3.png"},
{"name":"notepad", "path":"net.desktop.lvgl.Notepad","icon_path":"/root/lv_desktop/icon/icon_4.png"},
{"name":"lock", "path":"net.desktop.lvgl.music","icon_path":"/root/lv_desktop/icon/icon_1.png"}
]
},
{
"id": 1,
"app": [
{"name":"Widgets","path":"net.desktop.lvgl.Widget","icon_path":"/root/lv_desktop/icon/icon_1.png"},
{"name":"Benchmark","path":"net.desktop.lvgl.Benchmark","icon_path":"/root/lv_desktop/icon/benchmark.png"},
{"name":"Test","path":"net.desktop.lvgl.Test","icon_path":"/root/lv_desktop/icon/icon_2.png"},
{"name":"Fileview","path":"net.desktop.lvgl.Fileview","icon_path":"/root/lv_desktop/icon/file.png"},
{"name":"Image","path":"net.desktop.lvgl.Image","icon_path":"/root/lv_desktop/icon/image.png"},
{"name":"Video","path":"net.desktop.lvgl.Video","icon_path":"/root/lv_desktop/icon/video.png"},
{"name":"Setting","path":"net.desktop.lvgl.Setting","icon_path":"/root/lv_desktop/icon/setting.png"},
{"name":"music","path":"net.desktop.lvgl.Music","icon_path":"/root/lv_desktop/icon/img_app_music_player.png"}
]
},
{
"id":2,
"app":[
{"name":"Weather","path":"net.desktop.lvgl.Weather","icon_path":"/root/lv_desktop/icon/weather.png"}
]
}
]
}表格
| 字段 | 说明 |
|---|---|
| background | 桌面壁纸的绝对路径 |
| page | 桌面分页配置(数组) |
| page.id | 页面 ID:- 0:底部应用栏(最多 4 个图标,name 字段不展示)- ≥1:中间页面(最多 12 个应用图标) |
| page.app | 单页应用列表(数组) |
| app.name | 应用名称(id=0 时不显示) |
| app.path | DBus 服务名称(需与 /usr/share/dbus-1/services中.service 文件的 Name 字段一致,名称不一致时不会启动app) |
| app.icon_path | 应用图标的绝对路径 |
重新编译项目并上传文件到开发板,运行桌面程序后,即可看到新增的 Widgets 应用图标,添加完成。
rk3506g内存较小,使用lv_gstream播放视频时,如果视频帧率过高,可能会导致播放卡死。修改lvgl/src/libs/gstreamer/lv_gstreamer.c文件,将on_decode_pad_added函数中,uint32_t target_fps = 1000 / LV_DEF_REFR_PERIOD;修改为uint32_t target_fps = 18;。单独使用
lv_gstream组件播放视频不使用桌面的情况下可将目标帧率设置为24。