页面背景图像的生成方法技术

技术编号:39851500 阅读:4 留言:0更新日期:2023-12-30 12:52
本申请涉及图像处理技术领域,尤其涉及一种页面背景图像的生成方法

【技术实现步骤摘要】
页面背景图像的生成方法、装置、电子设备和存储介质


[0001]本申请涉及图像处理
,尤其涉及一种页面背景图像的生成方法

装置

电子设备和存储介质


技术介绍

[0002]随着移动互联网的不断发展,各类应用的使用越来越广泛,通常,在一些音乐

社交

阅读或游戏等类别应用中,显示页面可显示背景图像,背景图像之上进一步展示各种用户界面
(User Interface

UI)
组件等信息

[0003]以音乐类应用为例,对象在使用音乐类应用听歌时,在以音乐单首歌曲为主题的音乐播放界面,通常采用对歌曲封面进行高斯模糊处理的方式,生成一张根据封面图衍生的模糊背景图像

然而,该方式相当于将同一份图像
(
即封面图
)
在两个地方呈现给对象,背景图像的样式缺乏多样性

[0004]此外,由于封面图可以是任何图像,颜色多样,因而会频繁遇到封面图和音乐播放界面中的
UI
组件颜色重叠的问题,为避免基于此生成的背景图像与
UI
组件也发生颜色重叠,目前常采用统一在音乐播放界面加阴影的方式,导致该类型的所有界面颜色基调都偏暗,受限于该配色的约束,灵活性较差;并且,基调偏暗的情况下,也会导致对象看不清歌词显示,容易误操作


技术实现思路

[0005]本申请实施例提供一种页面背景图像的生成方法

装置

电子设备和存储介质,用以丰富背景图像样式的多样性和灵活性

[0006]本申请实施例提供的一种页面背景图像的生成方法,包括:
[0007]从对参考图像进行分割获得的多个图像区域中,选取出位于图像指定位置的至少两个目标图像区域;
[0008]分别基于所述至少两个目标图像区域各自包含的像素点的像素信息,确定对应的基础色;
[0009]根据各个基础色与目标颜色的色彩对比度,分别对所述各个基础色的饱和度进调整,获得对应的目标基础色;所述目标颜色是基于指定的展示页面包含的页面元素的像素信息确定的;
[0010]根据所述各个目标基础色,生成所述展示页面的背景图像

[0011]本申请实施例提供的一种页面背景图像的生成装置,包括:
[0012]选择单元,用于从对参考图像进行分割获得的多个图像区域中,选取出位于图像指定位置的至少两个目标图像区域;
[0013]确定单元,用于分别基于所述至少两个目标图像区域各自包含的像素点的像素信息,确定对应的基础色;
[0014]第一调整单元,用于根据各个基础色与目标颜色的色彩对比度,分别对所述各个
基础色的饱和度进调整,获得对应的目标基础色;所述目标颜色是基于指定的展示页面包含的页面元素的像素信息确定的;
[0015]生成单元,用于根据所述各个目标基础色,生成所述展示页面的背景图像

[0016]可选的,每个像素点的像素信息包括:红绿蓝
RGB
颜色空间中的三个颜色通道各自对应的色彩值;所述基础色包括
RGB
颜色空间中的三个颜色通道各自对应的基础色彩值;所述确定单元具体用于:
[0017]对于每个目标图像区域,分别执行以下操作:
[0018]将一个目标图像区域内各像素点在同一颜色通道的色彩值的平均值,作为所述一个目标图像区域在所述同一颜色通道对应的基础色彩值

[0019]可选的,所述装置还包括:
[0020]第二调整单元,用于在所述确定单元分别基于所述至少两个目标图像区域各自包含的像素点的像素信息,确定对应的基础色之后,在所述第一调整单元根据各个基础色与目标颜色的色彩对比度,分别对所述各个基础色的饱和度进调整,获得对应的目标基础色之前,对于每个基础色,分别执行以下操作:
[0021]确定一个基础色的色彩值,不归属于所述目标颜色对应的色系色彩区间

[0022]可选的,所述第二调整单元还用于:
[0023]若确定所述一个基础色的色彩值,归属于所述目标颜色对应的色系色彩区间,则基于所述色系色彩区间的色彩临界值,对所述基础色进行颜色调整

[0024]可选的,所述色系色彩区间对应至少一组色彩临界值,每组色彩临界值包括:红绿蓝
(RGB

Red Green Blue)
颜色空间中的三个颜色通道各自对应的色彩临界值;
[0025]所述第二调整单元具体用于:
[0026]从所述色系色彩区间对应的至少一组色彩临界值中,选取一组目标色彩临界值;
[0027]将所述一个基础色更新为与所述目标色彩临界值对应的颜色

[0028]可选的,所述基础色包括
RGB
颜色空间中的三个颜色通道各自对应的基础色彩值;则所述第二调整单元还通过下列方式确定所述一个基础色的色彩值,是否归属于所述目标颜色对应的色系色彩区间:
[0029]若所述色系色彩区间对应白色系,则在所述一个基础色包含的各基础色彩值,均大于所述白色系对应的相应颜色通道的色彩临界值时,确定所述基础色属于白色系;
[0030]若所述色系色彩区间对应黑色系,则在所述一个基础色包含的各基础色彩值,均小于所述黑色系对应的相应颜色通道的色彩临界值时,确定所述基础色属于黑色系

[0031]可选的,所述第一调整单元具体用于:
[0032]对于每个基础色,分别执行以下操作:
[0033]在
RGB
颜色空间,获取所述一个基础色与所述目标颜色的色彩对比度;
[0034]若所述色彩对比度不大于预设阈值,则对所述一个基础色的饱和度进行至少一次上调,获得对应的目标基础色

[0035]可选的,所述第一调整单元具体用于:
[0036]将所述一个基础色的饱和度按照固定数值进行上调,并基于上调后的饱和度,获得所述一个基础色对应的目标基础色;或者
[0037]将所述一个基础色的饱和度按照预设步长进行至少一次上调,直至基于上调后的
饱和度获得的目标基础色与所述目标颜色的色彩对比度,大于所述预设阈值

[0038]可选的,所述第一调整单元具体用于:
[0039]将所述一个基础色由
RGB
颜色空间转换为色调饱和度明度
(Hue Saturation Value

HSV)
颜色空间,获得所述一个基础色的饱和度;
[0040]对所述一个基础色的饱和度进行至少一次上调,获得上调后的饱和度;
[0041]基于所述上调后的饱和度,将所述一个基础色由
HSV
颜色空间转换为
RGB
颜本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.
一种页面背景图像的生成方法,其特征在于,该方法包括:从对参考图像进行分割获得的多个图像区域中,选取出位于图像指定位置的至少两个目标图像区域;分别基于所述至少两个目标图像区域各自包含的像素点的像素信息,确定对应的基础色;根据各个基础色与目标颜色的色彩对比度,分别对所述各个基础色的饱和度进调整,获得对应的目标基础色;所述目标颜色是基于指定的展示页面包含的页面元素的像素信息确定的;根据所述各个目标基础色,生成所述展示页面的背景图像
。2.
如权利要求1所述的方法,其特征在于,每个像素点的像素信息包括:红绿蓝
RGB
颜色空间中的三个颜色通道各自对应的色彩值;所述基础色包括
RGB
颜色空间中的三个颜色通道各自对应的基础色彩值;所述分别基于所述至少两个目标图像区域各自包含的像素点的像素信息,确定对应的基础色,包括:对于每个目标图像区域,分别执行以下操作:将一个目标图像区域内各像素点在同一颜色通道的色彩值的平均值,作为所述一个目标图像区域在所述同一颜色通道对应的基础色彩值
。3.
如权利要求1所述的方法,其特征在于,在所述分别基于所述至少两个目标图像区域各自包含的像素点的像素信息,确定对应的基础色之后,所述根据各个基础色与目标颜色的色彩对比度,分别对所述各个基础色的饱和度进调整,获得对应的目标基础色之前,还包括:对于每个基础色,分别执行以下操作:确定一个基础色的色彩值,不归属于所述目标颜色对应的色系色彩区间
。4.
如权利要求3所述的方法,其特征在于,所述方法还包括:若确定所述一个基础色的色彩值,归属于所述目标颜色对应的色系色彩区间,则基于所述色系色彩区间的色彩临界值,对所述基础色进行颜色调整
。5.
如权利要求4所述的方法,其特征在于,所述色系色彩区间对应至少一组色彩临界值,每组色彩临界值包括:
RGB
颜色空间中的三个颜色通道各自对应的色彩临界值;所述基于所述色系色彩区间对应的色彩临界值,对所述基础色进行颜色调整,包括:从所述色系色彩区间对应的至少一组色彩临界值中,选取一组目标色彩临界值;将所述一个基础色更新为与所述目标色彩临界值对应的颜色
。6.
如权利要求3~5任一项所述的方法,其特征在于,所述基础色包括
RGB
颜色空间中的三个颜色通道各自对应的基础色彩值;则通过下列方式确定所述一个基础色的色彩值,是否归属于所述目标颜色对应的色系色彩区间:若所述色系色彩区间对应白色系,则在所述一个基础色包含的各基础色彩值,均大于所述白色系对应的相应颜色通道的色彩临界值时,确定所述基础色属于白色系;若所述色系色彩区间对应黑色系,则在所述一个基础色包含的各基础色彩值,均小于所述黑色系对应的相应颜色通道的色彩临界值时,确定所述基础色属于黑色系

7.
如权利要求1所述的方法,其特征在于,所述根据各个基础色与目标颜色的色彩对比度,分别对所述各个基础色的饱和度进调整,获得对应的目标基础色,包括:对于每个基础色,分别执行以下操作:在
RGB
颜色空间,获取所述一个基础色与所述目标颜色的色彩对比度;若所述色彩对比度不大于预设阈值,则对所述一个基础色的饱和度进行至少一次上调,获得对应的目标基础色
。8.
如权利要求7所述的方法,其特...

【专利技术属性】
技术研发人员:王彬彬曹粟汪雨涵
申请(专利权)人:腾讯科技深圳有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1