10

#夏日挑战赛#移植littleVGL库到OpenHarmony过程分享（一）-开源基础软件社区-51CTO.CO...

 1 year ago
source link: https://ost.51cto.com/posts/13963
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

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

移植轻量级通用型图形库到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: 大约 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_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 接着还要在 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 3次下载
lvgl-master.zip 725.23K 4次下载
已于2022-6-17 20:36:45修改

report

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK