一种调整界面布局的方法、装置、设备及存储介质制造方法及图纸

技术编号:33775605 阅读:82 留言:0更新日期:2022-06-12 14:28
本申请实施例提供了一种调整界面布局的方法、装置、设备及存储介质,可应用于地图领域,该方法包括:响应于针对目标应用的触发操作,通过目标屏幕展示目标应用的适配应用界面,每个界面元素在适配应用界面中呈现的第一物理尺寸,与相应的界面元素在基准应用界面中相应呈现的第二物理尺寸相同;每个第一物理尺寸是基于界面元素在基准应用界面中的基准虚拟像素尺寸,以及目标屏幕的目标点密度确定的,从而使得目标屏幕上展示的适配应用界面中的各个界面元素,与基准屏幕上展示的基准应用界面中相应的各个界面元素的视觉呈现效果相同,故不同终端设备上呈现的适配应用界面中的界面元素的视觉呈现效果相同,进而提高对象的使用体验。使用体验。使用体验。

【技术实现步骤摘要】
一种调整界面布局的方法、装置、设备及存储介质


[0001]本专利技术实施例涉及前端
,尤其涉及一种调整界面布局的方法、装置、设备及存储介质。

技术介绍

[0002]随着终端设备的发展,对于终端设备的需求日益增长。为适应不同的需求,终端设备上可以安装各种应用程序。而应用程序的界面布局在很大程度上影响着目标对象对应用程序的使用体验。
[0003]相关技术中,一个应用程序的基准应用界面往往对应一个基准屏幕的基准分辨率,如,1280px*720px,而不同终端设备的待适配屏幕对应的目标分辨率可能是不同的;因此,为了与不同的终端设备适配,相关技术基于基准分辨率分别与不同目标分辨率之间的比例关系,相应调整基准应用界面中呈现的界面元素的物理尺寸,获得在不同终端设备上展示的适配应用界面。
[0004]由于不同终端设备对应的目标分辨率是不同的,故不同目标分辨率与基准分辨率的比例关系也是不同的,因此,采用不同的比例关系,对同一基准应用界面中的界面元素进行物理尺寸调整获得的适配应用界面也是不同的,即在不同终端设备上呈现的适配应用界面中的界面元素的物理尺寸不同,进而影响应用程序界面的视觉呈现效果。

技术实现思路

[0005]本申请实施例提供了一种调整界面布局的方法、装置、设备及存储介质,用于提高应用程序界面的视觉呈现效果。
[0006]一方面,本申请实施例提供了一种调整界面布局的方法,该方法包括:
[0007]响应于针对目标应用的触发操作,通过目标屏幕展示所述目标应用的适配应用界面,其中,所述适配应用界面中包括多个界面元素,每个所述界面元素在所述适配应用界面中呈现的第一物理尺寸,与相应的界面元素在基准应用界面中相应呈现的第二物理尺寸相同;
[0008]每个所述第一物理尺寸,是基于所述界面元素在所述适配应用界面中的目标虚拟像素尺寸,以及所述目标屏幕的目标点密度确定的,所述目标虚拟像素尺寸与所述界面元素在基准应用界面中的基准虚拟像素尺寸相同。
[0009]一方面,本申请实施例提供了一种应用界面适配的装置,该装置包括:
[0010]展示模块,用于响应于针对目标应用的触发操作,通过目标屏幕展示所述目标应用的适配应用界面,其中,所述适配应用界面中包括多个界面元素,每个所述界面元素在所述适配应用界面中呈现的第一物理尺寸,与相应的界面元素在基准应用界面中相应呈现的第二物理尺寸相同;
[0011]每个所述第一物理尺寸,是基于所述界面元素在所述适配应用界面中的目标虚拟像素尺寸,以及所述目标屏幕的目标点密度确定的,所述目标虚拟像素尺寸与所述界面元
素在基准应用界面中的基准虚拟像素尺寸相同。
[0012]可选地,还包括处理模块;
[0013]所述处理模块具体用于:
[0014]基于所述界面元素的目标虚拟像素尺寸和所述目标点密度,确定所述界面元素在所述适配应用界面中的目标像素尺寸;
[0015]基于所述界面元素的目标像素尺寸,确定所述界面元素在所述适配应用界面中呈现的第一物理尺寸。
[0016]可选地,所述处理模块还用于:
[0017]基于所述目标屏幕的目标分辨率和所述目标屏幕的原始屏幕密度,确定所述目标屏幕的有效宽度和有效高度;
[0018]基于所述有效宽度与所述基准屏幕的基准宽度之间的第一差异度,以及所述有效高度与所述基准屏幕的基准高度之间的第二差异度,确定所述目标屏幕的标准化调整方向;
[0019]基于所述标准化调整方向,对所述目标屏幕的原始像素密度进行调整,获得目标点密度。
[0020]可选地,所述处理模块还用于:
[0021]基于所述有效宽度与所述基准屏幕的基准宽度之间的第一差异度,以及所述有效高度与所述基准屏幕的基准高度之间的第二差异度,确定所述目标屏幕的标准化调整方向之前,基于所述有效宽度与所述基准宽度的比值,确定第一差异度;以及基于所述有效高度与所述基准高度的比值,确定第二差异度;
[0022]确定所述第一差异度或所述第二差异度小于1。
[0023]可选地,所述处理模块具体用于:
[0024]若所述第一差异度大于所述第二差异度,则将高度方向作为所述目标屏幕的标准化调整方向;
[0025]若所述第一差异度小于等于所述第二差异度,则将宽度方向作为所述目标屏幕的标准化调整方向。
[0026]可选地,所述处理模块具体用于:
[0027]基于所述目标分辨率,确定所述目标屏幕在所述标准化调整方向上对应的目标像素数量;
[0028]基于所述目标像素数量,以及所述基准屏幕在所述标准化调整方向上对应的基准像素数量,对所述原始屏幕密度进行调整,获得目标屏幕密度;
[0029]基于所述目标屏幕密度以及所述基准点密度,对所述原始像素密度进行调整,确定所述目标点密度。
[0030]可选地,所述适配应用界面还包括多个适配信息引导区,每个适配信息引导区用于展示与一类引导信息关联的界面元素;
[0031]每个所述适配信息引导区在所述适配应用界面中呈现的物理宽度,是根据所述适配信息引导区的初步像素尺寸和所述目标屏幕的目标宽度确定的,其中,所述适配信息引导区的初步像素尺寸,是基于相应的基准信息引导区在所述基准应用界面中的基准虚拟像素尺寸,以及所述目标点密度确定的;
[0032]每个所述适配信息引导区在所述适配应用界面中呈现的物理高度,以及每个所述适配信息引导区展示的界面元素的目标数量,是根据所述适配信息引导区的初步像素尺寸以及所述目标屏幕的目标高度确定的。
[0033]可选地,所述处理模块还用于:
[0034]基于基准宽度范围和所述基准屏幕的基准点密度,确定所述适配信息引导区的目标宽度调整范围;
[0035]基于所述初步像素尺寸,确定所述适配信息引导区的初步像素宽度;
[0036]基于所述目标屏幕的目标宽度以及所述宽度调整范围,对所述初步像素宽度进行调整,获得所述适配信息引导区的目标像素宽度,并基于所述目标像素宽度,确定所述适配信息引导区在所述适配应用界面中呈现的物理宽度。
[0037]可选地,所述处理模块具体用于:
[0038]将所述基准宽度范围对应的预设点密度和所述基准屏幕的基准点密度的比值,作为所述基准宽度调整范围的调整比例;
[0039]将所述基准宽度调整范围的上下边界值,分别与所述调整比例相乘,获得所述适配信息引导区的目标宽度调整范围。
[0040]可选地,所述处理模块还用于:
[0041]基于所述初步像素尺寸,确定所述适配信息引导区的初步像素高度;
[0042]基于所述目标高度和所述基准信息引导区的展示状态信息,确定所述初步像素高度的高度调整值;
[0043]基于所述高度调整值和所述初步像素高度,确定所述适配信息引导区的目标像素高度,并基于所述目标像素高度,确定所述适配信息引导区在所述适配应用界面中呈现的物理高度。
[0044]可选地,所述处理模块还用于:本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种应用界面适配的方法,其特征在于,包括:响应于针对目标应用的触发操作,通过目标屏幕展示所述目标应用的适配应用界面,其中,所述适配应用界面中包括多个界面元素,每个所述界面元素在所述适配应用界面中呈现的第一物理尺寸,与相应的界面元素在基准应用界面中相应呈现的第二物理尺寸相同;每个所述第一物理尺寸,是基于所述界面元素在所述适配应用界面中的目标虚拟像素尺寸,以及所述目标屏幕的目标点密度确定的,所述目标虚拟像素尺寸与所述界面元素在基准应用界面中的基准虚拟像素尺寸相同。2.如权利要求1所述的方法,其特征在于,每个所述界面元素在所述适配应用界面中呈现的第一物理尺寸,是采用以下方式确定的:基于所述界面元素的目标虚拟像素尺寸和所述目标点密度,确定所述界面元素在所述适配应用界面中的目标像素尺寸;基于所述界面元素的目标像素尺寸,确定所述界面元素在所述适配应用界面中呈现的第一物理尺寸。3.如权利要求1所述的方法,其特征在于,所述目标屏幕的目标点密度,是采用以下方式确定的:基于所述目标屏幕的目标分辨率和所述目标屏幕的原始屏幕密度,确定所述目标屏幕的有效宽度和有效高度;基于所述有效宽度与所述基准屏幕的基准宽度之间的第一差异度,以及所述有效高度与所述基准屏幕的基准高度之间的第二差异度,确定所述目标屏幕的标准化调整方向;基于所述标准化调整方向,对所述目标屏幕的原始像素密度进行调整,获得目标点密度。4.如权利要求3所述的方法,其特征在于,所述基于所述有效宽度与所述基准屏幕的基准宽度之间的第一差异度,以及所述有效高度与所述基准屏幕的基准高度之间的第二差异度,确定所述目标屏幕的标准化调整方向之前,还包括:基于所述有效宽度与所述基准宽度的比值,确定第一差异度;以及基于所述有效高度与所述基准高度的比值,确定第二差异度;确定所述第一差异度或所述第二差异度小于1。5.如权利要求4所述的方法,其特征在于,所述基于所述有效宽度与所述基准屏幕的基准宽度之间的第一差异度,以及所述有效高度与所述基准屏幕的基准高度之间的第二差异度,确定所述目标屏幕的标准化调整方向,包括:若所述第一差异度大于所述第二差异度,则将高度方向作为所述目标屏幕的标准化调整方向;若所述第一差异度小于等于所述第二差异度,则将宽度方向作为所述目标屏幕的标准化调整方向。6.如权利要求3所述的方法,其特征在于,所述基于所述标准化调整方向,对所述目标屏幕的原始像素密度进行调整,获得目标点密度,包括:基于所述目标分辨率,确定所述目标屏幕在所述标准化调整方向上对应的目标像素数量;
基于所述目标像素数量,以及所述基准屏幕在所述标准化调整方向上对应的基准像素数量,对所述原始屏幕密度进行调整,获得目标屏幕密度;基于所述目标屏幕密度以及所述基准点密度,对所述原始像素密度进行调整,确定所述目标点密度。7.如权利要求1所述的方法,其特征在于,所述适配应用界面还包括多个适配信息引导区,每个适配信息引导区用于展示与一类引导信息关联的界面元素;每个所述适配信息引导区在所述适配应用界面中呈现的物理宽度,是根据所述适配信息引导区的初步像素尺寸和所述目标屏幕的目标宽度确定的,其中,所述适配信息引导区的初步像素尺寸,是基于相应的基准信息引导区在所述基准应用界面中的基准虚拟像素尺寸,以及所述目标点密度确定的;每个所述适配信息引导区在所述适配应用界面中呈现的物理高度,以及每个所述适配信息引导区展示的界面元素的目标数量,是根据所述适配信息引导区的初步像素尺寸以及所述目标屏幕的目标高度确定的。8.如权利要求7所述的方法,其特征在于,每个所述适配信息引导区在所述适配应用界面中呈现的物理宽度,是采用以下方式确定的:基于基准宽度范围和所述基准屏幕的基准点密度,确定所述适配信息引导区的目标宽度调整范围;基于所述初步像素尺寸,确定所述适配信息引导区的初步像素宽度;基于所述目标屏幕的目标宽度以及所述宽度调整范围,对所述初步像素宽度进行调整,获得所述适配信息引导区的目标像素宽度,并基于所述目标像素宽度,确定所述适配信息引导区在所述适配应用界面中呈现的物理宽度。9.如权利要求8所述的方法,其特征在于,所述基于基准宽度范围和所述基准屏幕的基准点密度,确定所述适配信息引导区的目标宽度调整范围,包括:将所述基准宽度范围对应的预设点密度和所述基准屏幕的基准点密...

【专利技术属性】
技术研发人员:赵鹏程张洪龙江少波蔡俊林李戈朱雷
申请(专利权)人:腾讯科技深圳有限公司
类型:发明
国别省市:

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

1