LittlevGL 切换界面的演示

作为初学者都会遇到如何切换界面的问题,今天在这里就跟大家演示下如何切换界面。

其实 lvgl 切换界面不是很难,只需要下面几行代码即可实现:

lv_obj_t* btn1,* btn2;
lv_obj_t* current_app_obj_user=NULL;
#define LV_DESKTOP  lv_disp_get_scr_act(NULL)

/**********************
*      MACROS
**********************/

static void btn_event_handler(lv_obj_t * obj, lv_event_t event)
{
    lv_obj_t* parent_menu;
    static lv_style_t style_menu;
    if (event == LV_EVENT_CLICKED) {
        if (obj == btn1) {
            printf("Btn1 Clicked\n");
            if (current_app_obj_user == NULL) {
                current_app_obj_user = lv_obj_create(LV_DESKTOP, NULL);
                lv_obj_set_size(current_app_obj_user, LV_HOR_RES_MAX, LV_VER_RES_MAX);
                parent_menu = current_app_obj_user;
                /* 将桌面的背景颜色设置为其他颜色 */
                lv_style_copy(&style_menu, &lv_style_plain);
                style_menu.body.main_color = LV_COLOR_ORANGE;
                style_menu.body.grad_color = style_menu.body.main_color;
                lv_obj_set_style(parent_menu, &style_menu);

                lv_obj_t* lable = lv_label_create(parent_menu, NULL);
                lv_label_set_text(lable, "this is menu1!");
                lv_obj_align(lable, NULL, LV_ALIGN_CENTER, 0, -10);
                btn2 = lv_btn_create(parent_menu, NULL);
                lv_obj_t* label_btn = lv_label_create(btn2, NULL);
                lv_label_set_text(label_btn, "Back");
                lv_obj_align(btn2, lable, LV_ALIGN_OUT_BOTTOM_MID, 0, 20);
                lv_obj_set_event_cb(btn2, btn_event_handler);
            }
        }
        else if (obj == btn2) {
            lv_obj_del(current_app_obj_user);
            current_app_obj_user = NULL;
        }
    }
}

lv_obj_t* desktop = lv_obj_create(lv_disp_get_scr_act(NULL), NULL);
    lv_obj_set_size(desktop, LV_HOR_RES_MAX, LV_VER_RES_MAX);
    lv_obj_t* lable = lv_label_create(desktop, NULL);
    lv_label_set_text(lable, "hello world!");
    lv_obj_align(lable, NULL, LV_ALIGN_CENTER, 0, 0);
    btn1 = lv_btn_create(desktop, NULL);
    lv_obj_t *label_btn = lv_label_create(btn1, NULL);
    lv_label_set_text(label_btn, "Menu1");
    lv_obj_align(btn1, lable, LV_ALIGN_OUT_BOTTOM_MID, 0, 20);
    lv_obj_set_event_cb(btn1, btn_event_handler);

我们在main界面定义一个 label和 按钮 btn1,通过点击 Menu1 来切换到界面1,再点击界面1 Back按钮就返回了。

 

 

 

  • 6
    点赞
  • 57
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
下面是一个使用 LittlevGL 库的按键屏幕切换流程的示例程序: ```c #include <lvgl/lvgl.h> /* 定义屏幕 ID */ enum { SCREEN_1, SCREEN_2, SCREEN_3 }; /* 定义控件指针 */ static lv_obj_t *btn1; static lv_obj_t *btn2; static lv_obj_t *btn3; static lv_obj_t *label1; static lv_obj_t *label2; static lv_obj_t *label3; /* 按钮回调函数 */ static void btn_click_action(lv_obj_t *obj, lv_event_t event) { if (event == LV_EVENT_CLICKED) { /* 根据按钮 ID 切换到相应屏幕 */ if (obj == btn1) { lv_scr_load(SCREEN_1); } else if (obj == btn2) { lv_scr_load(SCREEN_2); } else if (obj == btn3) { lv_scr_load(SCREEN_3); } } } /* 创建屏幕和控件 */ void create_screen(void) { /* 创建屏幕 1 */ lv_obj_t *scr1 = lv_obj_create(NULL, NULL); lv_scr_load(scr1); /* 创建控件 */ label1 = lv_label_create(scr1, NULL); lv_label_set_text(label1, "Screen 1"); lv_obj_align(label1, NULL, LV_ALIGN_CENTER, 0, 0); /* 创建屏幕 2 */ lv_obj_t *scr2 = lv_obj_create(NULL, NULL); /* 创建控件 */ label2 = lv_label_create(scr2, NULL); lv_label_set_text(label2, "Screen 2"); lv_obj_align(label2, NULL, LV_ALIGN_CENTER, 0, 0); /* 创建屏幕 3 */ lv_obj_t *scr3 = lv_obj_create(NULL, NULL); /* 创建控件 */ label3 = lv_label_create(scr3, NULL); lv_label_set_text(label3, "Screen 3"); lv_obj_align(label3, NULL, LV_ALIGN_CENTER, 0, 0); /* 创建按钮 */ btn1 = lv_btn_create(scr1, NULL); lv_obj_set_event_cb(btn1, btn_click_action); lv_obj_align(btn1, NULL, LV_ALIGN_IN_BOTTOM_MID, 0, -20); lv_obj_t *label_btn1 = lv_label_create(btn1, NULL); lv_label_set_text(label_btn1, "Go to Screen 2"); btn2 = lv_btn_create(scr2, NULL); lv_obj_set_event_cb(btn2, btn_click_action); lv_obj_align(btn2, NULL, LV_ALIGN_IN_BOTTOM_MID, 0, -20); lv_obj_t *label_btn2 = lv_label_create(btn2, NULL); lv_label_set_text(label_btn2, "Go to Screen 3"); btn3 = lv_btn_create(scr3, NULL); lv_obj_set_event_cb(btn3, btn_click_action); lv_obj_align(btn3, NULL, LV_ALIGN_IN_BOTTOM_MID, 0, -20); lv_obj_t *label_btn3 = lv_label_create(btn3, NULL); lv_label_set_text(label_btn3, "Go to Screen 1"); } int main(void) { lv_init(); /* 创建屏幕和控件 */ create_screen(); while (1) { lv_task_handler(); } return 0; } ``` 在这个例程中,我们创建了三个屏幕和三个按钮。每个按钮都关联到一个回调函数,当用户点击按钮时,通过调用 `lv_scr_load()` 函数来切换到相应的屏幕。在每个屏幕中,我们创建了一个标签控件来显示屏幕内容。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值