lvgl图形化设计工具GUI Guider结合使用

前言

  1. 上篇博客整合了lvgl到项目中，采用的是自己编写源码的方式，实现了个简单的界面。
  2. 实际过程中一般情况开发界面都借助设计工具，这里使用的是gui guider来进行示例记录

项目结构（生成代码路径依然放到项目路径下）

在这里插入图片描述

CMakeLists配置(改为引用LVGL的源码)

file(GLOB_RECURSE EmWinSrc
        EmWin/Source/*.c
        EmWin/Resource/*.c
)


file(GLOB_RECURSE LVGL_SRC

        LVGL/Code/*.c
)

set(LVGL_INC
        LVGL/Code/custom
        LVGL/Code/generated
        LVGL/Code/generated/guider_fonts
        LVGL/Code/generated/guider_customer_fonts

)


target_sources(${PROJECT_NAME}.elf
        PRIVATE
        ${LVGL_SRC}

)

target_include_directories(${PROJECT_NAME}.elf
        PUBLIC
        ${LVGL_INC}
)

LVGL任务线程调整

在这里插入图片描述

/*
 * Copyright (c) 2024-2024，shchl
 *
 * SPDX-License-Identifier: Apache-2.0
 *
 * Change Logs:
 * Date           Author       Notes
 * 2024-4-20     shchl   first version
 */
#include "includes.h"
#include "lv_api_map.h"



#if 1

#define APP_TASK_GUI_LVGL_PRIO 15
#define APP_TASK_GUI_LVGL_STK_SIZE 4096


/*
*******************************************************************************************************
*                               外部引入变量
*******************************************************************************************************
*/

/*
*******************************************************************************************************
*                               变量
*******************************************************************************************************
*/
TX_THREAD gui_lvgl_thread;
VOID *gui_thread_stack_area;
/*
*********************************************************************************************************
*                                       静态全局变量
*********************************************************************************************************
*/



/*
*********************************************************************************************************
*                                      函数声明
*********************************************************************************************************
*/
static VOID gui_lvgl_thread_entry(ULONG input);

/*
*********************************************************************************************************
*                                      外部函数
*********************************************************************************************************
*/
/**
 * @brief cpu 状态任务
 * @param first_thread 第一个启动的任务线程首地址
 */
int tx_task_gui_lvgl_create() {
    UINT status;
    gui_thread_stack_area = app_malloc(APP_TASK_GUI_LVGL_STK_SIZE);

    if(!gui_thread_stack_area){

        tx_printf("app malloc error\r\n");
        return -1;
    }

    status = tx_thread_create(&gui_lvgl_thread,              /* 任务控制块地址 */
                              "gui lvgl thread",               /* 任务名 */
                              gui_lvgl_thread_entry,                  /* 启动任务函数地址 */
                              0,                             /* 传递给任务的参数 */
                              gui_thread_stack_area,            /* 堆栈基地址 */
                              APP_TASK_GUI_LVGL_STK_SIZE,    /* 堆栈空间大小 */
                              APP_TASK_GUI_LVGL_PRIO,        /* 任务优先级*/
                              APP_TASK_GUI_LVGL_PRIO,        /* 任务抢占阀值 */
                              TX_NO_TIME_SLICE,               /* 不开启时间片 */
                              TX_AUTO_START);                 /* 创建后立即启动 */
    if (status) {
        tx_printf("create error:%d\r\n",status);
    }

    return TX_SUCCESS;
}

TX_THREAD_EXPORT(tx_task_gui_lvgl_create);

/*
*********************************************************************************************************
*                                      内部函数
*********************************************************************************************************
*/
#include "gui_guider.h"
#include "events_init.h"
lv_ui guider_ui;

static VOID gui_lvgl_thread_entry(ULONG input) {
    setup_ui(&guider_ui);
    events_init(&guider_ui);

    while (1) {
        lv_task_handler();
        tx_thread_sleep(5);
    }

}

#endif

测试界面

在这里插入图片描述

通过软件添加3个事件

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

代码事件中添加日志

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述在这里插入图片描述

将移动代码的获取新值的回调函数替换成自己的（原有的基础上加个输出）

/*
 * Copyright 2024 NXP
 * SPDX-License-Identifier: MIT
 * The auto-generated can only be used on NXP devices
 */

#include "events_init.h"
#include <stdio.h>
#include "lvgl.h"

void events_init(lv_ui *ui) {
}

int32_t lv_anim_path_ease_in2(const lv_anim_t *a);

static void screen_1_btn_1_event_handler(lv_event_t *e) {
    lv_event_code_t code = lv_event_get_code(e);
    lv_anim_t screen_1_led_1_anim_x;
    lv_anim_t screen_1_led_1_anim_y;
    switch (code) {
        case LV_EVENT_CLICKED: {
            lv_obj_set_style_bg_color(guider_ui.screen_1_spangroup_1, lv_color_make(0xd2, 0x1e, 0x1e), LV_PART_MAIN);
            lv_obj_set_pos(guider_ui.screen_1_led_1, 0, 0);

            //Write animation: screen_1_led_1move in x direction
            lv_anim_init(&screen_1_led_1_anim_x);
            lv_anim_set_var(&screen_1_led_1_anim_x, guider_ui.screen_1_led_1);
            lv_anim_set_time(&screen_1_led_1_anim_x, 10000);
            lv_anim_set_exec_cb(&screen_1_led_1_anim_x, (lv_anim_exec_xcb_t) lv_obj_set_x);
            lv_anim_set_values(&screen_1_led_1_anim_x, lv_obj_get_x(guider_ui.screen_1_led_1), 0);
            lv_anim_set_path_cb(&screen_1_led_1_anim_x, &lv_anim_path_ease_in2);
            lv_anim_start(&screen_1_led_1_anim_x);

            //Write animation: screen_1_led_1move in y direction
            lv_anim_init(&screen_1_led_1_anim_y);
            lv_anim_set_var(&screen_1_led_1_anim_y, guider_ui.screen_1_led_1);
            lv_anim_set_time(&screen_1_led_1_anim_y, 10000);
            lv_anim_set_exec_cb(&screen_1_led_1_anim_y, (lv_anim_exec_xcb_t) lv_obj_set_y);
            lv_anim_set_values(&screen_1_led_1_anim_y, lv_obj_get_y(guider_ui.screen_1_led_1), 0);
            lv_anim_set_path_cb(&screen_1_led_1_anim_y, &lv_anim_path_ease_in2);
            lv_anim_start(&screen_1_led_1_anim_y);

            logInfo("screen_1_btn_1_event_handler");
        }
            break;
        default:
            break;
    }
}


static void screen_1_btn_2_event_handler(lv_event_t *e) {
    lv_event_code_t code = lv_event_get_code(e);
    lv_anim_t screen_1_led_1_anim_x;
    lv_anim_t screen_1_led_1_anim_y;
    switch (code) {
        case LV_EVENT_CLICKED: {
            lv_obj_set_pos(guider_ui.screen_1_led_1, 0, 0);

            //Write animation: screen_1_led_1move in x direction
            lv_anim_init(&screen_1_led_1_anim_x);
            lv_anim_set_var(&screen_1_led_1_anim_x, guider_ui.screen_1_led_1);
            lv_anim_set_time(&screen_1_led_1_anim_x, 10000);
            lv_anim_set_exec_cb(&screen_1_led_1_anim_x, (lv_anim_exec_xcb_t) lv_obj_set_x);
            lv_anim_set_values(&screen_1_led_1_anim_x, lv_obj_get_x(guider_ui.screen_1_led_1), 320);
            lv_anim_set_path_cb(&screen_1_led_1_anim_x, &lv_anim_path_ease_in2);
            lv_anim_start(&screen_1_led_1_anim_x);

            //Write animation: screen_1_led_1move in y direction
            lv_anim_init(&screen_1_led_1_anim_y);
            lv_anim_set_var(&screen_1_led_1_anim_y, guider_ui.screen_1_led_1);
            lv_anim_set_time(&screen_1_led_1_anim_y, 10000);
            lv_anim_set_exec_cb(&screen_1_led_1_anim_y, (lv_anim_exec_xcb_t) lv_obj_set_y);
            lv_anim_set_values(&screen_1_led_1_anim_y, lv_obj_get_y(guider_ui.screen_1_led_1), 480);
            lv_anim_set_path_cb(&screen_1_led_1_anim_y, &lv_anim_path_ease_in2);
            lv_anim_start(&screen_1_led_1_anim_y);

            tx_printf("screen_1_btn_2_event_handler\r\n");
        }
            break;
        default:
            break;
    }
}

// 自定义 lv_anim_path_ease_in
int32_t lv_anim_path_ease_in2(const lv_anim_t *a) {

    static int cnt = 0;
    if (cnt > 20) { // 刷新20次,打印一次,方便调试
        lv_coord_t x = lv_obj_get_x(guider_ui.screen_1_led_1);
        lv_coord_t y = lv_obj_get_y(guider_ui.screen_1_led_1);
        logInfo("(x,y)-->(%d,%d)", x, y);
        cnt = 0;
    } else {
        cnt += 1;
    }



    /*Calculate the current step*/
    uint32_t t = lv_map(a->act_time, 0, a->time, 0, LV_BEZIER_VAL_MAX);
    int32_t step = lv_bezier3(t, 0, 50, 100, LV_BEZIER_VAL_MAX);

    int32_t new_value;
    new_value = step * (a->end_value - a->start_value);
    new_value = new_value >> LV_BEZIER_VAL_SHIFT;
    new_value += a->start_value;

    return new_value;
}

void events_init_screen_1(lv_ui *ui) {
    lv_obj_add_event_cb(ui->screen_1_btn_1, screen_1_btn_1_event_handler, LV_EVENT_ALL, NULL);
    lv_obj_add_event_cb(ui->screen_1_btn_2, screen_1_btn_2_event_handler, LV_EVENT_ALL, NULL);
}

在这里插入图片描述

总结

  1. gui guider 基本上不做太复杂的逻辑设计，够用了。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：/a/564344.html

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

知识图谱的起源与发展

知识图谱的起源与发展

文章目录 知识图谱的发展历史知识图谱的重要性知识图谱与Ontology、语义网络之间的区别知识图谱的定义 知识图谱的发展历史 知识图谱始于20世纪50年代&#xff0c;至今大致分为三个发展阶段&#xff1a;第一阶段 &#xff08;1955年—1977年&#xff09;是知识图谱的起源阶段&a…
阅读更多...
ThingsBoard教程（二十九）：详细讲解在tb平台下 http协议下的客户端rpc，服务的rpc的使用

ThingsBoard教程（二十九）：详细讲解在tb平台下 http协议下的客户端rpc，服务的rpc的使用

客户端rpc 先来说一下简单的客户端rpc， 客户端发起rpc请求，只需要使用post方法调用该接口即可以 http://host:port/api/v1/$ACCESS_TOKEN/rpc请求路径中间的参数 ACCESS_TOKEN 必须是设备的访问令牌。 请求携带的参数如下，二个参数method和params {"method": …
阅读更多...
uniapp H5的弹窗滚动穿透解决

uniapp H5的弹窗滚动穿透解决

目录 方案一 事件修饰符 overscroll-behavior 修饰符 overscroll-behavior 属性 看个案例 兼容 方案二 overflow&#xff1a;hiden 有一层遮罩蒙层覆盖在body上时&#xff0c;当我们滚动遮罩层&#xff0c;它下面的内容也会跟着一起滚动&#xff0c;看起来好像是上面的…
阅读更多...
在线json格式化编辑器--在线查看json解析视图并按节点排序，查看，编辑，并可导入导出json

在线json格式化编辑器--在线查看json解析视图并按节点排序，查看，编辑，并可导入导出json

在线JSON编辑器--视图查看器&节点筛选&节点编辑插入&json导入导出
阅读更多...
ChatGPT研究论文提示词集合4-【结论】、【论文写作】和【审稿与修订】

ChatGPT研究论文提示词集合4-【结论】、【论文写作】和【审稿与修订】

点击下方▼▼▼▼链接直达AIPaperPass &#xff01; AIPaperPass - AI论文写作指导平台 目录 1.结论 2.论文写作 3.评审和修订 4.书籍介绍 AIPaperPass智能论文写作平台 近期小编按照学术论文的流程&#xff0c;精心准备一套学术研究各个流程的提示词集合。总共14个步骤…
阅读更多...
Numpy方法总结（二）

Numpy方法总结（二）

一. 高级索引 相比于基本索引&#xff0c;高级索引可以访问到数组中的任意元素&#xff0c;并且可以用来对数组进行复杂的操作和修改。 1.整数数组索引 整数数组索引是指使用一个数组来访问另一个数组的元素。这个数组中的每个元素都是目标数组中某个维度上的索引值。 示例…
阅读更多...
Ghost Buster Pro for Mac：强大的系统优化工具

Ghost Buster Pro for Mac：强大的系统优化工具

Ghost Buster Pro for Mac是一款功能强大的系统优化工具&#xff0c;专为Mac用户设计&#xff0c;旨在提供全方位的系统清理、优化和维护服务。 Ghost Buster Pro for Mac v3.2.5激活版下载 这款软件拥有出色的垃圾清理能力&#xff0c;能够深度扫描并清除Mac上的无效目录、文件…
阅读更多...
《从零开始的Java世界》07常用类与基础API

《从零开始的Java世界》07常用类与基础API

《从零开始的Java世界》系列主要讲解Javase部分&#xff0c;从最简单的程序设计到面向对象编程&#xff0c;再到异常处理、常用API的使用&#xff0c;最后到注解、反射&#xff0c;涵盖Java基础所需的所有知识点。学习者应该从学会如何使用&#xff0c;到知道其实现原理全方位式…
阅读更多...
尾矿库安全监测：仪器埋设与维护的关键要求

尾矿库安全监测：仪器埋设与维护的关键要求

尾矿库作为矿业生产的重要组成部分&#xff0c;其安全运营对于保障人员生命安全和环境保护具有至关重要的意义。为了确保尾矿库的安全运行&#xff0c;及时发现潜在的安全隐患&#xff0c;必须采取有效的安全监测措施。本文将重点探讨尾矿库安全监测仪器的埋设及维护要求。 一、…
阅读更多...
​「Python绘图」绘制皮卡丘

​「Python绘图」绘制皮卡丘

python 绘制皮卡丘 一、预期结果 二、关键代码 import turtle print("开始绘制皮卡丘") def getPosition(x, y):turtle.setx(x)turtle.sety(y)print(x, y)class Pikachu:def __init__(self):self.t turtle.Turtle()t self.tt.pensize(3)t.speed(190)t.ondrag(getP…
阅读更多...
Linux命令接着学习

Linux命令接着学习

which命令&#xff0c;找到各种命令程序所处在的位置 语法&#xff1a;which查找的命令 那么对于我们想查找其他类型文件所在的位置&#xff0c;我们可以用到find命令 find命令 选项为-name&#xff0c;表示按照文件名进行查找 find命令中通配符 find命令和前面rm命令一样&…
阅读更多...
Linux及tmux、vim常用命令

Linux及tmux、vim常用命令

Linux 关于Linux的简介、诞生、迭代&#xff0c;大家可以去网上查一查&#xff0c;这里不多做赘述了 Linux文件类型 非常重要的文件类型有: 普通文件&#xff0c;目录文件&#xff0c;链接文件&#xff0c;设备文件&#xff0c;管道文件&#xff0c;Socket 套接字文件 等。 …
阅读更多...
2024团体设计天梯赛之L1-101 别再来这么多猫娘了

2024团体设计天梯赛之L1-101 别再来这么多猫娘了

c语言中的小小白-CSDN博客c语言中的小小白关注算法,c,c语言,贪心算法,链表,mysql,动态规划,后端,线性回归,数据结构,排序算法领域.https://blog.csdn.net/bhbcdxb123?spm1001.2014.3001.5343 给大家分享一句我很喜欢我话&#xff1a; 知不足而奋进&#xff0c;望远山而前行&am…
阅读更多...
D咖饮品机器人惊艳亮相：智能硬件改变生活习惯

D咖饮品机器人惊艳亮相：智能硬件改变生活习惯

在当今快节奏的生活中&#xff0c;人们对于便捷、高效的需求日益增长&#xff0c;智能硬件应运而生&#xff0c;其中饮品机器人作为一种新型的智能设备&#xff0c;正在以惊艳的姿态亮相于人们的生活中&#xff0c;为人们带来了全新的消费体验&#xff0c;改变着大众的生活习惯…
阅读更多...
CV算法工程师的LLM日志（5）Mixture-of-depths——transformers改进结构 【15分钟代码和原理速通】

CV算法工程师的LLM日志（5）Mixture-of-depths——transformers改进结构 【15分钟代码和原理速通】

前言 简而言之&#xff0c;这是google对transformer一些改进设计&#xff0c;如果这个有效性能够证明并普及&#xff0c;那么下一个大模型的transformer范式就是这个了&#xff0c;当然同时也存在mamba和transformer的jamba崛起&#xff0c;不过现在主流还是transformer&#…
阅读更多...
nlp 自然语言处理的dataset数据库积累

nlp 自然语言处理的dataset数据库积累

下面的这个和 entity recognition有关的。 Weights & Biases
阅读更多...
巧用波卡生态优势，Mythical Games 引领 Web3 游戏新航向

巧用波卡生态优势，Mythical Games 引领 Web3 游戏新航向

Polkadot 对创新、安全和治理的承诺为 Mythical Games 提供了极大的发展价值。这个链上生态不仅将支持 Mythical Games 成长发展&#xff0c;还将帮助其他 Mythos 合作伙伴来壮大建设项目。 —— Mythical Games 创始人兼首席执行官 John Linden 近期 Web3 游戏行业又有新动向&…
阅读更多...
《C语言深度解剖》(8)：一篇文章彻底学会Visual Studio 调试技巧，新手必看!

《C语言深度解剖》(8)：一篇文章彻底学会Visual Studio 调试技巧，新手必看!

&#x1f921;博客主页&#xff1a;醉竺 &#x1f970;本文专栏&#xff1a;《C语言深度解剖》 &#x1f63b;欢迎关注&#xff1a;感谢大家的点赞评论关注&#xff0c;祝您学有所成&#xff01; ✨✨&#x1f49c;&#x1f49b;想要学习更多数据结构与算法点击专栏链接查看&am…
阅读更多...
创建电商产品说明书的这些雷，你踩了几条

创建电商产品说明书的这些雷，你踩了几条

现如今电商的流行&#xff0c;让电商产品说明书不仅是产品的“身份证”&#xff0c;更是商家与消费者沟通的桥梁。但是&#xff0c;在创建电商产品说明书时&#xff0c;稍不注意就可能踩到“雷区”&#xff0c;给消费者留下不好的印象&#xff0c;甚至影响销量。今天&#xff0…
阅读更多...
【计算机2区】毕业快刊 —— 非黑！非预警！各指标优异！

【计算机2区】毕业快刊 —— 非黑！非预警！各指标优异！

No.1 工程综合类SCIE 【期刊简介】IF&#xff1a;6.0-7.0&#xff0c;JCR1区&#xff0c;中科院2区 【版面类型】纯正刊&#xff0c;仅10篇版面 【自引率】13.30%&#xff08;位于安全阈值内&#xff09; 【年发文量】400篇左右&#xff08;发文量稳定&#xff09; 【国人…
阅读更多...
最新文章

Copyright @ 2022~2023