LVGL lv_msgbox消息对话框(22)

lv_msgbox

lv_msgbox由lv_cont容器、lv_label标签、lv_btnmatrix矩阵按键构成,lv_cont充当lv_msgbox的背景,lv_label显示lv_msgbox的消息内容,lv_btnmatrix充当lv_msgbox的底部按钮

样式

/** Message box styles. */
enum {
    LV_MSGBOX_PART_BG = LV_CONT_PART_MAIN,

    LV_MSGBOX_PART_BTN_BG = _LV_CONT_PART_REAL_LAST,
    LV_MSGBOX_PART_BTN,
};
typedef uint8_t lv_msgbox_style_t;

例子

#if LV_USE_MSGBOX

static void mbox_event_cb(lv_obj_t *obj, lv_event_t evt);
static void btn_event_cb(lv_obj_t *btn, lv_event_t evt);
static void opa_anim(void * bg, lv_anim_value_t v);

static lv_obj_t *mbox, *info;
static lv_style_t style_modal;

static const char welcome_info[] = "Welcome to the modal message box demo!\n"
        "Press the button to display a message box.";

static const char in_msg_info[] = "Notice that you cannot touch "
        "the button again while the message box is open.";

void lv_ex_msgbox_2(void)
{
    /* 创建一个按键,按键回调创建msgbox */
    lv_obj_t *btn = lv_btn_create(lv_scr_act(), NULL);
    lv_obj_set_size(btn, 200, 60);
    lv_obj_set_event_cb(btn, btn_event_cb);
    lv_obj_align(btn, NULL, LV_ALIGN_IN_TOP_LEFT, 20, 20);

    /* 按键上创建标签 */
    lv_obj_t *label = lv_label_create(btn, NULL);
    lv_label_set_text(label, "Display a message box!");

    /* 提示信息 */
    info = lv_label_create(lv_scr_act(), NULL);
    lv_label_set_text(info, welcome_info);
    lv_label_set_long_mode(info, LV_LABEL_LONG_BREAK); /* Make sure text will wrap */
    lv_obj_set_width(info, LV_HOR_RES - 10);
    lv_obj_align(info, NULL, LV_ALIGN_IN_BOTTOM_LEFT, 5, -5);

}

static void mbox_event_cb(lv_obj_t *obj, lv_event_t evt)
{
	char btn_id = -1;
    if(evt == LV_EVENT_DELETE && obj == mbox) {
        /* Delete the parent modal background */
        lv_obj_del_async(lv_obj_get_parent(mbox));
        mbox = NULL; /* happens before object is actually deleted! */
        lv_label_set_text(info, welcome_info);
		printf("close msgbox done\n");
    } else if(evt == LV_EVENT_VALUE_CHANGED) {
        /* A button was clicked */
		btn_id = lv_msgbox_get_active_btn(obj);
		if (btn_id == 0) //Apply
		{ //马上关闭消息对话框
			lv_msgbox_start_auto_close(mbox, 0);
		}
		else if (btn_id == 1) //Close
		{//定时关闭消息对话框
			lv_msgbox_start_auto_close(mbox, 2000);
		}
		printf("%s pressed \n", btn_id==0?"Apply":"Close");
		printf("start close msgbox...\n");
    }
}
#define MBOX_WIDTH  220     //消息对话框的宽度
#define MBOX_BTN_HEIGHT  30 //其内部每个按钮的高度
#define MBOX_BTN_NUM     2  //按钮个数

static void lv_msgbox_set_msg_recolor(lv_obj_t * mbox, bool en)
{
	lv_msgbox_ext_t * ext = lv_obj_get_ext_attr(mbox);//获取控件的扩展字段
	if(ext->text) lv_label_set_recolor(ext->text, en);//ext->text 就是消息对话框内部的标签对象
}

static void btn_event_cb(lv_obj_t *btn, lv_event_t evt)
{
    if(evt == LV_EVENT_CLICKED) {
        /* Create a full-screen background */
	    //背景样式
		lv_style_init(&style_modal);
		lv_style_set_bg_color(&style_modal, LV_STATE_DEFAULT, LV_COLOR_BLACK);

        /* 创建基础对象obj作为背景 */
        lv_obj_t *obj = lv_obj_create(lv_scr_act(), NULL);
        lv_obj_reset_style_list(obj, LV_OBJ_PART_MAIN);
        lv_obj_add_style(obj, LV_OBJ_PART_MAIN, &style_modal);
        lv_obj_set_pos(obj, 0, 0);
        lv_obj_set_size(obj, LV_HOR_RES, LV_VER_RES);

        static const char * btns2[] = {"#5FB878 Apply#","\n", "#ff0000 Close#", ""};

		static lv_style_t mbox_bg_style;    //消息对话框背景样式
		static lv_style_t mbox_btn_bg_style;//消息对话框按键背景样式
		static lv_style_t mbox_btn_style;   //消息对话框按键样式

		//1.消息对话框背景样式
		lv_style_init(&mbox_bg_style);
		lv_style_set_bg_color(&mbox_bg_style, LV_STATE_DEFAULT, LV_COLOR_MAKE(250, 250, 250));//背景颜色
		lv_style_set_radius(&mbox_bg_style, LV_STATE_DEFAULT, 10);//圆角半径
		lv_style_set_border_width(&mbox_bg_style, LV_STATE_DEFAULT, 1);//边框宽度
		lv_style_set_border_color(&mbox_bg_style, LV_STATE_DEFAULT, LV_COLOR_MAKE(150, 150, 150));//边框颜色
		lv_style_set_shadow_color(&mbox_bg_style, LV_STATE_DEFAULT, LV_COLOR_MAKE(150, 150, 150));//阴影颜色
		lv_style_set_shadow_width(&mbox_bg_style, LV_STATE_DEFAULT, 6);//阴影宽度

		lv_style_set_pad_top(&mbox_bg_style, LV_STATE_DEFAULT, 10);//消息内容与消息对话框上边框之间的距离
		lv_style_set_pad_bottom(&mbox_bg_style, LV_STATE_DEFAULT, 0);//按键与对话框低边框之间的距离
		lv_style_set_pad_inner(&mbox_bg_style, LV_STATE_DEFAULT, 10);//消息内容与按键距离
		lv_style_set_pad_left(&mbox_bg_style, LV_STATE_DEFAULT, 0);//按键和背景距离
		lv_style_set_pad_right(&mbox_bg_style, LV_STATE_DEFAULT, 0);//按键和背景距离

		//2.消息对话框按键背景样式
		lv_style_init(&mbox_btn_bg_style);
		lv_style_set_border_side(&mbox_btn_bg_style, LV_STATE_DEFAULT, LV_BORDER_SIDE_TOP);
		lv_style_set_pad_inner(&mbox_btn_bg_style, LV_STATE_DEFAULT, 0);//消息内容与按键距离
		lv_style_set_pad_all(&mbox_btn_bg_style, LV_STATE_DEFAULT, 0);
		lv_style_set_radius(&mbox_btn_bg_style, LV_STATE_DEFAULT, 0);//直角

		//3.消息对话框按键样式
		lv_style_init(&mbox_btn_style);
		lv_style_set_border_side(&mbox_btn_style, LV_STATE_DEFAULT, LV_BORDER_SIDE_TOP);
		lv_style_set_radius(&mbox_btn_style, LV_STATE_DEFAULT, 0);//直角
		lv_style_set_border_width(&mbox_btn_style, LV_STATE_DEFAULT, 1);
		lv_style_set_border_color(&mbox_btn_style, LV_STATE_DEFAULT, LV_COLOR_MAKE(150, 150, 150));

        /*在obj作为父对象,创建消息对话框 */
        mbox = lv_msgbox_create(obj, NULL);
		lv_msgbox_add_btns(mbox, btns2);//添加按键	
		lv_msgbox_set_text(mbox, "#007AFF Title#\nHello World!");//添加文本
		lv_msgbox_set_msg_recolor(mbox, true);//使能消息内容文本重绘色
		lv_msgbox_set_recolor(mbox, true);//使能按键文本重绘色
		lv_obj_set_width(mbox,MBOX_WIDTH);//设置宽度,高度会自适应    
        lv_obj_align(mbox, NULL, LV_ALIGN_CENTER, 0, 0);//相对背景居中对齐
        lv_obj_set_event_cb(mbox, mbox_event_cb);//设置消息对话框回调函数

		lv_obj_add_style(mbox, LV_MSGBOX_PART_BG, &mbox_bg_style);//1.
        lv_obj_add_style(mbox, LV_MSGBOX_PART_BTN_BG, &mbox_btn_bg_style);//2.		
		lv_obj_add_style(mbox, LV_MSGBOX_PART_BTN, &mbox_btn_style);//3.

        /* 这段设置动画的用法不是很理解 */
#if 1   
        lv_anim_t a;
        lv_anim_init(&a);
        lv_anim_set_var(&a, obj);
        lv_anim_set_time(&a, 500);//动画时间
        lv_anim_set_values(&a, LV_OPA_TRANSP, LV_OPA_50);//开始结束透明度
        lv_anim_set_exec_cb(&a, (lv_anim_exec_xcb_t)opa_anim);
        lv_anim_start(&a);
#endif
		//提示信息
        lv_label_set_text(info, in_msg_info);
        lv_obj_align(info, NULL, LV_ALIGN_IN_BOTTOM_LEFT, 5, -5);

    }
}

static void opa_anim(void * bg, lv_anim_value_t v)
{
    lv_obj_set_style_local_bg_opa(bg, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, v);
}

#endif

close按钮的下面2个直角不知道怎么单独去掉

在这里插入图片描述

  • 6
    点赞
  • 17
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值