开源UI框架LVGL——实现页面切换例程

#include "lvgl.h"

static lv_obj_t * page1;
static lv_obj_t * page2;

static void page1_gesture_event_handler(lv_event_t event)
{
    if (event.code == LV_EVENT_CLICKED) {
       lv_scr_load_anim(page2, LV_SCR_LOAD_ANIM_OVER_LEFT, 300, 0, false);
    }
}


void create_page1(void)
{
    // 创建页面1的内容,例如按钮、标签等
    page1 = lv_obj_create(NULL, NULL);
    lv_obj_set_size(page1, LV_HOR_RES, LV_VER_RES);

    lv_obj_t * btn1 = lv_btn_create(page1, NULL);
    lv_obj_set_pos(btn1, (LV_HOR_RES - 100) / 2, (LV_VER_RES - 50) / 2);
    lv_obj_set_size(btn1, 100, 50);

    lv_obj_t * label1 = lv_label_create(btn1, NULL);
    lv_label_set_text(label1, "Page 2");

    lv_obj_add_event_cb(btn1, page1_gesture_event_handler, LV_EVENT_ALL, NULL);
}


static void page2_gesture_event_handler(lv_event_t event)
{
    if (event.code == LV_EVENT_CLICKED) {
       lv_scr_load_anim(page1, LV_SCR_LOAD_ANIM_OVER_RIGHT, 300, 0, false);
    }
}


void create_page2(void)
{
    // 创建页面2的内容,例如表格、列表等
    page2 = lv_obj_create(NULL, NULL);
    lv_obj_set_size(page2, LV_HOR_RES, LV_VER_RES);

    lv_obj_t * table1 = lv_table_create(page2, NULL);
    lv_table_set_col_cnt(table1, 3);
    lv_table_set_row_cnt(table1, 5);

    lv_obj_t * label2 = lv_label_create(page2, NULL);
    lv_label_set_text(label2, "Page 1");

    lv_obj_add_event_cb(label2, page2_gesture_event_handler, LV_EVENT_ALL, NULL);
}

int main(void)
{
    // 初始化LVGL库
    lv_init();

    create_page1();
    create_page2();

    // 显示页面1
    lv_scr_load(page1);

    while (1) {
        lv_task_handler();
    }

    return 0;
}

解释:

  1. 在create_page1()函数中,创建页面1的内容,并添加按钮事件回调函数。当按钮被点击时,使用lv_scr_load_anim()函数切换到页面2。
  2. 在create_page2()函数中,创建页面2的内容,并添加标签事件回调函数。当标签被点击时,使用lv_scr_load_anim()函数切换回页面1。
  3. 在main()函数中,初始化LVGL库并创建两个页面。然后使用lv_scr_load()函数显示页面1,并在while循环中持续处理LVGL任务。

需要注意的是,在实际应用中,可能需要根据具体需求添加更多的页面和交互逻辑。

你可能感兴趣的:(LVGL,ui,开源,LVGL)