LVGL7.0设置界面背景

                                                                 界面背景

1、界面纯色背景创建

创建背景纯色

void Home_Page_Create(void)

{

    lv_obj_t* bgk;

    bgk = lv_obj_create(lv_scr_act(), NULL);//创建对象

    lv_obj_clean_style_list(bgk, LV_OBJ_PART_MAIN); //清空对象风格

    lv_obj_set_style_local_bg_opa(bgk, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, LV_OPA_100);//设置颜色覆盖度100%,数值越低,颜色越透。

    lv_obj_set_style_local_bg_color(bgk, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, LV_COLOR_GREEN);//设置背景颜色为绿色

    //省去下方两行代码,默认是从0,0处开始绘制

    lv_obj_set_x(bgk, 0);//设置X轴起点

    lv_obj_set_y(bgk, 0);//设置Y轴起点

    lv_obj_set_size(bgk, 800, 40);//设置覆盖大小

}

2、如何让纯色背景动起来

这里我们用到了LVGL自带的任务函数lv_task_create()

 

static void bgk_anim(lv_task_t* t)
{
	static uint32_t x = 0;
	lv_obj_t* bg = t->user_data;
	x = !x;
	lv_obj_set_style_local_bg_color(bg, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, x?LV_COLOR_RED: LV_COLOR_GREEN);//设置背景颜色为绿色
}
void Home_Page_Create(void)
{
	lv_obj_t* bgk;
	bgk = lv_obj_create(lv_scr_act(), NULL);//创建对象
	lv_obj_clean_style_list(bgk, LV_OBJ_PART_MAIN); //清空对象风格
	lv_obj_set_style_local_bg_opa(bgk, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, LV_OPA_100);//设置颜色覆盖度100%,数值越低,颜色越透。
	lv_obj_set_style_local_bg_color(bgk, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, LV_COLOR_GREEN);//设置背景颜色为绿色
	//省去下方两行代码,默认是从0,0处开始绘制
	lv_obj_set_x(bgk, 0);//设置X轴起点
	lv_obj_set_y(bgk, 0);//设置Y轴起点

	lv_obj_set_size(bgk, 800, 40);//设置覆盖大小
	lv_task_create(bgk_anim, 500, LV_TASK_PRIO_LOW, bgk);//创建任务 500ms一次
}

3、界面图片背景创建

想要美观的背景图可以试试哦!

void Home_Page_Create(void)
{
    lv_obj_t* bg_img;
	LV_IMG_DECLARE(picture); //声明图片
	bg_img = lv_img_create(lv_scr_act(), NULL);//创建一个图像对象
	lv_img_set_src(bg_img, &picture);//设置图片源
	lv_obj_align(bg_img, NULL, LV_ALIGN_IN_TOP_LEFT, 0, 0);//对齐
}

4、在背景上创建一个按键

有了背景,不知道如何在背景上创建对象??

void Home_Page_Create(void)
{
	lv_obj_t* bg_img;
	LV_IMG_DECLARE(H_PIC_0); //声明图片
	LV_IMG_DECLARE(picture);
	bg_img = lv_img_create(lv_scr_act(), NULL); //创建一个图像对象
	lv_img_set_src(bg_img, &picture); //设置图片源
	lv_obj_align(bg_img, NULL, LV_ALIGN_IN_TOP_LEFT, 0, 0); //对齐
	static lv_style_t style;
	lv_style_init(&style);//对象风格初始化
	lv_style_set_image_recolor_opa(&style, LV_STATE_PRESSED, LV_OPA_30);//设置按下时的背景色深
	lv_style_set_image_recolor(&style, LV_STATE_PRESSED, LV_COLOR_GRAY);//设置按下时的背景色
	lv_obj_t* img1 = lv_imgbtn_create(lv_scr_act(), NULL);//创建图片按键
	lv_imgbtn_set_src(img1, LV_BTN_STATE_PRESSED, &H_PIC_0);//按下
	lv_imgbtn_set_src(img1, LV_BTN_STATE_RELEASED, &H_PIC_0);//抬起
	lv_obj_align(img1, NULL, LV_ALIGN_IN_TOP_LEFT, 30, 25);//左上角对齐
	lv_obj_add_style(img1, LV_IMGBTN_PART_MAIN, &style);
}

 

 

 

### 如何在LVGL框架中设置背景图片LVGL框架中,可以通过创建一个`lv_obj_t`类型的对象并为其应用样式来实现背景图片设置。以下是具体方法: #### 创建带有背景图片的对象 可以使用 `lv_img_set_src()` 函数为图像对象指定源文件路径或缓冲区数据作为背景图片[^1]。 ```c // 初始化LVGL库 (假设已初始化完成) // 创建一个全屏的基础对象 lv_obj_t *scr = lv_disp_get_scr_act(NULL); // 创建一个图像对象 lv_obj_t *img_bg = lv_img_create(scr, NULL); if (img_bg == NULL) { // 错误处理逻辑 } // 设置图像资源(例如:C数组或者文件名) const char *path_to_image = "S:/my_background.png"; // 假设这是存储位置 lv_img_set_src(img_bg, path_to_image); // 加载背景图片到该对象上 // 调整大小以覆盖整个屏幕 lv_obj_set_size(img_bg, lv_disp_get_hor_res(NULL), lv_disp_get_ver_res(NULL)); lv_obj_align(img_bg, NULL, LV_ALIGN_CENTER, 0, 0); // 居中显示 ``` 上述代码片段展示了如何加载一张图片并将其设置为当前活动屏幕上的一层背景图层。注意这里使用的路径 `"S:/my_background.png"` 是示例路径,在实际项目中需替换为有效的资源地址。 #### 使用样式定义背景图片 另一种方式是利用样式系统直接给任意控件设定背景图案属性。 ```c static lv_style_t style_bg; lv_style_init(&style_bg); // 定义背景颜色以及边框等其他可选参数... lv_style_set_bg_opa(&style_bg, LV_OPA_COVER); lv_style_set_bg_color(&style_bg, lv_color_hex(0xCCCCCC)); // 关键部分——引入背景图片素材 lv_style_set_bg_img_src(&style_bg, &my_bitmap_data); // my_bitmap_data应预先准备好bitmap结构体变量[^4] lv_style_set_bg_img_opa(&style_bg, LV_OPA_70); // 可调整透明度效果 // 应用此风格至目标容器组件比如窗口window主体区域 lv_obj_add_style(lv_scr_act(), LV_OBJ_PART_MAIN, &style_bg); ``` 以上两种途径都可以达成目的即配置好所需的视觉界面基础环境。选择哪种取决于开发人员对于灵活性和性能之间权衡考量的结果。
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值