关于嵌入式:好嗨哟OneOS-图形组件显示自己喜欢的图片

33次阅读

共计 1955 个字符，预计需要花费 5 分钟才能阅读完成。

始终对图形心心念念，还能想到以前应用 QT 的日子，而后接触到了资源比拟受限的 MCU，发现 QT 便没有什么劣势了，更多的则是：GUIX、ucGUI、storyboard，LVGL 等，没有一家独大，而是百花争鸣。其中，OneOS 联结 LVGL，组成 OneOS 下的图形组件，也让 OneOS 的图形性能失去了很好的扩大和延长。

此篇文章，次要应用其图形组件，联合 LVGL 的图片在线转换工具，简略体验一下图片显示的感觉。

在 LVGL 中，图片显示有几种形式呢？

我能想到的有两种，其一是在文件系统的撑持下，把图片间接放入 sd 卡或者其它文件系统中去。而后调用相干接口，便可把图片从屏幕上显示进去。其二则是把图片间接转化为 C 源码文件，而后间接编译进可执行文件中去。

如何体验这两种形式呢？其实也曾经存在于 GUI 的配置中了，其提供了图形的 example，能够疾速体验一下下~

GUI → Enable LVGL → Enable LVGL examples → Third party Lib example
[ ] Enable LVGL example bmp
[ ] Enable LVGL example gif
[*] Enable LVGL example png
[ ] Enable LVGL example jpg
[ ] Enable LVGL example qrcode
[] Enable LVGL example freetype

其中的 example 代码存在于文件：OneOS\components\gui\lvgl8.2\lvgl\examples\libs，我就以 png 为例，其代码如下，别离展现了文件系统以及转化为 C 源码的形式。

void lv_example_png_1(void)
{LV_IMG_DECLARE(img_wink_png);
    lv_obj_t * img;

    // C 源码形式
    img = lv_img_create(lv_scr_act());
    lv_img_set_src(img, &img_wink_png);
    lv_obj_align(img, LV_ALIGN_LEFT_MID, 20, 0);

    // 文件系统形式
    img = lv_img_create(lv_scr_act());
    /* Assuming a File system is attached to letter 'A'
     * E.g. set LV_USE_FS_STDIO 'A' in lv_conf.h */
    lv_img_set_src(img, "A:lvgl/examples/libs/png/wink.png");
    lv_obj_align(img, LV_ALIGN_RIGHT_MID, -20, 0);
}

学习的最好形式，是本人实际操作，纸上得来终觉浅，绝知此事要躬行。今人说的好哇！好咧，那我要把下图放到板子上显示，一张可恶小菇凉的图片！

应用的工具是 LVGL 官网在线图像转换器：https://lvgl.io/tools/imageco…

这个收费的在线图像转换工具，能够从图像创立 C 数组或原始二进制文件。浏览器反对的任何图像格式都应该能够工作(PNG、JPG 和 BMP 文件应该始终能够工作)。

操作步骤如下：

抉择一个或多个图像(png、jpg 或 bmp)
给输入文件起一个名字(例如“wallpaper 1”)
指定所需的色彩格局
启用抖动（可选项）
单击 Convert 按钮下载生成的 C 文件

如何应用生成的 C 源码呢？也是步骤如下：

将生成的 C 文件复制到 LVGL 我的项目中
在应用程序的 C 文件中，将图像申明为:LV_IMG_DECLARE(my_image_name);
将图像设置为图像对象的源:lv_img_set_src(img, &my_image_name);

这里为了简略，间接把源码放大板级 project 上面了：

而后应用中移的 cube 工具退出到 keil 工程中：

最初，为了简略，间接在gui_ex，执行如下代码：

void gui_ex(void)
{
#ifdef OS_USING_LVGL_EXTRA_FREETYPE
    void lv_example_freetype_1(void);
    lv_example_freetype_1();
#endif

    os_kprintf("gui example,please use shell command\r\n");
    
    LV_IMG_DECLARE(haha);
    lv_obj_t * img;

    img = lv_img_create(lv_scr_act());
    lv_img_set_src(img, &haha);
    lv_obj_align(img, LV_ALIGN_CENTER, 0, 0);
}

最初，把源码放在码云啦，有趣味的，能够参考一下哟！源码仓库：flower: 送你一朵小花花呀

执行成果如下，可恶小菇凉呀：

正文完