本申请提供的控件适配方法、装置、电子设备及存储介质中。该电子设备基于参考屏幕中第一控件区域的形状，将在当前屏幕中确定形状相同的第二控件区域；并基于第一控件在第一控件区域中的相对位置以及相对尺寸，确定对应第二控件在第二控件区域中的尺寸以及显示位置，以实现第二控件在第二控件区域中的尺寸以及位置跟随第二控件区域的尺寸进行等比缩放，避免其中的控件出现重叠、错位等现象。错位等现象。错位等现象。
【技术实现步骤摘要】
控件适配方法、装置、电子设备及存储介质
[0001]本申请涉及计算机领域，具体而言，涉及一种控件适配方法、装置、电子设备及存储介质。
技术介绍
[0002]同一应用程序在跨设备使用时，需要根据屏幕尺寸调整应用程序显示界面中控件的尺寸以及显示位置，以适应不同屏幕尺寸的设备。
[0003]然而，经专利技术人研究发现，目前根据屏幕尺寸调整程序显示界面中控件的尺寸以及显示位置的方案中，依据屏幕的长或者宽确定控件的尺寸；而控件的显示位置则同时依据屏幕的长以及宽，会导致控件显示位置与显示尺寸的调整比例不同步，继而在一些尺寸的屏幕中出现控件重叠、错位等现象。
技术实现思路
[0004]为了克服现有技术中的至少一个不足，第一方面，本申请实施例提供一种控件适配方法，应用于电子设备，所述方法包括：
[0005]获取参考屏幕中第一控件区域的形状，其中，所述第一控件区域中包括至少一个第一控件；
[0006]在当前屏幕中确定出与所述第一控件区域形状相同的第二控件区域，其中，所述第二控件区域的尺寸与所述当前屏幕的尺寸成正相关；
[0007]根据所述第二控件区域的尺寸生成与各所述第一控件相对应的第二控件，其中，各所述第二控件与所述二控件区域的相对尺寸关系满足各所述第一控件与所述第一控件区域的相对尺寸关系；
[0008]将各所述第二控件显示至所述第二控件区域，其中，各所述第二控件在所述第二控件区域中的相对位置关系满足各所述第一控件在所述第一控件区域中的相对位置关系。
[0009]第二方面，本申请实施例提供一种控件适配装置，应用于电子设备，所述控件适配装置包括：
[0010]形状获取模块，用于获取参考屏幕中第一控件区域的形状，其中，所述第一控件区域中包括至少一个第一控件；
[0011]区域确定模块，用于在当前屏幕中确定出与所述第一控件区域形状相同的第二控件区域，其中，所述第二控件区域的尺寸与所述当前屏幕的尺寸成正相关；
[0012]控件生成模块，用于根据所述第二控件区域的尺寸生成与各所述第一控件相对应的第二控件，其中，各所述第二控件与所述二控件区域的相对尺寸关系满足各所述第一控件与所述第一控件区域的相对尺寸关系；
[0013]控件显示模块，用于将各所述第二控件显示至所述第二控件区域，其中，各所述第二控件在所述第二控件区域中的相对位置关系满足各所述第一控件在所述第一控件区域中的相对位置关系。
[0014]第三方面，本申请实施例提供一种电子设备，所述电子设备包括处理器以及存储器，所述存储器存储有计算机程序，所述计算机程序被处理器执行时，实现所述的控件适配方法。
[0015]第四方面，本申请实施例提供一种存储介质，所述存储介质存储有计算机程序，所述计算机程序被处理器执行时，实现所述的控件适配方法。
[0016]相对于现有技术而言，本申请具有以下有益效果：
[0017]本申请实施例提供的控件适配方法、装置、电子设备及存储介质中。该电子设备基于参考屏幕中第一控件区域的形状，将在当前屏幕中确定形状相同的第二控件区域；并基于第一控件在第一控件区域中的相对位置以及相对尺寸，确定对应第二控件在第二控件区域中的尺寸以及显示位置，以实现第二控件在第二控件区域中的尺寸以及位置跟随第二控件区域的尺寸进行等比缩放，避免其中的控件出现重叠、错位等现象。
附图说明
[0018]为了更清楚地说明本申请实施例的技术方案，下面将对实施例中所需要使用的附图作简单地介绍，应当理解，以下附图仅示出了本申请的某些实施例，因此不应被看作是对范围的限定，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他相关的附图。
[0019]图1为本申请实施例提供的参考屏幕显示效果示意图；
[0020]图2为本申请实施例提供的当前屏幕显示效果示意图；
[0021]图3为本申请实施例提供的电子设备结构示意图；
[0022]图4为本申请实施例提供的控件适配方法步骤示意图；
[0023]图5A
‑
图5C为本申请实施例提供的第一控件区域划分结果示意图；
[0024]图6A
‑
图6B为本申请实施例提供的相对位置关系示意图；
[0025]图7为本申请实施例提供的伸缩区域示意图；
[0026]图8为本申请实施例提供的第二控件区域位置确定方式示意图；
[0027]图9为本申请实施例提供的控件适配装置示意图。
[0028]图标：120
‑
存储器；130
‑
处理器；201
‑
第一控件；202
‑
第二控件；601
‑
形状获取模块；602
‑
区域确定模块；603
‑
控件生成模块；604
‑
控件显示模块。
具体实施方式
[0029]为使本申请实施例的目的、技术方案和优点更加清楚，下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本申请一部分实施例，而不是全部的实施例。通常在此处附图中描述和示出的本申请实施例的组件可以以各种不同的配置来布置和设计。
[0030]因此，以下对在附图中提供的本申请的实施例的详细描述并非旨在限制要求保护的本申请的范围，而是仅仅表示本申请的选定实施例。基于本申请中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本申请保护的范围。
[0031]应注意到：相似的标号和字母在下面的附图中表示类似项，因此，一旦某一项在一
个附图中被定义，则在随后的附图中不需要对其进行进一步定义和解释。
[0032]在本申请的描述中，需要说明的是，术语“中心”、“上”、“下”、“左”、“右”、“竖直”、“水平”、“内”、“外”等指示的方位或位置关系为基于附图所示的方位或位置关系，或者是该专利技术产品使用时惯常摆放的方位或位置关系，仅是为了便于描述本申请和简化描述，而不是指示或暗示所指的装置或元件必须具有特定的方位、以特定的方位构造和操作，因此不能理解为对本申请的限制。此外，术语“第一”、“第二”、“第三”等仅用于区分描述，而不能理解为指示或暗示相对重要性。
[0033]相关技术中，依据屏幕的长或者宽确定控件的尺寸；而控件的显示位置则同时依据屏幕的长以及宽，会导致控件显示位置与显示尺寸的调整比例不同步，继而在一些尺寸的屏幕中出现控件重叠的现象。
[0034]其中，上述控件可以是，但不限于按键、文本组件、输入组件、图片显示组件等，本领域技术人员可以根据实际需求进行适应性调整。
[0035]为了方便阐述上述相关技术，下面结合图1所示的示意图进行示例性阐述。如图1所示，在分辨率为1080
×
1920的参考屏幕中，显示有两矩形按键，将上述两个按键在屏幕中的显示配置信息进行序列化。其中，序本文档来自技高网...
【技术保护点】
【技术特征摘要】
1.一种控件适配方法，其特征在于，应用于电子设备，所述方法包括：获取参考屏幕中第一控件区域的形状，其中，所述第一控件区域中包括至少一个第一控件；在当前屏幕中确定出与所述第一控件区域形状相同的第二控件区域，其中，所述第二控件区域的尺寸与所述当前屏幕的尺寸成正相关；根据所述第二控件区域的尺寸生成与各所述第一控件相对应的第二控件，其中，各所述第二控件与所述二控件区域的相对尺寸关系满足各所述第一控件与所述第一控件区域的相对尺寸关系；将各所述第二控件显示至所述第二控件区域，其中，各所述第二控件在所述第二控件区域中的相对位置关系满足各所述第一控件在所述第一控件区域中的相对位置关系。2.根据权利要求1所述的控件适配方法，其特征在于，所述在当前屏幕中确定出与所述第一控件区域形状相同的第二控件区域，包括：获取当前屏幕的第一尺寸参数；根据所述第一尺寸参数确定所述第二控件区域的第二尺寸参数，其中，所述第一尺寸参数与所述第二尺寸参数之间满足预设比例关系；根据所述第二尺寸参数，确定所述第二控件区域的尺寸；根据所述第一控件区域在所述参考屏幕中的相对位置关系，确定所述第二控件区域在所述当前屏幕中的显示位置。3.根据权利要求2所述的控件适配方法，其特征在于，所述根据所述第一控件区域在所述参考屏幕中的相对位置关系，确定所述第二控件区域在所述当前屏幕中的显示位置，包括：获取所述参考屏幕中第一伸缩区域之间的分割比例，以及所述第一控件区域与各所述第一伸缩区域之间的顺序关系；其中，各所述第一伸缩区域为所述第一控件区域从所述参考屏幕中划分出的屏幕区域；根据所述第二控件区域的尺寸，将所述当前屏幕中剩余的区域按照所述分割比例划分成第二伸缩区域；根据所述第二伸缩区域之间的排列顺序，按照所述顺序关系确定所述第二控件区域在所述当前屏幕中的显示位置。4.根据权利要求2所述的控件适配方法，其特征在于，所述第二控件区域成矩形，所述第二尺寸参数为所述第二控件区的长或者宽；所述根据所述第一尺寸参数确定所述第二控件区域的第二尺寸参数，包括：将所述第一尺寸参数作为所述第二控件区的长或者宽；所述根据所述第二尺寸参数，确定所述第二控件区域的尺寸，包括：根据所述第二控件区的长宽比，确定所述第二控件区域的尺寸。5.根据权利要求1所述的控件适配方法，其特征在于，所述电子设备在所述当前屏幕中显示有第一图层以及第二图层，各所述...
【专利技术属性】
技术研发人员：陈佳楠，
申请(专利权)人：广州虎牙科技有限公司，
类型：发明
国别省市：
还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。