图片展示方法、图片展示装置和电子设备制造方法及图纸

技术编号:30227395 阅读:11 留言:0更新日期:2021-09-29 09:54
本申请涉及电子信息技术领域,公开一种图片展示方法。该图片展示方法包括确定目标展示区域,以及待展示的目标图片集,目标图片集包括多个图片;根据目标展示区域的目标展示宽度和多个图片的尺寸相关信息,确定多个图片各自关联的占位容器在目标展示区域的目标排布方式;将多个图片依次在其关联的占位容器中进行展示,以使目标图片集展示于目标展示区域。本申请通过重新确定占位容器的排布方式,进而将多个图片按顺序依次展示于各自关联的占位容器所在位置,既实现了在展示多个不同尺寸的图片时,不改变图片的排列顺序,能够通过展示图片表达更多信息,又兼顾了图片展示于目标展示区域的视觉效果。本申请还公开一种图片展示装置及电子设备。置及电子设备。置及电子设备。

【技术实现步骤摘要】
图片展示方法、图片展示装置和电子设备


[0001]本申请涉及电子信息
,例如涉及一种图片展示方法、图片展示装置和电子设备。

技术介绍

[0002]目前,在网页上展示一组尺寸不同的图片时,网页通常预设有位置固定的占位容器,通过对不同尺寸的图片进行缩放和重新排序等操作,将图片展示于预设的占位容器中,以实现网页的良好视觉效果。
[0003]在实现本公开实施例的过程中,发现相关技术中至少存在如下问题:
[0004]对于图片的顺序具有一定作用或含义时,通过上述方式进行图片的展示,会导致图片顺序被打乱,无法通过图片展示实现表达特定含义的展示目的。

技术实现思路

[0005]为了对披露的实施例的一些方面有基本的理解,下面给出了简单的概括。所述概括不是泛泛评述,也不是要确定关键/重要组成元素或描绘这些实施例的保护范围,而是作为后面的详细说明的序言。
[0006]本公开实施例提供了一种图片展示方法、图片展示装置和电子设备,以解决现有的图片展示方式为了较好的视觉效果,将不同尺寸的图片顺序打乱进行展示,无法通过展示图片顺序表达含义的技术问题。
[0007]在一些实施例中,所述图片展示方法包括:确定目标展示区域,以及待展示的目标图片集,目标图片集包括多个图片;根据目标展示区域的目标展示宽度和多个图片的尺寸相关信息,确定多个图片各自关联的占位容器在目标展示区域的目标排布方式;将多个图片依次在其关联的占位容器中进行展示,以使目标图片集展示于目标展示区域。
[0008]在一些实施例中,所述图片展示装置包括:获取模块、确定模块和执行模块;获取模块,被配置为确定目标展示区域,以及待展示的目标图片集,目标图片集包括多个图片;确定模块,被配置为根据目标展示区域的目标展示宽度和多个图片的尺寸相关信息,确定多个图片各自关联的占位容器在目标展示区域的目标排布方式;执行模块,被配置为将多个图片依次在其关联的占位容器中进行展示,以使目标图片集展示于目标展示区域。
[0009]在一些实施例中,所述图片展示装置包括处理器和存储有程序指令的存储器,其中,处理器在运行程序指令时,执行上述的图片展示方法。
[0010]在一些实施例中,所述电子设备包括如上述的图片展示装置。
[0011]本公开实施例提供的图片展示方法、图片展示装置和电子设备,可以实现以下技术效果:
[0012]通过根据待展示的多个图片的尺寸相关信息以及目标展示区域的宽度信息,确定多个图片各自关联的占位容器在目标展示区域的目标排布方式;将多个图片依次在各自关联的占位容器中进行展示,以使目标图片集有效地展示于目标展示区域;这样,根据待展示
图片和目标展示区域的相关信息,重新确定占位容器的排布方式,进而将多个图片按顺序依次展示于各自关联的占位容器所在位置,既实现了在展示多个不同尺寸的图片时,不改变图片的排列顺序,能够通过展示图片表达更多信息,又兼顾了图片展示于目标展示区域的视觉效果,使图片展示更加美观。
[0013]以上的总体描述和下文中的描述仅是示例性和解释性的,不用于限制本申请。
附图说明
[0014]一个或多个实施例通过与之对应的附图进行示例性说明,这些示例性说明和附图并不构成对实施例的限定,附图中具有相同参考数字标号的元件示为类似的元件,附图不构成比例限制,并且其中:
[0015]图1是本公开实施例提供的一个图片展示方法的示意图;
[0016]图2是本公开实施例提供的一个网页的图片展示的示意图;
[0017]图3是本公开实施例提供的一个图片展示装置的示意图;
[0018]图4是本公开实施例提供的另一个图片展示装置的示意图。
[0019]附图标记:
[0020]10、获取模块;20、确定模块;30、执行模块;100、处理器;101、存储器;102、通信接口;103、总线;110、目标展示区域;111、占位容器。
具体实施方式
[0021]为了能够更加详尽地了解本公开实施例的特点与
技术实现思路
,下面结合附图对本公开实施例的实现进行详细阐述,所附附图仅供参考说明之用,并非用来限定本公开实施例。在以下的技术描述中,为方便解释起见,通过多个细节以提供对所披露实施例的充分理解。然而,在没有这些细节的情况下,一个或多个实施例仍然可以实施。在其它情况下,为简化附图,熟知的结构和装置可以简化展示。
[0022]本公开实施例的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象,而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换,以便这里描述的本公开实施例的实施例。此外,术语“包括”和“具有”以及他们的任何变形,意图在于覆盖不排他的包含。
[0023]除非另有说明,术语“多个”表示两个或两个以上。
[0024]本公开实施例中,字符“/”表示前后对象是一种“或”的关系。例如,A/B表示:A或B。
[0025]术语“和/或”是一种描述对象的关联关系,表示可以存在三种关系。例如,A和/或B,表示:A或B,或,A和B这三种关系。
[0026]结合图1所示,本公开实施例提供一种图片展示方法,包括:
[0027]S01、确定目标展示区域,以及待展示的目标图片集,目标图片集包括多个图片。
[0028]S02、根据目标展示区域的目标展示宽度和多个图片的尺寸相关信息,确定多个图片各自关联的占位容器在目标展示区域的目标排布方式。
[0029]S03、将多个图片依次在其关联的占位容器中进行展示,以使目标图片集展示于目标展示区域。
[0030]采用本公开实施例提供的图片展示方法,能够通过根据待展示的多个图片的尺寸
相关信息以及目标展示区域的宽度信息,确定多个图片各自关联的占位容器在目标展示区域的目标排布方式;将多个图片依次在各自关联的占位容器中进行展示,以使目标图片集有效地展示于目标展示区域;这样,根据待展示图片和目标展示区域的相关信息,重新确定占位容器的排布方式,进而将多个图片按顺序依次展示于各自关联的占位容器所在位置,既实现了在展示多个不同尺寸的图片时,不改变图片的排列顺序,能够通过展示图片表达更多信息,又兼顾了图片展示于目标展示区域的视觉效果,使图片展示更加美观。
[0031]可选地,执行上述步骤的执行主体可以为服务器,服务器与需要展示图片的电子设备通过电子设备的通信模块建立通信连接。电子设备的通信模块将需要展示的目标图片集发送给服务器;服务器在接收到待展示的目标图片集的情况下,获取电子设备的目标展示区域,并确定目标展示区域的目标展示宽度;服务器确定目标图片集包含的多个图片的尺寸相关信息,并根据目标展示区域的目标展示宽度和多个图片的尺寸相关信息,确定多个图片各自关联的占位容器在目标展示区域的目标排布方式;服务器将确定的占位容器的目标排布方式发送给电子设备;电子设备根据接收到的目标排布方式,将多个图片依次在其关联的占位容器中进行展示以使目标图片集展示于电子设本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种图片展示方法,其特征在于,包括:确定目标展示区域,以及待展示的目标图片集,所述目标图片集包括多个图片;根据所述目标展示区域的目标展示宽度和所述多个图片的尺寸相关信息,确定所述多个图片各自关联的占位容器在所述目标展示区域的目标排布方式;将所述多个图片依次在其关联的占位容器中进行展示,以使目标图片集展示于所述目标展示区域。2.根据权利要求1所述的图片展示方法,其特征在于,所述尺寸相关信息包括图片的实际宽度数据、实际高度数据以及图片的宽高比数据;所述根据所述目标展示区域的目标展示宽度和所述多个图片的尺寸相关信息,确定所述多个图片各自关联的占位容器在所述目标展示区域的目标排布方式,包括:根据所述多个图片的实际高度数据,确定所述目标图片集中图片的平均高度数据;根据所述平均高度数据、所述多个图片的宽高比数据以及所述目标展示区域的目标展示宽度,确定所述多个图片各自关联的占位容器的尺寸信息;根据所述尺寸信息,确定所述目标排布方式。3.根据权利要求2所述的图片展示方法,其特征在于,所述尺寸信息包括占位容器的高度参数和宽度参数;所述根据所述平均高度数据、所述多个图片的宽高比数据以及所述目标展示区域的目标展示宽度,确定所述多个图片各自关联的占位容器的尺寸信息,包括:将所述平均高度数据与所述多个图片的宽高比数据的乘积作为所述多个图片各自对应的占位容器的宽度参数。4.根据权利要求3所述的图片展示方法,其特征在于,还包括:将所述平均高度数据作为所述多个图片各自对应的占位容器的高度参数。5.根据权利要求2所述的图片展示方法,其特征在于,所述尺寸信息包括占位容器的宽度参数;所述根据所述尺寸信息,...

【专利技术属性】
技术研发人员:刘超陈合孙泽琦
申请(专利权)人:海尔智家股份有限公司
类型:发明
国别省市:

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

1