lugl4313820 发表于 2022-3-11 22:58

【平头哥RVB2601创意应用开发】LVGL 水平滚动显示

本帖最后由 lugl4313820 于 2022-3-14 13:12 编辑

<p>&nbsp;<a href="https://bbs.eeworld.com.cn/thread-1195921-1-1.html">【平头哥RVB2601创意应用开发】MP3播放器 - 平头哥RISC-V RVB2601活动专区 - 电子工程世界-论坛 (eeworld.com.cn)</a></p>

<p><a href="https://bbs.eeworld.com.cn/thread-1195791-1-1.html">【平头哥RVB2601创意应用开发】开箱+详细图片分享 - 平头哥RISC-V RVB2601活动专区 - 电子工程世界-论坛 (eeworld.com.cn)</a> &nbsp; &nbsp;</p>

<p>&nbsp; &nbsp; &nbsp;LVGL(轻巧而多功能的图形库)是一个免费的开放源代码图形库,它提供创建具有易于使用的图形元素,精美的视觉效果和低内存占用的嵌入式GUI所需的一切</p>

<p>&nbsp; &nbsp; &nbsp; LVGL的作者是来自匈牙利的Gabor Kiss-Vamosikisvegabor,LVGL用C语言编写,以实现最大的兼容性(与C ++兼容),模拟器可在没有嵌入式硬件的PC上启动嵌入式GUI设计,同时LVGL作为一个图形库,它自带着接近三十多种小工具可以供开发者使用。这些强大的构建块按钮搭配上带有非常丝滑的动画以及可以做到平滑滚动的高级图形,同时兼具着不高的配置要求以及开源属性,显著的优势使得LVGL蔚然成风,成为广大开发者在选择GUI时的第一选择。</p>

<p>&nbsp;<b>主要特性</b></p>

<ul>
        <li data-pid="mgaK21km">强大的构建块,如按钮,图表,列表,滑块,图像等。</li>
        <li data-pid="jIKn9fvK">高级图形动画,抗锯齿,不透明度,平滑滚动</li>
        <li data-pid="dKFWpSp-">各种输入设备,如触摸板、鼠标、键盘、编码器等</li>
        <li data-pid="1RxHt5_-">多语言支持与UTF-8编码</li>
        <li data-pid="ZgRqTo9d">多显示器支持,即使用更多的TFT,单色显示器同时</li>
        <li data-pid="lML8G4X0">完全可定制的图形元素与css类样式</li>
        <li data-pid="K_k3Q4La">硬件独立与任何微控制器或显示器使用</li>
        <li data-pid="HbV6F7_9">可扩展,使用少量内存(64kb Flash, 16kb RAM)</li>
        <li data-pid="3eF6yj0Z">支持操作系统、外部内存和GPU,但不是必需的</li>
        <li data-pid="Xm3nwS8z">单帧缓冲操作,甚至与高级图形效果</li>
        <li data-pid="noN-RgZw">用C编写的最大兼容性(c++兼容)</li>
        <li data-pid="x2p9-sRs">模拟器在没有嵌入式硬件的PC上开始嵌入式GUI设计</li>
        <li data-pid="Go-FuvqS">绑定到MicroPython</li>
        <li data-pid="QMm5afaU">教程,例子,快速GUI设计的主题</li>
        <li data-pid="_GShNoAT">文档可以在线和PDF格式获取</li>
        <li data-pid="gEhfU1jm">麻省理工学院许可下的免费和开源</li>
</ul>

<p>&nbsp; &nbsp; &nbsp;官方提供的ch2601_gui已经给移植好了lvgl。虽然我用原生的spi驱动好了板载的128*64,但是看到lvgl后,感觉这个库非常强大。但是以前没有接触过,所以这几天反复看了一些教程。第一是上B站看视频,我这里感收获最多的是这个:<a href="https://www.bilibili.com/video/BV1Ya411r7K2?p=14">LVGL开源GUI零基础入门课程(韦东山&middot;监制) 教程基于lvgl v8.2版本,课程适配多个平台、多款板子(Linux单片机GUI、littleVGL教程)_哔哩哔哩_bilibili</a>。这个教程我明白demo里面的lable标签是如何初始化和基本的设置。</p>

<p>下面就标签(lable)的显示分享如下:</p>

<p>1、首先要引入头文件:</p>

<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;lvgl.h 这个好比是lvgl的总管吧,好比stm32f10x.h。</p>

<p>&nbsp; &nbsp; &nbsp;lv_label.h 如果要使用lable,就得把这个头文件包含进来。</p>

<p>2、初始化lvgl任务函数:</p>

<pre>
<code>static void gui_lvgl_task(void *arg)
{
    lv_init(); //初始化
    /*Initialize for LittlevGL*/
    oled_init(); //oled的初始、硬件

    gui_label_create();//显示初始图像
    while (1) {
      /* Periodically call the lv_task handler.
         * It could be done in a timer interrupt or an OS task too.*/
      lv_task_handler();
      aos_msleep(5);
      lv_tick_inc(1);
    }
}
</code></pre>

<p>3、标签创建函数:</p>

<pre>
<code>static void gui_label_create(void)
{
    lv_obj_t *label1 = lv_label_create(lv_scr_act(), NULL); //创建lable对象 labe1
    lv_label_set_long_mode(label1, LV_LABEL_LONG_BREAK);   /*显示模式固定*/
        lv_label_set_align(label1, LV_LABEL_ALIGN_CENTER);       /*居中显示*/
        lv_obj_set_pos(label1, 0, 0);                            /*显示的起始坐标*/                  
        lv_obj_set_size(label1, 128, 30);                     /*显示框的大小*/
    lv_label_set_text(label1,"RISC-V\nRVB2601");            /*显示标签的内容*/
    lv_obj_set_width(label1, 128);                        /*设置显示的宽度*/
    lv_obj_align(label1, NULL, LV_ALIGN_IN_TOP_MID, 0, 0);/*靠项端居中显示*/
       
    lv_obj_t * label3 = lv_label_create(lv_scr_act(), NULL);
    lv_label_set_long_mode(label3, LV_LABEL_LONG_SROLL_CIRC);   /*轮动显示*/
    lv_obj_set_width(label3, 150);
    lv_label_set_text(label3, "Hello EEWOLRD,2022-03-11!");
    lv_obj_align(label3, NULL, LV_ALIGN_CENTER, 0, 20);         

}</code></pre>

<p>4、动态显示时间:</p>

<pre>
<code>static void get_time_task(void *arg)
{
        csi_rtc_time_t this_time;
        init_my_rtc();//初始化RTC
        label2 = lv_label_create(lv_scr_act(), NULL); //创建lable对象 labe1
        lv_label_set_long_mode(label2, LV_LABEL_ALIGN_AUTO);   /*显示模式*/
        lv_label_set_align(label2, LV_LABEL_ALIGN_CENTER);       /*Center aligned lines*/
        lv_obj_set_pos(label2,0,26);
        lv_obj_set_width(label2, 128);
        //lv_label_set_text_fmt(label2,"time:%d",t);
        lv_obj_align(label2, NULL, LV_ALIGN_CENTER, 0, 5);
        while(1){
                csi_rtc_get_time(&amp;g_rtc, &amp;this_time);//获取时间
                aos_msleep(1);
      //动态显示时间
                lv_label_set_text_fmt(label2,"%d-%02d-%02d %02d:%02d:%02d",this_time.tm_year+1900,this_time.tm_mon,this_time.tm_mday,this_time.tm_hour,this_time.tm_min,this_time.tm_sec);
                aos_msleep(5);
                lv_tick_inc(1);
        }
}</code></pre>

<p>5、main函数创建两个任 一个为显示滚动标签,一个为显示实时时间:</p>

<pre>
<code>int main(void)
{
    board_yoc_init();
    aos_task_new("gui", gui_lvgl_task, NULL, 10 * 1024); //显示标签,平行移动标签
        aos_task_new("rtc",get_time_task,NULL,10*1024);      //显示实时RTC时间
    return 0;
}</code></pre>

<p>RVB260的功能强大,LVGL也功能强大,组合起来功能更加强大,我也是刚接触不久,只能说碰到皮毛,后面还需要继续努力的学习。也希望跟坛友们多交流学习。</p>

<p><iframe allowfullscreen="true" frameborder="0" height="510" src="https://training.eeworld.com.cn/shareOpenCourseAPI?isauto=true&amp;lessonid=32771" style="background:#eee;margin-bottom:10px;" width="700"></iframe><br />
&nbsp;</p>

littleshrimp 发表于 2022-3-12 10:56

<p>这个不错</p>

nmg 发表于 2022-3-14 10:00

<p>其他可以也要搞基于lvgl搞作品的可以看过来</p>

<p>&nbsp;</p>

<p>&nbsp;</p>

<p>PS:把你的标签换成了&ldquo; 经验分享&rdquo;,&ldquo;作品提交&rdquo;是最后提交完整作品的时候用的</p>
页: [1]
查看完整版本: 【平头哥RVB2601创意应用开发】LVGL 水平滚动显示