#夏日挑战赛#移植littleVGL库到OpenHarmony过程分享(一) 原创 精华

一口气吃不成胖子
发布于 2022-6-17 17:10
浏览
5收藏

移植轻量级通用型图形库到OpenHarmony

本文正在参加星光计划3.0–夏日挑战赛

一、项目简介

1.1 littleVGL 主要特性如下

  • 具有非常丰富的内置控件,像 buttons, charts, lists, sliders, images 等
  • 高级图形效果:动画,反锯齿,透明度,平滑滚动
  • 支持多种输入设备,像 touchpad, mouse, keyboard, encoder 等
  • 支持多语言的 UTF-8 编码 • 支持多个和多种显示设备,例如同步显示在多个彩色屏或单色屏上
  • 完全自定制的图形元素
  • 硬件独立于任何微控制器或显示器
  • 可以缩小到最小内存 (64 kB Flash, 16 kB RAM)
  • 支持操作系统、外部储存和 GPU(非必须)
  • 仅仅单个帧缓冲设备就可以呈现高级视觉特效
  • 使用 C 编写以获得最大兼容性(兼容 C++)
  • 支持 PC 模拟器
  • 为加速 GUI 设计,提供教程,案例和主题,支持响应式布局
  • 提供了在线和离线文档
  • 基于自由和开源的 MIT 协议

1.2 littleVGL 的要求如下:

  • 16、32 或 64 位的单片机(微控制器)或处理器
  • 微处理器的主频最好高于 16MHZ
  • Flash/ROM:如果只用 littleVGL 核心组件的话,则至少需要 64kB 的容量,如果想完整使用的 话,最好保证 180kB 以上的容量
  • RAM:
  • 静态 RAM: 大约 8 到 16 kB,这取决于你所用的组件功能和 objects 控件对象类型
  • 栈: 至少为 2Kb,一般推荐值为 4kBo 动态数据(堆): 至少 4kB,如果你用到了多个或多种控件的话,那么最好设置为 16kB 以 上,这个是可以通过 lv_conf.h 配置文件中的 LV_MEM_SIZE 宏来定义的
  • 显示缓冲区: 至少要比”水平分辨率像素”要大,一般推介值为 10 倍的”水平分辨率像 素”,取个例子,假如我们屏幕的水平分辨率为480个像素,采用16位的颜色深度进行显 示,即一个像素占 2 个字节,那么推介的显示缓冲区大小为 104802=9600 个字节
  • C99 或更新的编译器,如果是用 keil 开发的话,一定得勾选”c99”模式,否则编译会报错的
  • 基本的 c(或者 c++)语言知识,如:指针,结构体,回调函数

1.3 开源项目链接

二、 littleVGL 移植

2.1 开发前准备

  • 本次分享硬件采用的是HI3861开发板和SPI驱动的TFT显示屏
  • 搭建环境请参考上一篇文章
  • 软件包已上传附件,感兴趣可下载体验移植的乐趣

2.2 项目创建

2.2.1 在applications/sample/wifi-iot/app目录下创建一个GUI文件夹

#夏日挑战赛#移植littleVGL库到OpenHarmony过程分享(一)-鸿蒙开发者社区

GUI 目录是用来存放跟 littleVGL 库相关的所有文件的

2.2.2 解压lv_pc_simulator.zip包

接着把 lv_pc_simulator.zip 压缩包里面的 lv_examples.zip 和 lvgl.zip 俩个子压缩包直接拷 贝到GUI 目录下,拷贝完成之后,接着分别对lv_examples.zip 和 lvgl.zip 俩个子压缩包 在当前目录下进行解压缩操作,解压缩完成后,可以把 lv_examples.zip 和 lvgl.zip 都删除了

2.2.3 拷贝配置模板文件

接 着把 GUI/lvgl/lv_conf_template.h 和 GUI/lv_examples/lv_ex_conf_templ.h 俩 个配置模板文件统统拷贝到 GUI 目录下,然后对这个 2 文件分别重命名为 lv_conf.h和 lv_ex_conf.h

2.2.4 新建lvgl_driver子目录

接着还要在 GUI 目录下新建一个 lvgl_driver子目录,这个目录是用来 放底层显示驱动和触摸驱动文件的,最后 GUI 的目录结构如下图所示

#夏日挑战赛#移植littleVGL库到OpenHarmony过程分享(一)-鸿蒙开发者社区

注:在实际项目中,可以删除掉 lv_examples 目录来减少项目所占的磁盘空间,因为此目录就是 专门用来存放官方的演示 demo,对我们的实际项目没有任何作用

2.3 编写BUILD.gn文件

在GUI目录下添加BUILD.gn文件

group("GUI") {
    deps = [
        "lvgl:lvgl",
        "lvgl_driver:lvgl_port",
    ]
}

在GUI/lvgl_driver目录下添加BUILD.gn文件

static_library("lvgl_port") {
    sources = [
        "lv_port_disp.c",
    ]
    

    include_dirs = [
        "//base/iot_hardware/peripheral/interfaces/kits",
        "../../",
        "../lvgl_driver",
     
    ]

}

在GUI/lv_examples目录下添加BUILD.gn文件

static_library("lv_examples") {
    sources = [
        # "src/lv_demo_benchmark/lv_demo_benchmark.c",
        # "src/lv_demo_keypad_encoder/lv_demo_keypad_encoder.c",
        # "src/lv_demo_music/lv_demo_music.c",
        # "src/lv_demo_printer/lv_demo_printer.c",
        # "src/lv_demo_stress/lv_demo_stress.c",
        "src/lv_demo_widgets/lv_demo_widgets.c",
        # "src/lv_ex_get_started/lv_ex_get_started.c",
        # "src/lv_demo_widgets/lv_demo_widgets.c",
    ]
    
    cflags = [ "-Wno-unused-variable" ]
    cflags += [ "-Wno-unused-but-set-variable" ]
    cflags += [ "-Wno-unused-parameter" ]

    include_dirs = [
        "src/lv_demo_widgets",
    ]

}

在GUI/lvgl/BUILD.gn目录下添加BUILD.gn文件

static_library("lvgl") {
    sources = [
        "src/lv_core/lv_disp.c",
        "src/lv_core/lv_group.c",
        "src/lv_core/lv_indev.c",
        "src/lv_core/lv_obj.c",
        "src/lv_core/lv_refr.c",
        "src/lv_core/lv_style.c",

        "src/lv_draw/lv_draw_basic.c",
        "src/lv_draw/lv_draw.c",
        "src/lv_draw/lv_draw_rect.c",
        "src/lv_draw/lv_draw_label.c",
        "src/lv_draw/lv_draw_line.c",
        "src/lv_draw/lv_draw_img.c",
        "src/lv_draw/lv_draw_arc.c",
        "src/lv_draw/lv_draw_triangle.c",
        "src/lv_draw/lv_img_decoder.c",
        "src/lv_draw/lv_img_cache.c",

        "src/lv_font/lv_font.c",
        "src/lv_font/lv_font_fmt_txt.c",
        "src/lv_font/lv_font_roboto_12.c",
        "src/lv_font/lv_font_roboto_16.c",
        "src/lv_font/lv_font_roboto_22.c",
        "src/lv_font/lv_font_roboto_28.c",
        "src/lv_font/lv_font_unscii_8.c",

        "src/lv_hal/lv_hal_disp.c",
        "src/lv_hal/lv_hal_indev.c",
        "src/lv_hal/lv_hal_tick.c",

        "src/lv_misc/lv_circ.c",
        "src/lv_misc/lv_area.c",
        "src/lv_misc/lv_task.c",
        "src/lv_misc/lv_fs.c",
        "src/lv_misc/lv_anim.c",
        "src/lv_misc/lv_mem.c",
        "src/lv_misc/lv_ll.c",
        "src/lv_misc/lv_color.c",
        "src/lv_misc/lv_txt.c",
        "src/lv_misc/lv_math.c",
        "src/lv_misc/lv_log.c",
        "src/lv_misc/lv_gc.c",
        "src/lv_misc/lv_utils.c",
        "src/lv_misc/lv_async.c",

        "src/lv_themes/lv_theme_alien.c",
        "src/lv_themes/lv_theme.c",
        "src/lv_themes/lv_theme_default.c",
        "src/lv_themes/lv_theme_night.c",
        "src/lv_themes/lv_theme_templ.c",
        "src/lv_themes/lv_theme_zen.c",
        "src/lv_themes/lv_theme_material.c",
        "src/lv_themes/lv_theme_nemo.c",
        "src/lv_themes/lv_theme_mono.c",

        "src/lv_objx/lv_arc.c",
        "src/lv_objx/lv_bar.c",
        "src/lv_objx/lv_cb.c",
        "src/lv_objx/lv_ddlist.c",
        "src/lv_objx/lv_kb.c",
        "src/lv_objx/lv_line.c",
        "src/lv_objx/lv_mbox.c",
        "src/lv_objx/lv_preload.c",
        "src/lv_objx/lv_roller.c",
        "src/lv_objx/lv_table.c",
        "src/lv_objx/lv_tabview.c",
        "src/lv_objx/lv_tileview.c",
        "src/lv_objx/lv_btn.c",
        "src/lv_objx/lv_calendar.c",
        "src/lv_objx/lv_chart.c",
        "src/lv_objx/lv_canvas.c",
        "src/lv_objx/lv_gauge.c",
        "src/lv_objx/lv_label.c",
        "src/lv_objx/lv_list.c",
        "src/lv_objx/lv_slider.c",
        "src/lv_objx/lv_ta.c",
        "src/lv_objx/lv_spinbox.c",
        "src/lv_objx/lv_btnm.c",
        "src/lv_objx/lv_cont.c",
        "src/lv_objx/lv_img.c",
        "src/lv_objx/lv_imgbtn.c",
        "src/lv_objx/lv_led.c",
        "src/lv_objx/lv_lmeter.c",
        "src/lv_objx/lv_page.c",
        "src/lv_objx/lv_sw.c",
        "src/lv_objx/lv_win.c",


    ]
    
    cflags = [ "-Wno-unused-variable" ]
    cflags += [ "-Wno-unused-but-set-variable" ]
    cflags += [ "-Wno-unused-parameter" ]

    include_dirs = [
        "lvgl",
    ]

}

先分享到这里,接下来将会带大家一起深入了解它的一些细节要修改的地方!!

©著作权归作者所有,如需转载,请注明出处,否则将追究法律责任
lv_pc_simulator.zip 2.74M 92次下载
lvgl-master.zip 725.23K 27次下载
已于2022-11-28 17:05:20修改
6
收藏 5
回复
举报
4条回复
按时间正序
/
按时间倒序
一口气吃不成胖子
一口气吃不成胖子
已于2022-6-20 16:08:58修改
回复
2022-6-20 16:08:37
mb62b060a02f5df
mb62b060a02f5df

6666666

回复
2022-6-20 19:59:02
mb6242dd7e69f6c
mb6242dd7e69f6c

对TFT显示屏有要求吗?

回复
2022-6-20 19:59:57
一口气吃不成胖子
一口气吃不成胖子 回复了 mb6242dd7e69f6c
对TFT显示屏有要求吗?

支持SPI即可

回复
2022-6-20 20:34:22
回复
    相关推荐