Hi guys
I am pretty new to lvgl and just started using it. This might be a dumb question and already available but I was not able to find a specific information to my problem.
The lvgl version which I am using is 8.3
So here is the simple list I created
// Create a container that will hold messages
message_container = lv_obj_create(ui_Main);
lv_obj_set_size(message_container, 220, 200); // Adjust as needed
lv_obj_align(message_container, LV_ALIGN_BOTTOM_MID, 0, -10); // Position near bottom
// Enable scrolling in vertical direction
lv_obj_set_scroll_dir(message_container, LV_DIR_VER);
lv_obj_set_scrollbar_mode(message_container, LV_SCROLLBAR_MODE_AUTO);
// Use a column layout for child items
lv_obj_set_flex_flow(message_container, LV_FLEX_FLOW_COLUMN);
// Align items from top to bottom
lv_obj_set_flex_align(message_container, LV_FLEX_ALIGN_START, LV_FLEX_ALIGN_START, LV_FLEX_ALIGN_START);
// Optional: Black or White background depending on your theme
lv_obj_set_style_bg_color(message_container, lv_color_black(), 0);
lv_obj_set_style_bg_opa(message_container, LV_OPA_COVER, 0);
Now I receive Notifications from the network to my device and I created following API
static void add_message(uint8_t tableNum, const char* timeStr)
{
// If buffer not full, increment messageCount
if (messageCount < MAX_MESSAGES) {
messageCount++;
}
// Shift messages down (from bottom to top)
for (int i = messageCount - 1; i > 0; i--) {
messages[i] = messages[i - 1];
}
// Insert new message at the top
messages[0].tableNumber = tableNum;
strncpy(messages[0].timeText, timeStr, sizeof(messages[0].timeText) - 1);
messages[0].timeText[sizeof(messages[0].timeText) - 1] = '\0';
// messages[0].arrivalUtc = UTC_getClock();
}
And in LVGL timer I update this message field like this.Basically new messages will always show on top
static void refresh_message_list(void)
{
// Clear the container of existing children
lv_obj_clean(message_container);
// Re-create each message entry in order
for (int i = 0; i < messageCount; i++) {
// Create a container or button for each message
lv_obj_t* msg_item = lv_obj_create(message_container);
lv_obj_set_size(msg_item, LV_PCT(100), LV_SIZE_CONTENT); // Fill width, auto height
lv_obj_set_style_bg_opa(msg_item, LV_OPA_TRANSP, 0);
// Create a horizontal container inside for icon + table + time
lv_obj_set_flex_flow(msg_item, LV_FLEX_FLOW_ROW);
lv_obj_set_flex_align(msg_item, LV_FLEX_ALIGN_START, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER);
// Table Icon
lv_obj_t* icon = lv_img_create(msg_item);
lv_img_set_src(icon, &round_table);
// Table Number
char tableStr[16];
snprintf(tableStr, sizeof(tableStr), " Table %d ", messages[i].tableNumber);
lv_obj_t* table_label = lv_label_create(msg_item);
lv_label_set_text(table_label, tableStr);
lv_obj_set_style_text_font(table_label, &lv_font_montserrat_16, 0);
lv_obj_set_style_text_color(table_label, lv_color_white(), 0);
// Time Text
lv_obj_t* time_label = lv_label_create(msg_item);
lv_label_set_text(time_label, messages[i].timeText);
lv_obj_set_style_text_font(time_label, &lv_font_montserrat_16, 0);
lv_obj_set_style_text_color(time_label, lv_color_white(), 0);
// You can do more advanced color coding, icons, etc. inside each item
}
if(current_scroll_y > 20)
{
lv_obj_scroll_to_y(message_container, current_scroll_y, LV_ANIM_OFF);
}
}
And I have up and down buttons attached to my device which call following API.
void ui_Main_descroll_list()
{
// Increase the scroll offset by 30
if(current_scroll_y > 20)
{
current_scroll_y -= 20;
}
// Clamp so we don’t scroll past the container’s content
int content_h = lv_obj_get_content_height(message_container); // total content height
int container_h = lv_obj_get_height(message_container); // visible container height
// // If content is smaller than the container, no need to scroll
// if (content_h > container_h) {
// int max_offset = content_h - container_h;
// if (current_scroll_y > max_offset) {
// current_scroll_y = max_offset;
// }
// Now scroll the container to that offset
lv_obj_scroll_to_y(message_container, current_scroll_y, LV_ANIM_OFF);
//}
}
void ui_Main_scroll_list()
{
// Clamp so we don’t scroll past the container’s content
int content_h = lv_obj_get_content_height(message_container); // total content height
int container_h = lv_obj_get_height(message_container); // visible container height
// // If content is smaller than the container, no need to scroll
// if (content_h > container_h) {
current_scroll_y += 20;
// int max_offset = content_h - container_h;
// if (current_scroll_y > max_offset) {
// current_scroll_y = max_offset;
// }
// // Now scroll the container to that offset
lv_obj_scroll_to_y(message_container, current_scroll_y, LV_ANIM_OFF);
// }
}
Now the main issue is that I am not able to know when the list is not scrollable anymore and therefore my current_scroll_y variable keeps on incrementing when I press the button. This issue exists only on scrolling downwards and not upwards.
Here is what actual lists look like
