Message Box with Yes and No buttons CENTERED

How-to
1

Description

I can’t find a way to align buttons…

What MCU/Processor/Board and compiler are you using?

ESP32

What LVGL version are you using?

v8.3.11

I would just like to have a message box with the classic Yes and No buttons at the bottom of the windows, spaced apart and aligned in the center. I have tried many ways but nothing works…

2

Hi @robiz ,

Here is a quick example, I hope it helps…

static void restart_action( lv_event_t *event ) {

    lv_obj_t			*btn = lv_event_get_target(event);
    lv_obj_t			*mbox = lv_obj_get_parent(btn);
	lv_event_code_t 	code = lv_event_get_code(event);

	if( code == LV_EVENT_VALUE_CHANGED ) {
    	if( !strcmp( lv_msgbox_get_active_btn_text(mbox), "Yes" ) ) {
			printf( "Yes selected\n");
		}
    }
	lv_msgbox_close(mbox);
}

void msg_box_test( void ) {

	static const char		*btns[] ={"Yes", "No", ""}; /*Button description.*/
	lv_obj_t 				*mb_restart;

	mb_restart = lv_msgbox_create(NULL, "Restart Required!", "\nRestart Now?\n", btns, true);
	lv_obj_set_width(mb_restart, 500);
    lv_obj_set_flex_align(mb_restart, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER);
	lv_obj_center(mb_restart);
	lv_obj_add_event_cb(mb_restart, restart_action, LV_EVENT_VALUE_CHANGED, NULL);
    /* Optionally change the properties/colours of the buttons */
    lv_obj_t *btnm = lv_msgbox_get_btns(mb_restart);		// Get a pointer to the message box internal button matrix
    lv_obj_set_style_bg_color(btnm, lv_palette_main(LV_PALETTE_PURPLE), LV_PART_ITEMS);		// Change the background colour
}

Here is the result:

msgbox
msgbox1023×791 10.9 KB

Kind Regards,

Pete

3

Thnak you… it works, now I can change background color, but… how to resize buttons too?

This does not resize buttons:

    lv_obj_t *btn = lv_msgbox_get_btns(mbox2);		// Get a pointer to the message box internal button matrix
    lv_obj_set_style_bg_color(btn, LV_COLOR_BLUE, LV_PART_ITEMS);		// Change the background colour
	lv_obj_set_style_width(btn, 120, LV_PART_ITEMS);
	lv_obj_set_style_height(btn, 50, LV_PART_ITEMS);
	// lv_obj_set_size(btn, 120, 50);  <<-- no success
4

@pete-pjb can you help me to resize buttons?
Thanks.

5

Because lv_msgbox use lv_btnmatrix, not lv_btn

lv_obj_t* btns = lv_msgbox_get_btns(mbox1);
lv_btnmatrix_set_btn_width(btns, 0, 2);