《lvgl基础学习 —— 页面切换》

1.页面切换

　　Screen（屏幕）是 LVGL 中的“页面根节点”

• 每个 screen 是一个 独立的 UI 树

• 同一时间 只有一个 screen 是激活显示的

Screen A (Home)
Screen B (Settings)
Screen C (Info)

　　页面切换 = 切换当前激活的screen

Screen的本质：

lv_obj_t *screen = lv_obj_create(NULL);

注意这点：

• parent = NULL

• 说明它是“顶级对象”

　　screen 不是普通 container

页面切换的基础API

创建screen：

lv_obj_t *scr = lv_obj_create(NULL);

加载screen（切换页面）：

lv_scr_load(scr);

　　瞬间切换，无动画。

 

demo：两个页面 + 按钮切换

定义两个screen（全局或static）

static lv_obj_t *scr_home;
static lv_obj_t *scr_settings;

创建Home界面

static void goto_settings_cb(lv_event_t *e)
{lv_scr_load(scr_settings);
}void create_home_screen(void)
{scr_home = lv_obj_create(NULL);lv_obj_t *label = lv_label_create(scr_home);lv_label_set_text(label, "Home Screen");lv_obj_align(label, LV_ALIGN_TOP_MID, 0, 20);lv_obj_t *btn = lv_btn_create(scr_home);lv_obj_center(btn);lv_obj_add_event_cb(btn, goto_settings_cb,LV_EVENT_CLICKED, NULL);lv_obj_t *btn_label = lv_label_create(btn);lv_label_set_text(btn_label, "Go Settings");lv_obj_center(btn_label);
}

创建setting界面

static void goto_home_cb(lv_event_t *e)
{lv_scr_load(scr_home);
}void create_settings_screen(void)
{scr_settings = lv_obj_create(NULL);lv_obj_t *label = lv_label_create(scr_settings);lv_label_set_text(label, "Settings Screen");lv_obj_align(label, LV_ALIGN_TOP_MID, 0, 20);lv_obj_t *btn = lv_btn_create(scr_settings);lv_obj_center(btn);lv_obj_add_event_cb(btn, goto_home_cb,LV_EVENT_CLICKED, NULL);lv_obj_t *btn_label = lv_label_create(btn);lv_label_set_text(btn_label, "Back Home");lv_obj_center(btn_label);
}

在 main() 里初始化并加载首页

create_home_screen();
create_settings_screen();lv_scr_load(scr_home);