图片显示边缘处理方法、装置、电子设备和可读存储介质制造方法及图纸

技术编号:22658424 阅读:24 留言:0更新日期:2019-11-28 03:12
本申请公开了一种图片显示边缘处理方法、装置、电子设备和可读存储介质,涉及图片显示技术。通过根据与待处理图片对应的显示区形状,获取待处理图片的显示边缘;在显示边缘的第一边缘像素点中,确定与预设的页面背景之间边界模糊的第二边缘像素点;对第二边缘像素点配置形成边界区分的可视化属性信息,得到描边后的图片;以显示区形状显示描边后的图片,从而针对显示边缘中与页面背景边界模糊处像素点,实现了对图片显示边缘的处理,得到描边后的图片,提高了图片显示的视觉完整性,且通过对图片本身的像素点配置,降低了图片边缘显示的兼容性要求。

Image display edge processing method, device, electronic equipment and readable storage medium

The application discloses a picture display edge processing method, device, electronic device and readable storage medium, relating to a picture display technology. According to the shape of the display area corresponding to the image to be processed, the display edge of the image to be processed is obtained; in the first edge pixel point of the display edge, the second edge pixel point whose boundary is blurred with the preset page background is determined; the second edge pixel point is configured to form the visual attribute information of edge distinction, and the edge traced image is obtained; the edge traced is displayed in the shape of the display area After the image, aiming at the pixel points in the display edge and the blurry border of the page background, the processing of the image display edge is realized, and the picture after the edge stroke is obtained, which improves the visual integrity of the picture display, and reduces the compatibility requirements of the picture edge display through the pixel point configuration of the picture itself.

【技术实现步骤摘要】
图片显示边缘处理方法、装置、电子设备和可读存储介质
本申请涉及计算机领域,具体涉及一种图片显示技术。
技术介绍
在页面展示图片时,某些图片由于边界区域的颜色和页面背景颜色一致,导致图片内容的边缘和页面背景之间界限不清晰,给用户一种图片残缺的视觉错觉。现有技术,通常是以CSS样式表给图片容器增加边框,并给边框元素添加分辨率适配样式,以在不同分辨率下形成适配的边框宽度。比如在3倍屏下添加1个逻辑单位的边框,则在预设的逻辑像素边宽基础上再设定缩小3倍。但是现有的描边方案只能在支持css3特性的浏览器使用,存在屏幕分辨率上有兼容性等问题。而且,边框的颜色还可能和图片的部分边缘产生重合,仍可能出现图片边界不清晰的问题。可见,现有的图片显示方法可靠性不够高,用户体验不好。
技术实现思路
本专利技术的目的是提供一种图片显示边缘处理方法、装置、电子设备和可读存储介质。根据本专利技术的第一方面,提供了一种图片显示边缘处理方法,包括:根据与待处理图片对应的显示区形状,获取待处理图片的显示边缘;在所述显示边缘的第一边缘像素点中,确定与预设的页面背景之间边界模糊的第二边缘像素点;对所述第二边缘像素点配置与所述页面背景形成边界区分的可视化属性信息,得到描边后的图片;以所述显示区形状显示所述描边后的图片。本申请实施例针对显示边缘中与页面背景边界模糊处像素点,进行了能够与背景形成边界区分的可视化属性信息配置,实现了对图片显示边缘的处理,得到描边后的图片,从而可以在显示该描边后的图片时,具有与页面背景相区分的边界视觉效果,提高了图片显示的视觉完整性,且通过对图片本身的像素点配置,降低了图片边缘显示的兼容性要求。在一些实施例中,所述根据预设的显示区形状,获取待处理图片的显示边缘,包括:根据预设的显示区形状和预设的填充属性,在所述待处理图片中确定显示区域,其中,所述显示区域是所述待处理图片以所述填充属性填充在所述显示区形状内的区域,其中,所述填充属性包括缩放属性和/或偏移属性;将所述显示区域的边缘,作为所述待处理图片的显示边缘。本申请实施例通过获取到图片中显示区域的边缘,提高了描边位置的准确性。在一些实施例中,在所述根据预设的显示区形状,获取待处理图片的显示边缘之前,还包括:根据预设的图片布局和/或所述待处理图片的图片比例,获取待处理图片的显示区形状。本申请实施例提高了显示区形状与待处理图片的适配程度,从而提高了待处理图片的显示效果。在一些实施例中,所述根据预设的图片布局,获取待处理图片的显示区形状,包括:根据预设的瀑布流式布局,获取相邻图片队列间距、页面边距和图片队列数;根据预设的页面宽度、所述相邻图片队列间距、所述页面边距和所述图片队列数,确定图片队列的限定尺寸,其中,所述限定尺寸是在与所述图片队列的排布方向相垂直的方向上,所述图片队列的尺寸;对所述待处理图片获取矩形显示比例;根据所述图片队列的限定尺寸和所述矩形显示比例,获取待处理图片在瀑布流式布局中的显示区形状,其中,所述显示区形状是在与所述图片队列的排布方向相垂直的方向上满足所述限定尺寸,且符合所述矩形显示比例的矩形。本申请实施例根据瀑布流式布局的特点,确定显示区形状,从而提高以瀑布流式布局显示图片时的显示边缘可靠性。在一些实施例中,所述在所述显示边缘的第一边缘像素点中,确定与预设的页面背景边界模糊的第二边缘像素点,包括:获取页面背景的背景颜色信息;对所述显示边缘的各所述第一边缘像素点,获取像素颜色信息与所述背景颜色信息的色差程度;将所述色差程度小于预设色差阈值的所述第一边缘像素点,作为与预设的页面背景边界模糊的第二边缘像素点。本申请实施例通过像素颜色信息与背景颜色信息的色差比较,而确定与预设的页面背景边界模糊的第二边缘像素点,提高了对待处理图片进行边缘处理的准确性。在一些实施例中,所述获取页面背景的背景颜色信息,包括:根据页面背景的颜色均值和/或占比最大的颜色信息,确定页面背景的背景颜色信息。本申请实施例获取到的背景颜色信息更能体现或接近页面背景的主体颜色,从而能够更加准确地确定第二边缘像素点,进而提高了对待处理图像边缘处理的可靠性。在一些实施例中,所述对所述显示边缘的各所述第一边缘像素点,获取像素颜色信息与所述背景颜色信息的色差程度之前,还包括:在所述待处理图片中,将位于所述显示边缘内侧预设边宽范围内的像素点,作为第一边缘像素点,其中,所述预设边宽范围的单位是物理像素。本申请实施例通过设置物理像素的边宽,避免了不同N倍屏下的边宽显示差异。在一些实施例中,在所述对所述第二边缘像素点配置与所述页面背景形成边界区分的可视化属性信息,得到描边后的图片之前,还包括:根据预设的背景颜色与边界线可视化属性的对应关系,获取与所述背景颜色信息相对应的边界线可视化属性信息,其中所述边界线可视化属性信息包括颜色属性和透明度属性;将所述边界线可视化属性信息,作为与所述页面背景形成边界区分的可视化属性信息。本申请实施例根据以背景颜色确定用于对第二边缘像素点配置的可视化属性信息,使显示边缘与背景颜色的区分度达到预期,提高了边缘处理的可靠性。在一些实施例中,以所述显示区形状显示所述描边后的图片,包括:根据所述显示区形状,确定瀑布流式布局的图片容器和容器位置;将所述描边后的图片按预设的填充属性填充至所述图片容器中显示,以对所述描边后的图片进行缩放和/或偏移设置,以使得所述图片容器遮挡所述显示边缘以外的图片内容。本实施例是以瀑布流对描边后图片渲染显示的过程,具有较佳的视觉展示效果。根据本专利技术的第二方面,提供了一种图片显示边缘处理装置,包括:边缘确定模块,用于根据与待处理图片对应的显示区形状,获取待处理图片的显示边缘;比对模块,用于在所述显示边缘的第一边缘像素点中,确定与预设的页面背景之间边界模糊的第二边缘像素点;描边模块,用于对所述第二边缘像素点配置与所述页面背景形成边界区分的可视化属性信息,得到描边后的图片;显示模块,用于以所述显示区形状显示所述描边后的图片。根据本专利技术的第三方面,提供了一种电子设备,包括:至少一个处理器;以及与所述至少一个处理器通信连接的存储器;其中,所述存储器存储有可被所述至少一个处理器执行的指令,所述指令被所述至少一个处理器执行,以使所述至少一个处理器能够执行本专利技术第一方面任一项所述的方法。根据本专利技术的第四方面,提供了一种存储有计算机指令的非瞬时计算机可读存储介质,所述计算机指令用于使所述计算机执行本专利技术第一方面任一项所述的方法。上述申请中的一个实施例具有如下优点或有益效果:提高了边缘处理的可靠性,提高了图片显示的视觉完整性,且通过对图片本身的像素点配置,降低了图片边缘显示的兼容性要求。通过针对显示边缘中与页面本文档来自技高网...

【技术保护点】
1.一种图片显示边缘处理方法,其特征在于,包括:/n根据与待处理图片对应的显示区形状,获取待处理图片的显示边缘;/n在所述显示边缘的第一边缘像素点中,确定与预设的页面背景之间边界模糊的第二边缘像素点;/n对所述第二边缘像素点配置与所述页面背景形成边界区分的可视化属性信息,得到描边后的图片;/n以所述显示区形状显示所述描边后的图片。/n

【技术特征摘要】
1.一种图片显示边缘处理方法,其特征在于,包括:
根据与待处理图片对应的显示区形状,获取待处理图片的显示边缘;
在所述显示边缘的第一边缘像素点中,确定与预设的页面背景之间边界模糊的第二边缘像素点;
对所述第二边缘像素点配置与所述页面背景形成边界区分的可视化属性信息,得到描边后的图片;
以所述显示区形状显示所述描边后的图片。


2.根据权利要求1所述的方法,其特征在于,所述根据预设的显示区形状,获取待处理图片的显示边缘,包括:
根据预设的显示区形状和预设的填充属性,在所述待处理图片中确定显示区域,其中,所述显示区域是所述待处理图片以所述填充属性填充在所述显示区形状内的区域,其中,所述填充属性包括缩放属性和/或偏移属性;
将所述显示区域的边缘,作为所述待处理图片的显示边缘。


3.根据权利要求1或2所述的方法,其特征在于,在所述根据预设的显示区形状,获取待处理图片的显示边缘之前,还包括:
根据预设的图片布局和/或所述待处理图片的图片比例,获取待处理图片的显示区形状。


4.根据权利要求3所述的方法,其特征在于,所述根据预设的图片布局,获取待处理图片的显示区形状,包括:
根据预设的瀑布流式布局,获取相邻图片队列间距、页面边距和图片队列数;
根据预设的页面宽度、所述相邻图片队列间距、所述页面边距和所述图片队列数,确定图片队列的限定尺寸,其中,所述限定尺寸是在与所述图片队列的排布方向相垂直的方向上,所述图片队列的尺寸;
对所述待处理图片获取矩形显示比例;
根据所述图片队列的限定尺寸和所述矩形显示比例,获取待处理图片在瀑布流式布局中的显示区形状,其中,所述显示区形状是在与所述图片队列的排布方向相垂直的方向上满足所述限定尺寸,且符合所述矩形显示比例的矩形。


5.根据权利要求1所述的方法,其特征在于,所述在所述显示边缘的第一边缘像素点中,确定与预设的页面背景边界模糊的第二边缘像素点,包括:
获取页面背景的背景颜色信息;
对所述显示边缘的各所述第一边缘像素点,获取像素颜色信息与所述背景颜色信息的色差程度;
将所述色差程度小于预设色差阈值的所述第一边缘像素点,作为与预设的页面背景边界模糊的第二边缘像素点。


6.根据权利要求5所述的方法,其特征在于,所述获取页面...

【专利技术属性】
技术研发人员:杨茗名王群张苗
申请(专利权)人:百度在线网络技术北京有限公司
类型:发明
国别省市:北京;11

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

1