CN112817507A - 控件适配方法、装置、电子设备及存储介质 - Google Patents

Abstract

本申请提供的控件适配方法、装置、电子设备及存储介质中。该电子设备基于参考屏幕中第一控件区域的形状，将在当前屏幕中确定形状相同的第二控件区域；并基于第一控件在第一控件区域中的相对位置以及相对尺寸，确定对应第二控件在第二控件区域中的尺寸以及显示位置，以实现第二控件在第二控件区域中的尺寸以及位置跟随第二控件区域的尺寸进行等比缩放，避免其中的控件出现重叠、错位等现象。

Description

控件适配方法、装置、电子设备及存储介质

技术领域

本申请涉及计算机领域，具体而言，涉及一种控件适配方法、装置、电子设备及存储介质。

背景技术

同一应用程序在跨设备使用时，需要根据屏幕尺寸调整应用程序显示界面中控件的尺寸以及显示位置，以适应不同屏幕尺寸的设备。

然而，经发明人研究发现，目前根据屏幕尺寸调整程序显示界面中控件的尺寸以及显示位置的方案中，依据屏幕的长或者宽确定控件的尺寸；而控件的显示位置则同时依据屏幕的长以及宽，会导致控件显示位置与显示尺寸的调整比例不同步，继而在一些尺寸的屏幕中出现控件重叠、错位等现象。

发明内容

为了克服现有技术中的至少一个不足，第一方面，本申请实施例提供一种控件适配方法，应用于电子设备，所述方法包括：

获取参考屏幕中第一控件区域的形状，其中，所述第一控件区域中包括至少一个第一控件；

在当前屏幕中确定出与所述第一控件区域形状相同的第二控件区域，其中，所述第二控件区域的尺寸与所述当前屏幕的尺寸成正相关；

根据所述第二控件区域的尺寸生成与各所述第一控件相对应的第二控件，其中，各所述第二控件与所述二控件区域的相对尺寸关系满足各所述第一控件与所述第一控件区域的相对尺寸关系；

将各所述第二控件显示至所述第二控件区域，其中，各所述第二控件在所述第二控件区域中的相对位置关系满足各所述第一控件在所述第一控件区域中的相对位置关系。

第二方面，本申请实施例提供一种控件适配装置，应用于电子设备，所述控件适配装置包括：

形状获取模块，用于获取参考屏幕中第一控件区域的形状，其中，所述第一控件区域中包括至少一个第一控件；

区域确定模块，用于在当前屏幕中确定出与所述第一控件区域形状相同的第二控件区域，其中，所述第二控件区域的尺寸与所述当前屏幕的尺寸成正相关；

控件生成模块，用于根据所述第二控件区域的尺寸生成与各所述第一控件相对应的第二控件，其中，各所述第二控件与所述二控件区域的相对尺寸关系满足各所述第一控件与所述第一控件区域的相对尺寸关系；

控件显示模块，用于将各所述第二控件显示至所述第二控件区域，其中，各所述第二控件在所述第二控件区域中的相对位置关系满足各所述第一控件在所述第一控件区域中的相对位置关系。

第三方面，本申请实施例提供一种电子设备，所述电子设备包括处理器以及存储器，所述存储器存储有计算机程序，所述计算机程序被处理器执行时，实现所述的控件适配方法。

第四方面，本申请实施例提供一种存储介质，所述存储介质存储有计算机程序，所述计算机程序被处理器执行时，实现所述的控件适配方法。

相对于现有技术而言，本申请具有以下有益效果：

本申请实施例提供的控件适配方法、装置、电子设备及存储介质中。该电子设备基于参考屏幕中第一控件区域的形状，将在当前屏幕中确定形状相同的第二控件区域；并基于第一控件在第一控件区域中的相对位置以及相对尺寸，确定对应第二控件在第二控件区域中的尺寸以及显示位置，以实现第二控件在第二控件区域中的尺寸以及位置跟随第二控件区域的尺寸进行等比缩放，避免其中的控件出现重叠、错位等现象。

附图说明

为了更清楚地说明本申请实施例的技术方案，下面将对实施例中所需要使用的附图作简单地介绍，应当理解，以下附图仅示出了本申请的某些实施例，因此不应被看作是对范围的限定，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他相关的附图。

图1为本申请实施例提供的参考屏幕显示效果示意图；

图2为本申请实施例提供的当前屏幕显示效果示意图；

图3为本申请实施例提供的电子设备结构示意图；

图4为本申请实施例提供的控件适配方法步骤示意图；

图5A-图5C为本申请实施例提供的第一控件区域划分结果示意图；

图6A-图6B为本申请实施例提供的相对位置关系示意图；

图7为本申请实施例提供的伸缩区域示意图；

图8为本申请实施例提供的第二控件区域位置确定方式示意图；

图9为本申请实施例提供的控件适配装置示意图。

图标：120-存储器；130-处理器；201-第一控件；202-第二控件；601-形状获取模块；602-区域确定模块；603-控件生成模块；604-控件显示模块。

具体实施方式

为使本申请实施例的目的、技术方案和优点更加清楚，下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本申请一部分实施例，而不是全部的实施例。通常在此处附图中描述和示出的本申请实施例的组件可以以各种不同的配置来布置和设计。

因此，以下对在附图中提供的本申请的实施例的详细描述并非旨在限制要求保护的本申请的范围，而是仅仅表示本申请的选定实施例。基于本申请中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本申请保护的范围。

应注意到：相似的标号和字母在下面的附图中表示类似项，因此，一旦某一项在一个附图中被定义，则在随后的附图中不需要对其进行进一步定义和解释。

在本申请的描述中，需要说明的是，术语“中心”、“上”、“下”、“左”、“右”、“竖直”、“水平”、“内”、“外”等指示的方位或位置关系为基于附图所示的方位或位置关系，或者是该发明产品使用时惯常摆放的方位或位置关系，仅是为了便于描述本申请和简化描述，而不是指示或暗示所指的装置或元件必须具有特定的方位、以特定的方位构造和操作，因此不能理解为对本申请的限制。此外，术语“第一”、“第二”、“第三”等仅用于区分描述，而不能理解为指示或暗示相对重要性。

相关技术中，依据屏幕的长或者宽确定控件的尺寸；而控件的显示位置则同时依据屏幕的长以及宽，会导致控件显示位置与显示尺寸的调整比例不同步，继而在一些尺寸的屏幕中出现控件重叠的现象。

其中，上述控件可以是，但不限于按键、文本组件、输入组件、图片显示组件等，本领域技术人员可以根据实际需求进行适应性调整。

为了方便阐述上述相关技术，下面结合图1所示的示意图进行示例性阐述。如图1所示，在分辨率为1080×1920的参考屏幕中，显示有两矩形按键，将上述两个按键在屏幕中的显示配置信息进行序列化。其中，序列化的结果为按键与屏幕之间的相对尺寸关系，按键的中心位置与屏幕之间的相对位置关系。

其中，上述尺寸关系为按键高度与屏幕高度之间的比值；相对位置关系为按键中心位置对屏幕宽度的分割比例，以及对屏幕高度的分割比例。

如图2所示，在分辨率为1536×2152的当前屏幕中，基于上述显示配置信息进行反序列化操作。电子设备先获取当前屏幕的高度，然后根据上述按键高度与屏幕高度之间的比值，确定各按键在当前屏幕中的高度；进一步地，根据按键的长宽比，确定各按键在当前屏幕中的尺寸。

在确定各案件尺寸之后，该电子设备根据上述相对位置关系，确定各按键在当前屏幕中的位置。

由此可见，按键的尺寸跟随屏幕高度的增加而变大，跟随屏幕高度的降低而变小。而按键在屏幕中的位置，则受到屏幕宽度与高度的共同影响，这就会导致按键尺寸与两按键之间的距离的调整比例不同步。

应理解的是，按键尺寸与两按键之间的距离同步变化时，按键的高或者宽增加N倍时，两按键之间的距离同样增加N倍。

因此，当按键尺寸的变化程度超过两按键之间距离的变化程度时，上述两按键将会出现如图2所示的重叠现象。

鉴于此，本申请实施例提供一种控件适配方法，应用于电子设备。在该控件适配方法中，电子设备将参考屏幕中的控件划分到第一控件区域，其中，该第一控件区域属于参考屏幕中的局部区域；然后，在当前屏幕中将第一控件区域中的内容进行等比缩放。

由于第一控件区属于参考屏幕的局部区域，继而在当前屏幕中进行等比缩放时不受当前屏幕尺寸的限制，能够获得与第一控件区域形状相同的第二控件区域，使得其中的控件不会出现重叠、错位等现象。

其中，用于执行上述控件适配方法的电子设备，可以是，但不限于，智能手机、个人电脑(Personal Computer，PC)、平板电脑、个人数字助理(Personal Digital Assistant，PDA)、移动上网设备(Mobile Internet Device，MID)等。

如图3所示，为上述电子设备的结构示意图。该电子设备包括存储器120、处理器130。存储器中存储有计算机程序，该计算机程序被处理器执行时，实现上述控件适配方法。

该存储器120、处理器130以及其他可能的各元件相互之间直接或间接地电性连接，以实现数据的传输或交互。例如，这些元件相互之间可通过一条或多条通讯总线或信号线实现电性连接。

其中，该存储器120可以是，但不限于，随机存取存储器(Random Access Memory，RAM)，只读存储器(Read Only Memory，ROM)，可编程只读存储器(Programmable Read-OnlyMemory，PROM)，可擦除只读存储器(Erasable Programmable Read-Only Memory，EPROM)，电可擦除只读存储器(Electric Erasable Programmable Read-Only Memory，EEPROM)等。其中，存储器120用于存储程序，该处理器130在接收到执行指令后，执行该程序。

该处理器130可能是一种集成电路芯片，具有信号的处理能力。上述的处理器可以是通用处理器，包括中央处理器(Central Processing Unit，简称CPU)、网络处理器(Network Processor，简称NP)等；还可以是数字信号处理器(DSP)、专用集成电路(ASIC)、现场可编程门阵列(FPGA)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件。可以实现或者执行本申请实施例中的公开的各方法、步骤及逻辑框图。通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。

下面结合图4所示的步骤示意图，对上述控件适配方法进行详细阐述。如图4所示，该控件适配方法包括：

步骤S101，获取参考屏幕中第一控件区域的形状。

其中，第一控件区域中包括至少一个第一控件。开发人员可以事先根据控件在参考屏幕中的位置，将可能出现重叠、错位的第一控件划分到同一个第一控件区域。当然，具体划分策略以及划分方式，本领域技术人员可以根据实际需求进行适应性调整。

在一种示例中，如图5A所示，参考屏幕中显示有控件A，控件B，控件C，控件D、控件E。

由于控件B与控件C在距离上较为靠近，因此，可以将控件B与控件C沿屏幕的高度方向，划分到一个第一控件区域。

由于控件D与控件E在距离上较为靠近，因此，可以将控件D与控件E沿屏幕的高度方向，划分到一个第一控件区域。

将剩余的控件A沿屏幕的高度方向，划分到一个第一控件区域。

在另外一种示例中，如图5B所示，参考屏幕中的各控件的显示位置与图5A中的显示位置相同。

可以根据需求，将控件A、控件B与控件C沿屏幕的高度方向，划分到一个第一控件区域；将控件D与控件E沿屏幕的高度方向，划分到一个第一控件区域。

另外，第一控件区域的划分方向还可以是其他方向。在另外一种示例性，如图5C所示，可以将控件A、控件C、控件D以及控件E，沿屏幕的宽度方向，划分到一个第一控件区域；将控件B沿屏幕的宽度方向，划分到一个第一控件区域。

当然，第一控件区域可以在包括第一控件的情况下，适当的扩大范围或者缩小范围。

步骤S102，在当前屏幕中确定出与第一控件区域形状相同的第二控件区域。

其中，第二控件区域的尺寸与当前屏幕的尺寸成正相关。应理解的是，为了显示界面与屏幕尺寸相适应，以达到视觉上的协调。合理的方式为，参考屏幕中的第一控件区域跟随屏幕变大而变大，随屏幕变小而变小。

该电子设备根据第一控件区域的形状，在当前屏幕中确定与第一控件区域的形状相同的第二控件区域。其中，若第一控件区域为矩形，则可以将第一控件区域的形状以矩形长宽比的形式进行表示，若第一控件区域为圆形，则可以将第一控件区域的形状以直径的形式进行表示。

步骤S103，根据第二控件区域的尺寸生成与各第一控件相对应的第二控件。

其中，各第二控件与二控件区域的相对尺寸关系满足各第一控件与第一控件区域的相对尺寸关系。

在一种示例中，上述相对尺寸关系可以是控件与控件区域之间的面积比值。例如，在参考屏幕中，第一控件的面积占据整个第一控件区域的25％，则在当前屏幕中，同样需要第二控件的面积占据整个第二控件区域的25％。

在另外一种示例中，上述相对尺寸关系可以是控件的指定尺寸参数与控件区域的宽或者高之间的比值。

例如，第一控件与第二控件可以是圆形。该相对尺寸关系可以是第一控件的直径与第一控件区域高度之间的比值，第二控件的直径与第二控件区域高度之间的比值，并且，两比值需要相同。

步骤S104，将各第二控件显示至第二控件区域。

其中，各第二控件在第二控件区域中的相对位置关系满足各第一控件在第一控件区域中的相对位置关系。

示例性的，如图6A所示，参考屏幕中圆形的第一控件201位于参考屏幕的左下角。其中，该第一控件201的中心将第一控件区域的高划分成1:3的比例，将参第一控件区域的宽划分成1:4的比例。

为了保持相对位置的不变，如图6B所示，在第二控件区域中，与第一控件201相对应第二控件202，同样将第二控件区域的高划分成1:3的比例，将参第二控件区域的宽划分成1:4的比例。

在上述控件适配方法中，该电子设备基于参考屏幕中第一控件区域的形状，将在当前屏幕中确定形状相同的第二控件区域；并基于第一控件201在第一控件区域中的相对位置以及相对尺寸，确定对应第二控件202在第二控件区域中的尺寸以及显示位置，以实现第二控件202在第二控件区域中的尺寸以及位置跟随第二控件区域的尺寸进行等比缩放，避免其中的控件出现重叠、错位等现象。

其中，在当前屏幕中确定出与第一控件区域形状相同的第二控件区域时。作为一种可能的实现方式，上述步骤S102，包括以下子步骤：

步骤S102-1，获取当前屏幕的第一尺寸参数。

步骤S102-2，根据第一尺寸参数确定第二控件区域的第二尺寸参数。

其中，第一尺寸参数与第二尺寸参数之间满足预设比例关系。

步骤S102-3，根据第二尺寸参数，确定第二控件区域的尺寸。

示例性的，第二控件区域可以是矩形。当前屏幕的第一尺寸参数为当前屏幕的高，将当前屏幕的高作为第二控件区域的高(长度)，即上述预设比例为1:1；并根据矩形的长宽比，确定第二控件区域的宽。

假定当前屏幕的高为40，且据矩形的长宽比为4:3，则该第二控件区域的宽为10。因此，第二控件区域为高40，宽10，面积为400的第二控件区域。

步骤S102-4，根据第一控件区域在参考屏幕中的相对位置关系，确定第二控件区域在当前屏幕中的显示位置。

因此，上述实现方式中，当前屏幕中与第一控件区域相对应第二控件区域，跟随当前屏幕尺寸变大而变大，随屏幕尺寸变小而变小，继而达到适应屏幕尺寸变化的目的。

本申请实施例中，还考虑到参考屏幕中各控件之间的相对位置，需要在当前屏幕中不出现过于明显的变化。

鉴于此，电子设备获取参考屏幕中第一伸缩区域之间的分割比例，以及第一控件区域与各第一伸缩区域之间的顺序关系。

其中，各第一伸缩区域为第一控件区域从参考屏幕中划分出的屏幕区域；

基于第二控件区域的尺寸，电子设备将当前屏幕中剩余的区域按照分割比例划分成第二伸缩区域；然后，根据第二伸缩区域之间的排列顺序，按照顺序关系确定第二控件区域在当前屏幕中的显示位置。

基于上述实施方式，下面结合图7对第二控件区域显示位置的确定方式进行示例性说明。

如图7所示，第一控件区域基于显示位置，从参考屏幕中划分出至少一个第一伸缩区域。其中，第一控件区域相较于第一伸缩区域，其区别在于：

当前屏幕中，与第一控件区域相对应的第二控件区域，两者的形状相同；而当前屏幕中，与第一伸缩区域相对应的第二伸缩区域，则会随屏幕尺寸的变化而进行适应性变化。

如图7所示，由于各第一伸缩区域的高度相同，区别在于宽度不同，因此，各第一伸缩区域的宽度之比即为上述分割比例。

并且，第一控件区域与第一伸缩区域之间存在顺序关系。如图7所示，假定按照从左到右的顺序，对第一伸缩区域进行按序编号。

则包括控件A的第一伸缩区域位于编号为1、2的第一伸缩区域之间；包括控件B、控件C的第一控件区域位于编号为2、3的第一伸缩区域之间；包括控件D、控件E的第一控件区域位于编号为3、4的第一伸缩区域之间。

如图8所示，基于上述顺序关系以及分割比例，电子设备根据第二控件区域的尺寸，将当前屏幕中剩余的区域，按照分割比例划分成第二伸缩区域。

然后，电子设备根据第二伸缩区域的排列顺序，按照顺序关系确定第二控件区域在当前屏幕中的位置。

由此可见，在上述实施例中，电子设备将第一控件区域在当前屏幕中进行等比缩放，将剩余的区域按照分割比例进行划分，然后按照顺序关系确定第二控件区域在在当前屏幕中的位置。如此，使得控件之间的相对位置不至于发生过于明显的变化。

另外，电子设备在当前屏幕中显示有第一图层以及第二图层，各第二控件位于第一图层。电子设备响应于在第一图层中对第二控件的交互操作，调整第二图层的显示画面。

示例性的，第二图层用于显示游戏画面，第一图像用于显示游戏操控按键。用户通过第一图层的按键操控游戏画面的游戏角色。

基于与控件适配方法相同的发明构思，本申请实施例还提供一种控件适配装置，应用于电子设备。如图9所示，从功能上划分，控件适配装置包括：

形状获取模块601，用于获取参考屏幕中第一控件区域的形状，其中，第一控件区域中包括至少一个第一控件。

在本申请实施例中，该形状获取模块601对应的计算机可执行指令被处理器执行时，实现图4中的步骤S101，关于该形状获取模块601的详细描述，可以参考步骤S101的详细描述。

区域确定模块602，用于在当前屏幕中确定出与第一控件区域形状相同的第二控件区域，其中，第二控件区域的尺寸与当前屏幕的尺寸成正相关。

在本申请实施例中，该区域确定模块602对应的计算机可执行指令被处理器执行时，实现图4中的步骤S102，关于该区域确定模块602的详细描述，可以参考步骤S102的详细描述。

控件生成模块603，用于根据第二控件区域的尺寸生成与各第一控件相对应的第二控件，其中，各第二控件与二控件区域的相对尺寸关系满足各第一控件与第一控件区域的相对尺寸关系。

在本申请实施例中，该控件生成模块603对应的计算机可执行指令被处理器执行时，实现图4中的步骤S103，关于该控件生成模块603的详细描述，可以参考步骤S103的详细描述。

控件显示模块604，用于将各第二控件显示至第二控件区域，其中，各第二控件在第二控件区域中的相对位置关系满足各第一控件在第一控件区域中的相对位置关系。

在本申请实施例中，该控件显示模块604对应的计算机可执行指令被处理器执行时，实现图4中的步骤S104，关于该控件显示模块604的详细描述，可以参考步骤S104的详细描述。

在一种可能的实现方式中，区域确定模块602具体用于：

获取当前屏幕的第一尺寸参数；

根据第一尺寸参数确定第二控件区域的第二尺寸参数，其中，第一尺寸参数与第二尺寸参数之间满足预设比例关系；

根据第二尺寸参数，确定第二控件区域的尺寸；

根据第一控件区域在参考屏幕中的相对位置关系，确定第二控件区域在当前屏幕中的显示位置。

在一种可能的实现方式中，区域确定模块602还具体用于：

获取参考屏幕中第一伸缩区域之间的分割比例，以及第一控件区域与各第一伸缩区域之间的顺序关系；其中，各第一伸缩区域为第一控件区域从参考屏幕中划分出的屏幕区域；

根据第二控件区域的尺寸，将当前屏幕中剩余的区域按照分割比例划分成第二伸缩区域；

根据第二伸缩区域之间的排列顺序，按照顺序关系确定第二控件区域在当前屏幕中的显示位置。

当然，该控件适配装置根据所提供的功能，还可以包括其他模块；上述形状获取模块601、区域确定模块602、控件生成模块603、控件显示模块604还可以用于实现其他该控件适配方法的其他步骤，或者子步骤，本申请实施例不做具体的限定。

本申请实施例还提供一种存储介质，存储介质存储有计算机程序，计算机程序被处理器执行时，实现的控件适配方法。

综上所述，本申请实施例提供的控件适配方法、装置、电子设备及存储介质中。该电子设备基于参考屏幕中第一控件区域的形状，将在当前屏幕中确定形状相同的第二控件区域；并基于第一控件在第一控件区域中的相对位置以及相对尺寸，确定对应第二控件在第二控件区域中的尺寸以及显示位置，以实现第二控件在第二控件区域中的尺寸以及位置跟随第二控件区域的尺寸进行等比缩放，避免其中的控件出现重叠、错位等现象。

在本申请所提供的实施例中，应该理解到，所揭露的装置和方法，也可以通过其它的方式实现。以上所描述的装置实施例仅仅是示意性的，例如，附图中的流程图和框图显示了根据本申请的多个实施例的装置、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段或代码的一部分，所述模块、程序段或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现方式中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个连续的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合，可以用执行规定的功能或动作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。

另外，在本申请各个实施例中的各功能模块可以集成在一起形成一个独立的部分，也可以是各个模块单独存在，也可以两个或两个以上模块集成形成一个独立的部分。

所述功能如果以软件功能模块的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储介质中。基于这样的理解，本申请的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本申请各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器(ROM，Read-Only Memory)、随机存取存储器(RAM，Random Access Memory)、磁碟或者光盘等各种可以存储程序代码的介质。

需要说明的是，在本文中，诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来，而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者设备所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括所述要素的过程、方法、物品或者设备中还存在另外的相同要素。

以上所述，仅为本申请的各种实施方式，但本申请的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本申请揭露的技术范围内，可轻易想到变化或替换，都应涵盖在本申请的保护范围之内。因此，本申请的保护范围应所述以权利要求的保护范围为准。

Claims (10)

1.一种控件适配方法，其特征在于，应用于电子设备，所述方法包括：

获取参考屏幕中第一控件区域的形状，其中，所述第一控件区域中包括至少一个第一控件；

在当前屏幕中确定出与所述第一控件区域形状相同的第二控件区域，其中，所述第二控件区域的尺寸与所述当前屏幕的尺寸成正相关；

根据所述第二控件区域的尺寸生成与各所述第一控件相对应的第二控件，其中，各所述第二控件与所述二控件区域的相对尺寸关系满足各所述第一控件与所述第一控件区域的相对尺寸关系；

将各所述第二控件显示至所述第二控件区域，其中，各所述第二控件在所述第二控件区域中的相对位置关系满足各所述第一控件在所述第一控件区域中的相对位置关系。

2.根据权利要求1所述的控件适配方法，其特征在于，所述在当前屏幕中确定出与所述第一控件区域形状相同的第二控件区域，包括：

获取当前屏幕的第一尺寸参数；

根据所述第一尺寸参数确定所述第二控件区域的第二尺寸参数，其中，所述第一尺寸参数与所述第二尺寸参数之间满足预设比例关系；

根据所述第二尺寸参数，确定所述第二控件区域的尺寸；

根据所述第一控件区域在所述参考屏幕中的相对位置关系，确定所述第二控件区域在所述当前屏幕中的显示位置。

3.根据权利要求2所述的控件适配方法，其特征在于，所述根据所述第一控件区域在所述参考屏幕中的相对位置关系，确定所述第二控件区域在所述当前屏幕中的显示位置，包括：

获取所述参考屏幕中第一伸缩区域之间的分割比例，以及所述第一控件区域与各所述第一伸缩区域之间的顺序关系；其中，各所述第一伸缩区域为所述第一控件区域从所述参考屏幕中划分出的屏幕区域；

根据所述第二控件区域的尺寸，将所述当前屏幕中剩余的区域按照所述分割比例划分成第二伸缩区域；

根据所述第二伸缩区域之间的排列顺序，按照所述顺序关系确定所述第二控件区域在所述当前屏幕中的显示位置。

4.根据权利要求2所述的控件适配方法，其特征在于，所述第二控件区域成矩形，所述第二尺寸参数为所述第二控件区的长或者宽；

所述根据所述第一尺寸参数确定所述第二控件区域的第二尺寸参数，包括：

将所述第一尺寸参数作为所述第二控件区的长或者宽；

所述根据所述第二尺寸参数，确定所述第二控件区域的尺寸，包括：

根据所述第二控件区的长宽比，确定所述第二控件区域的尺寸。

5.根据权利要求1所述的控件适配方法，其特征在于，所述电子设备在所述当前屏幕中显示有第一图层以及第二图层，各所述第二控件位于所述第一图层，所述方法还包括：

响应于在所述第一图层中对所述第二控件的交互操作，调整所述第二图层的显示画面。

6.一种控件适配装置，其特征在于，应用于电子设备，所述控件适配装置包括：

形状获取模块，用于获取参考屏幕中第一控件区域的形状，其中，所述第一控件区域中包括至少一个第一控件；

区域确定模块，用于在当前屏幕中确定出与所述第一控件区域形状相同的第二控件区域，其中，所述第二控件区域的尺寸与所述当前屏幕的尺寸成正相关；

控件生成模块，用于根据所述第二控件区域的尺寸生成与各所述第一控件相对应的第二控件，其中，各所述第二控件与所述二控件区域的相对尺寸关系满足各所述第一控件与所述第一控件区域的相对尺寸关系；

控件显示模块，用于将各所述第二控件显示至所述第二控件区域，其中，各所述第二控件在所述第二控件区域中的相对位置关系满足各所述第一控件在所述第一控件区域中的相对位置关系。

7.根据权利要求6所述的控件适配装置，其特征在于，所述区域确定模块具体用于：

获取当前屏幕的第一尺寸参数；

根据所述第一尺寸参数确定所述第二控件区域的第二尺寸参数，其中，所述第一尺寸参数与所述第二尺寸参数之间满足预设比例关系；

根据所述第二尺寸参数，确定所述第二控件区域的尺寸；

根据所述第一控件区域在所述参考屏幕中的相对位置关系，确定所述第二控件区域在所述当前屏幕中的显示位置。

8.根据权利要求7所述的控件适配装置，其特征在于，所述区域确定模块还具体用于：

获取所述参考屏幕中第一伸缩区域之间的分割比例，以及所述第一控件区域与各所述第一伸缩区域之间的顺序关系；其中，各所述第一伸缩区域为所述第一控件区域从所述参考屏幕中划分出的屏幕区域；

根据所述第二控件区域的尺寸，将所述当前屏幕中剩余的区域按照所述分割比例划分成第二伸缩区域；

根据所述第二伸缩区域之间的排列顺序，按照所述顺序关系确定所述第二控件区域在所述当前屏幕中的显示位置。

9.一种电子设备，其特征在于，所述电子设备包括处理器以及存储器，所述存储器存储有计算机程序，所述计算机程序被处理器执行时，实现权利要求1-5任意一项所述的控件适配方法。

10.一种存储介质，其特征在于，所述存储介质存储有计算机程序，所述计算机程序被处理器执行时，实现权利要求1-5任意一项所述的控件适配方法。

Images