首页 > 其他分享 >NXP GUI-Guider,lvgl的好伴侣 拖曳式设计并自动生成代码,而且还可以当模拟器练习代码,如何使用gui guider自定义代码

NXP GUI-Guider,lvgl的好伴侣 拖曳式设计并自动生成代码,而且还可以当模拟器练习代码,如何使用gui guider自定义代码

时间:2022-08-20 09:58:47浏览次数:94  
标签:lvgl obj 自定义 好伴侣 代码 custom lv btn label

GUI Guider是恩智浦提供的用户友好型图形用户界面开发工具,可通过开源LVGL图形库快速开发高品质的显示。GUI Guider的拖放编辑器可以轻松利用LVGL的众多特性,如小部件、动画和样式来创建GUI,而只需少量代码或根本无需任何代码。

下载地址   GUI Guider_NXP 半导体   可能需要注册nxp的账号  目前最新的是1.04   。运行需要安装jave环境 jre  。里边自带了mingw编译器使用sdl驱动用来跑模拟器,如果使用8.3的lvgl库还可以导出micropython文件。这个比lvgl官方的SquareLine Studio 好在没有免费账号屏幕数跟wigt数量限制,并且还有中文界面  可以改显示语言  主题  调整屏幕刷新率可以提高帧率 ,其实是每一帧的渲染时间  修改过lv-conf。h的就明白

 

 

 

 能看出来界面是基于elctron的,代码是基于java加模板生成的

还可以很简单的给控件加事件  甚至都不用写一行代码    下图里给按钮的clicked 添加事件 使按键自己隐藏

 

 

   更好玩的是可以用这个模拟器来练习lvgl库里的例程  。先看工程导出的文件夹

 

custom是自定义的程序,generated就是自动生成的代码,包含gui设计与事件,这里不要动,每次点运行模拟器都会重新生成代码。

 

 

 

lvgl-simulator是模拟的用的代码,可以参考里边的main.来移植到别的硬件,观察他的初始化

   /*Create a GUI-Guider app  创造app */
    setup_ui(&guider_ui);//设计小部件的ui布局
    events_init(&guider_ui);//设置小部件的事件
    custom_init(&guider_ui);//运行自定义的程序
    

 

 我们要测试代码片段的话就在 custom文件夹里修改   这里做个小测试,找到从github上拖下来的lvgl库里的例子 在这个地方

 

 

 

 把回调函数跟测试函数拷贝到 刚才的guiguider的 custom.c里  就像这样

// SPDX-License-Identifier: MIT
// Copyright 2020 NXP

/**
 * @file custom.c
 *
 */

/*********************
 *      INCLUDES
 *********************/
#include <stdio.h>
#include "lvgl.h"
#include "custom.h"

/*********************
 *      DEFINES
 *********************/

/**********************
 *      TYPEDEFS
 **********************/

/**********************
 *  STATIC PROTOTYPES
 **********************/

/**********************
 *  STATIC VARIABLES
 **********************/

/**
 * Create a demo application
 */
 
static void event_cb(lv_event_t * e)//事件声明
{
    LV_LOG_USER("Clicked");

    static uint32_t cnt = 1;
    lv_obj_t * btn = lv_event_get_target(e);
    lv_obj_t * label = lv_obj_get_child(btn, 0);
    lv_label_set_text_fmt(label, "%"LV_PRIu32, cnt);
    cnt++;
}


void lv_example_event_1(void)  //创建一个带标签的按钮
{
    lv_obj_t * btn = lv_btn_create(lv_scr_act());
    lv_obj_set_size(btn, 100, 50);
    lv_obj_center(btn);
    lv_obj_add_event_cb(btn, event_cb, LV_EVENT_CLICKED, NULL);//把刚才的回调函数添加到按钮上

    lv_obj_t * label = lv_label_create(btn);
    lv_label_set_text(label, "Click me!");
    lv_obj_center(label);
}

void custom_init(lv_ui *ui)
{



    lv_example_event_1();    在custom-init里运行自定义函数,主要不要把回调函数写到custom-init里,会导致无法运行
}

    

 

保存文件,点guider的绿色三角按键运行。可以看到除了我们在guider里设计的按钮,还出现了自定义的按钮。点击这个按钮上边的数字会加1.这比每次测试都要烧录单片机快多了

 

标签:lvgl,obj,自定义,好伴侣,代码,custom,lv,btn,label
From: https://www.cnblogs.com/kyo413/p/16607189.html

相关文章