Ink-Board/ink-board
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Re implement display

Browse Source
This commit is contained in:
GW_MC
2026-01-26 18:17:39 +08:00
parent abe840b65d
commit 30dfdd630a
12 changed files with 1780 additions and 849 deletions
Download Patch File Download Diff File Expand all files Collapse all files

138
main/ui/root_layout.cpp
View File

@@ -14,6 +14,9 @@
#define NAV_BAR_HEIGHT 50
#define APP_CONTAINER_HEIGHT (DISPLAY_HEIGHT - HEADER_HEIGHT - NAV_BAR_HEIGHT)
// forward-declare local event callback
static void on_home_button_clicked(lv_event_t* event);
RootLayout::RootLayout(UIHandler* ui_handler)
: _ui_handler(ui_handler) { }
@@ -48,35 +51,76 @@ esp_err_t RootLayout::deinit(void) {
}
esp_err_t RootLayout::create_layout(lv_obj_t* parent) {
// Create header (top)
// Configure parent as flexbox column layout
lv_obj_set_flex_flow(parent, LV_FLEX_FLOW_COLUMN);
lv_obj_set_flex_align(parent, LV_FLEX_ALIGN_START, LV_FLEX_ALIGN_START, LV_FLEX_ALIGN_START);
lv_obj_set_style_pad_all(parent, 0, 0);
lv_obj_set_style_pad_gap(parent, 0, 0);
// Create header (top, fixed height)
_header = lv_obj_create(parent);
lv_obj_set_size(_header, DISPLAY_WIDTH, HEADER_HEIGHT);
lv_obj_set_pos(_header, 0, 0);
lv_obj_set_style_bg_color(_header, lv_color_hex(0x333333), 0);
lv_obj_set_width(_header, lv_pct(100));
lv_obj_set_height(_header, HEADER_HEIGHT);
lv_obj_set_style_bg_color(_header, lv_color_hex(0xFFFFFF), 0);
lv_obj_set_style_border_width(_header, 0, 0);
lv_obj_set_style_border_color(_header, lv_color_hex(0x000000), 0);
lv_obj_set_style_border_width(_header, 1, LV_BORDER_SIDE_BOTTOM);
lv_obj_set_style_pad_all(_header, 0, 0);
lv_obj_set_style_radius(_header, 0, 0);
_header_label = lv_label_create(_header);
lv_label_set_text(_header_label, "App");
lv_obj_set_style_text_color(_header_label, lv_color_white(), 0);
lv_obj_set_style_text_color(_header_label, lv_color_black(), 0);
lv_obj_align(_header_label, LV_ALIGN_LEFT_MID, 10, 0);
// Create app container (middle)
// Create app container (middle, flexible - grows to fill available space)
_app_container = lv_obj_create(parent);
lv_obj_set_size(_app_container, DISPLAY_WIDTH, APP_CONTAINER_HEIGHT);
lv_obj_set_pos(_app_container, 0, HEADER_HEIGHT);
lv_obj_set_width(_app_container, lv_pct(100));
lv_obj_set_flex_grow(_app_container, 1);
lv_obj_set_style_bg_color(_app_container, lv_color_white(), 0);
lv_obj_set_style_border_width(_app_container, 0, 0);
lv_obj_set_style_pad_all(_app_container, 0, 0);
lv_obj_set_style_radius(_app_container, 0, 0);
// Create navigation bar (bottom)
// Create navigation bar (bottom, fixed height)
_nav_bar = lv_obj_create(parent);
lv_obj_set_size(_nav_bar, DISPLAY_WIDTH, NAV_BAR_HEIGHT);
lv_obj_set_pos(_nav_bar, 0, HEADER_HEIGHT + APP_CONTAINER_HEIGHT);
lv_obj_set_style_bg_color(_nav_bar, lv_color_hex(0x333333), 0);
lv_obj_set_style_border_width(_nav_bar, 0, 0);
lv_obj_set_width(_nav_bar, lv_pct(100));
lv_obj_set_height(_nav_bar, NAV_BAR_HEIGHT);
lv_obj_set_style_bg_color(_nav_bar, lv_color_hex(0xFFFFFF), 0);
lv_obj_set_style_border_color(_nav_bar, lv_color_hex(0x000000), 0);
lv_obj_set_style_border_width(_nav_bar, 1, LV_BORDER_SIDE_TOP);
lv_obj_set_style_pad_all(_nav_bar, 5, 0);
lv_obj_set_style_radius(_nav_bar, 0, 0);
ESP_LOGI(TAG, "Layout created: Header=%d, AppContainer=%d, NavBar=%d",
HEADER_HEIGHT, APP_CONTAINER_HEIGHT, NAV_BAR_HEIGHT);
// Configure nav bar as flexbox row layout with space-between
lv_obj_set_flex_flow(_nav_bar, LV_FLEX_FLOW_ROW);
lv_obj_set_flex_align(_nav_bar, LV_FLEX_ALIGN_SPACE_BETWEEN, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER);
// Create back button (aligned to start by flex layout)
_back_button = lv_btn_create(_nav_bar);
lv_obj_set_size(_back_button, 60, NAV_BAR_HEIGHT - 10);
lv_obj_set_style_bg_color(_back_button, lv_color_hex(0x555555), 0);
lv_obj_add_event_cb(_back_button, on_back_button_clicked, LV_EVENT_CLICKED, _ui_handler);
lv_obj_add_flag(_back_button, LV_OBJ_FLAG_HIDDEN);
// Add back arrow label
lv_obj_t* back_label = lv_label_create(_back_button);
lv_label_set_text(back_label, LV_SYMBOL_LEFT);
lv_obj_set_style_text_color(back_label, lv_color_black(), 0);
lv_obj_align(back_label, LV_ALIGN_CENTER, 0, 0);
// Create home button (aligned to end by flex layout)
lv_obj_t* home_button = lv_btn_create(_nav_bar);
lv_obj_set_size(home_button, 60, NAV_BAR_HEIGHT - 10);
lv_obj_set_style_bg_color(home_button, lv_color_hex(0x555555), 0);
lv_obj_t* home_label = lv_label_create(home_button);
lv_label_set_text(home_label, LV_SYMBOL_HOME);
lv_obj_set_style_text_color(home_label, lv_color_white(), 0);
lv_obj_align(home_label, LV_ALIGN_CENTER, 0, 0);
lv_obj_add_event_cb(home_button, on_home_button_clicked, LV_EVENT_CLICKED, _ui_handler);
ESP_LOGI(TAG, "Layout created with flexible design: Header=%d, NavBar=%d",
HEADER_HEIGHT, NAV_BAR_HEIGHT);
return ESP_OK;
}
@@ -99,8 +143,12 @@ esp_err_t RootLayout::render_app_icons(void) {
return ESP_FAIL;
}
// Clear existing nav bar content
lv_obj_clean(_nav_bar);
// Clear existing app container content (icons are rendered in the app area)
if (!_app_container) {
ESP_LOGE(TAG, "App container not initialized");
return ESP_FAIL;
}
lv_obj_clean(_app_container);
// Get all registered apps from registry
const auto& app_descriptors = AppRegistry::instance().get_app_descriptors();
@@ -114,56 +162,39 @@ esp_err_t RootLayout::render_app_icons(void) {
return ESP_OK;
}
ESP_LOGI(TAG, "Rendering %d app icons", app_descriptors.size());
ESP_LOGI(TAG, "Rendering %d app icons", (int)app_descriptors.size());
// Calculate icon spacing
// Calculate icon spacing inside the app container
int icon_count = app_descriptors.size();
int icon_width = 96;
int icon_height = 96;
int icon_spacing = DISPLAY_WIDTH / (icon_count + 1);
int x_offset = icon_spacing;
int y_offset = (APP_CONTAINER_HEIGHT - icon_height) / 2;
// Render each app icon
// Render each app icon into the app container
for (size_t i = 0; i < app_descriptors.size(); i++) {
AppDescriptor* descriptor = app_descriptors[i];
// Create a container for this app icon
lv_obj_t* icon_container = lv_obj_create(_nav_bar);
lv_obj_set_size(icon_container, icon_spacing - 10, NAV_BAR_HEIGHT - 10);
lv_obj_set_pos(icon_container, x_offset - (icon_spacing - 10) / 2, 5);
lv_obj_t* icon_container = lv_obj_create(_app_container);
lv_obj_set_size(icon_container, icon_width, icon_height);
lv_obj_set_pos(icon_container, x_offset - icon_width / 2, y_offset);
lv_obj_set_style_bg_opa(icon_container, LV_OPA_TRANSP, 0);
lv_obj_set_style_border_width(icon_container, 0, 0);
lv_obj_set_style_pad_all(icon_container, 0, 0);
// add a border for debugging
lv_obj_set_style_border_color(icon_container, lv_color_hex(0x000000), 0);
lv_obj_set_style_border_width(icon_container, 1, 0);
// Store both the descriptor and ui_handler as user data
lv_obj_set_user_data(icon_container, descriptor);
// Let the descriptor draw its icon
descriptor->draw_icon(icon_container);
// Add click event handler
lv_obj_add_flag(icon_container, LV_OBJ_FLAG_CLICKABLE);
lv_obj_add_event_cb(icon_container, on_app_icon_clicked, LV_EVENT_CLICKED, _ui_handler);
x_offset += icon_spacing;
}
// Create back button on the left side of the nav bar
_back_button = lv_btn_create(_nav_bar);
lv_obj_set_size(_back_button, 60, NAV_BAR_HEIGHT - 10);
lv_obj_set_pos(_back_button, 5, 5);
lv_obj_set_style_bg_color(_back_button, lv_color_hex(0x555555), 0);
// Add back arrow label
lv_obj_t* back_label = lv_label_create(_back_button);
lv_label_set_text(back_label, LV_SYMBOL_LEFT);
lv_obj_set_style_text_color(back_label, lv_color_white(), 0);
lv_obj_align(back_label, LV_ALIGN_CENTER, 0, 0);
// Add click event handler
lv_obj_add_event_cb(_back_button, on_back_button_clicked, LV_EVENT_CLICKED, _ui_handler);
// Initially hide back button (shown when app is active)
lv_obj_add_flag(_back_button, LV_OBJ_FLAG_HIDDEN);
return ESP_OK;
}
@@ -180,7 +211,9 @@ void RootLayout::hide_back_button(void) {
}
void RootLayout::on_app_icon_clicked(lv_event_t* event) {
lv_obj_t* icon_container = static_cast<lv_obj_t*>(lv_event_get_target(event));
// Use the current target (the object the callback was attached to)
// instead of the event target, which may be a child (like a label).
lv_obj_t* icon_container = static_cast<lv_obj_t*>(lv_event_get_current_target(event));
UIHandler* handler = static_cast<UIHandler*>(lv_event_get_user_data(event));
AppDescriptor* descriptor = static_cast<AppDescriptor*>(lv_obj_get_user_data(icon_container));
@@ -218,3 +251,14 @@ void RootLayout::on_back_button_clicked(lv_event_t* event) {
handler->return_to_main_screen();
}
}
static void on_home_button_clicked(lv_event_t* event) {
UIHandler* handler = static_cast<UIHandler*>(lv_event_get_user_data(event));
if (!handler) {
ESP_LOGE(TAG, "Invalid handler in home button click");
return;
}
handler->return_to_main_screen();
}