CN111880889A - 界面显示方法、装置、电子设备及存储介质 - Google Patents

Abstract

本申请提供一种界面显示方法、装置、电子设备及存储介质。通过上述界面显示方法，第一线程用于获取显示界面中各视图控件之间层次关系，第二线程用于处理与获取显示界面中各视图控件之间层次关系无关的数据处理操作，以避免其对第一线程造成干扰。由于显示界面的绘制依赖于各视图控件之间层次关系，通过避免第二线程对第一线程造成干扰，能够提高显示界面显示过程的流畅度、帧率，继而减少卡顿以及花屏等现象。

Description

界面显示方法、装置、电子设备及存储介质

技术领域

本申请涉及计算机领域，具体而言，涉及一种界面显示方法、装置、电子设备及存储介质。

背景技术

随着智能设备的普及，越来越多的智能设备开始搭载Android系统。基于Android系统开发带有显示界面的应用程序时，通常基于Android原生的UI(User Interface，用户界面)体系。

然而，Android原生的UI体系下，会将显示界面的构建以及显示界面的绘制等相关操作和非显示界面操作同步执行。在此流程下，容易造成显示界面显示过程不流畅、帧率低等问题，影响用户体验。

发明内容

为了克服现有技术中的至少一个不足，本申请实施例的目的之一在于提供一种界面显示方法，应用于运行有Andriod系统的电子设备，所述电子设备配置有用于组织显示界面中各视图控件之间层次关系的多个容器组件，所述电子设备运行有第一线程以及第二线程，所述方法包括：

通过所述第一线程，解析所述多个容器组件之间的组织方式获得所述显示界面中各视图控件之间层次关系；

通过所述第二线程，根据所述层次关系进行绘制，获得所述显示界面的视图数据，并根据所述视图数据将所述显示界面显示到屏幕中。

可选地，所述多个容器组件中的至少一部分容器组件包括有该显示界面中的视图控件，其中，所述多个容器组件成树状结构，各所述容器组件包括布局标识，所述布局标识用于描述该容器组件作为父容器组件时，该容器组件的子容器组件的布局样式；

所述通过所述第一线程，解析所述多个容器组件之间的组织方式获得所述显示界面中各视图控件之间层次关系，还包括：

遍历所述多个容器组件，根据所述多个容器组件之间的树状连接关系以及各所述容器组件的布局标识确定出所述显示界面中各视图控件之间的层次关系。

可选地，所述遍历所述多个容器组件，根据所述多个容器组件之间的树状连接关系以及各所述容器组件的布局标识确定出所述显示界面中各视图控件之间的层次关系的步骤，包括：

遍历所述多个容器组件，根据所述多个容器组件之间的树状连接关系以及各所述容器组件的布局标识确定对各所述视图控件进行测量，获得各所述视图控件的尺寸；

遍历所述多个容器组件，根据所述多个容器组件之间的树状连接关系以及各所述容器组件的布局标识对各所述视图控件进行布局，获得各所述视图控件的位置；

根据所述各所述视图控件的尺寸以及所述各所述视图控件的位置获得所述各视图控件之间的层次关系。

可选地，所述容器组件还包括动效控件，所述动效控件绑定所述容器组件中至少一个视图控件，所述层次关系包括各所述视图控件在所述显示界面中的位置状态，所述方法还包括：

针对绑定该动效控件的视图控件，通过所述第一线程获取该视图控件执行该动效控件对应动态变化后新的位置状态；

根据各所述视图控件新的位置状态获得新的层次关系。

可选地，所述通过所述第一线程获取该视图控件执行该动效控件对应动态变化后新的位置状态的步骤，包括：

获取该视图控件执行该动效控件对应动态变化后，需要发生的位置偏移量；

基于该视图控件当前的位置状态，根据该位置偏移量获得该视图控件新的位置状态。

可选地，所述通过所述第二线程，根据所述层次关系进行绘制，获得所述显示界面的视图数据，并根据所述视图数据将所述显示界面显示到屏幕中的步骤，包括：

根据所述层次关系进行绘制，获得多个显示界面的视图数据，各所述显示界面包括层次关系相同的视图控件；

基于所述多个显示界面的视图数据，将各所述显示界面依次显示到所述屏幕中。

本申请实施例的目的之二在于提供一种界面显示装置，应用于运行有Andriod系统的电子设备，所述电子设备配置有用于组织显示界面中各视图控件之间层次关系的多个容器组件，所述电子设备运行有第一线程以及第二线程，所述界面显示装置包括：

视图数据模块，用于通过所述第一线程，解析所述多个容器组件之间的组织方式获得所述显示界面中各视图控件之间层次关系；

界面显示模块，用于通过所述第二线程，根据所述层次关系进行绘制，获得所述显示界面的视图数据，并根据所述视图数据将所述显示界面显示到屏幕中。

可选地，所述多个容器组件中的至少一部分容器组件包括有该显示界面中的视图控件，其中，所述多个容器组件成树状结构，各所述容器组件包括布局标识，所述布局标识用于描述该容器组件作为父容器组件时，该容器组件的子容器组件的布局样式,所述界面显示模块的具体包括:

遍历所述多个容器组件，根据所述多个容器组件之间的树状连接关系以及各所述容器组件的布局标识确定出所述显示界面中各视图控件之间的层次关系。

本申请实施例的目的之三在于提供一种电子设备，所述电子设备包括处理器以及存储器，所述存储器存储有计算机可执行指令，所述计算机可执行指令被所述处理器执行时，实现所述的界面显示方法。

本申请实施例的目的之四在于提供一种存储介质，所述存储介质存储有计算机程序，所述计算机程序被处理器执行时，实现所述的界面显示方法。

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

本申请提供一种界面显示方法、装置、电子设备及存储介质。通过上述界面显示方法，第一线程用于获取显示界面中各视图控件之间层次关系，第二线程用于处理与获取显示界面中各视图控件之间层次关系无关的数据处理操作，以避免其对第一线程造成干扰。由于显示界面的绘制依赖于各视图控件之间层次关系，通过避免第二线程对第一线程造成干扰，能够提高显示界面显示过程的流畅度、帧率，继而减少卡顿以及花屏等现象。

附图说明

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

图1为本申请实施例提供的Android原生的UI体系下的绘制流程；

图2为本申请实施例提供的界面显示方法的绘制流程；

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

图4为本申请实施例提供的界面显示方法的步骤流程图；

图5为本申请实施例提供的容器组件的层次关系示意图；

图6为本申请实施例提供的Android原生的UI体系下的层次关系示意图；

图7为本申请实施例提供的内存消耗对比示意图；

图8为本申请实施例提供的动效控件的步骤流程图；

图9为本申请实施例提供的步骤S110的子步骤；

图10为本申请实施例提供的步骤S130的子步骤；

图11为本申请实施例提供的多显示界面示意图；

图12为本申请实施例提供的界面显示装置的结构示意图。

图标：900-第一线程；800-第二线程；100-电子设备；110-界面显示装置；120-存储器；130-处理器；500-根容器组件；501-第一容器组件；502-第二容器组件；503-第三容器组件；504-第四容器组件；700-当前显示界面；701-第一待显示界面；702-第二待显示界面；1101-视图数据模块；1102-界面显示模块。

具体实施方式

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

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

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

在本申请的描述中，需要说明的是，术语“第一”、“第二”、“第三”等仅用于区分描述，而不能理解为指示或暗示相对重要性。

如背景技术所介绍的，Android原生的UI体系下，会将显示界面的测量、布局以及绘制等相关操作和非显示界面操作同步执行。在此流程下，容易造成显示界面显示过程不流畅、帧率低、卡顿甚至花屏等问题，影响用户体验。

关于Android原生的UI体系，下面结合图1对其进行详细阐述。Android原生的UI体系中，依次包括获取垂直同步信号、测量、布局以及绘制等步骤。

在垂直同步信号步骤中，该垂直同步信号用于表征需要对屏幕中的显示界面进行更新，在测量步骤中，电子设备递归遍历视图树，获得显示界面中各视图控件的尺寸。布局步骤中，电子设备递归遍历视图树，获得待显示界面中各视图控件的位置，包括绝对位置以及相对位置。电子设备基于在各视图控件的尺寸以及各视图控件的位置获得显示界面中各视图控件的层次关系。

绘制步骤中，电子设备根据待显示界面中各视图控件的层次关系通过CPU或GPU进行绘制获得显示界面的视图数据，并将视图数据显示到屏幕中。然而，在进行测量、布局以及绘制等步骤的过程中，电子设备可能需要处理一些与显示界面无关的数据处理操作，继而会对测量、布局以及绘制等步骤造成一定阻塞，导致显示界面显示过程不流畅、帧率低等问题。尤其是针对一些复杂的显示界面，上述现象更为明显。

鉴于此，本申请实施例提供一种界面显示方法，用于提高显示界面显示过程的流畅度、帧率，减少卡顿以及花屏等现象。该界面显示方法应用于运行有Andriod系统的电子设备，所述电子设备配置有用于组织显示界面中各视图控件之间层次关系的多个容器组件，所述电子设备运行有第一线程以及第二线程。

作为一种可能的实现方式，下面结合图1以及图2，对该界面显示方法的原理进行阐述。该界面显示方法中，将Android原生的UI体系下中的测量、布局操作抽离作为第一线程900，将Android原生的UI体系下中其他步骤作为第二线程800。两线程相互配合，使得第二线程800中与测量、布局无关的操作不影响第一线程900，以达到提高显示界面显示过程的流畅度以及帧率目的。其中，与测量、布局无关的操作可以是，但不限于从服务器获取待展示的文本数据。

请参照图3，为本申请实施提供给的用于执行该界面显示方法的电子设备100的结构示意图。该电子设备100可以是，但不限于，智能手机、个人电脑(personal computer，PC)、平板电脑、个人数字助理(personal digital assistant，PDA)、移动上网设备(mobileInternet device，MID)等。

如图3所示，该电子设备100包括界面显示装置110、存储器120以及处理器130。所述存储器120、处理器130以及其他各元件相互之间直接或间接地通信连接，以实现数据的传输或交互。例如，这些元件相互之间可通过一条或多条通讯总线或信号线实现电性连接。所述界面显示装置110包括至少一个可以软件或固件(Firmware)的形式存储于所述存储器120中或固化在所述电子设备100的操作系统(Operating System，OS)中的软件功能模块。所述处理器130用于执行所述存储器120中存储的可执行模块，例如所述界面显示装置110所包括的软件功能模块及计算机程序等。其中，该界面显示装置110中的计算机可执行指令被处理器执行时，实现该界面显示方法。

其中，所述存储器120可以是，但不限于，随机存取存储器(Random AccessMemory，RAM)，只读存储器(Read Only Memory，ROM)，可编程只读存储器(ProgrammableRead-Only Memory，PROM)，可擦除只读存储器(Erasable Programmable Read-OnlyMemory，EPROM)，电可擦除只读存储器(Electric Erasable Programmable Read-OnlyMemory，EEPROM)等。其中，存储器120用于存储程序，所述处理器130在接收到执行指令后，执行所述程序。在本申请实施例中，该处理器可以是CPU或者GPU，用于进行绘制。

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

请参照图4，为本申请实施例提供的该界面显示方法的步骤流程图，下面结合图4对该方法的各步骤进行详细阐述。

步骤S100，通过第一线程900，解析多个容器组件之间的组织方式获得显示界面中各视图控件之间层次关系。

应理解的是，组织显示界面中各视图控件的方式有很多中。作为一种可能的实现方式，本申实施例通过容器组件对显示界面中的各视图控件的层次关系进行组织。该层次关系主要包括各视图控件的尺寸、相对位置以及绝对位置等信息。

上述视图控件可以是，但不限于文本控件、按钮控件以及图像控件等。

步骤S130，通过第二线程800，根据层次关系进行绘制，获得显示界面的视图数据，并根据视图数据将显示界面显示到屏幕中。

通过上述界面显示方法，通过上述界面显示方法，第一线程900用于获取显示界面中各视图控件之间层次关系，第二线程800用于处理与获取显示界面中各视图控件之间层次关系无关的数据处理操作，以避免其对第一线程900造成干扰。由于显示界面的绘制依赖于各视图控件之间层次关系，通过避免第二线程800对第一线程900造成干扰，能够提高显示界面显示过程的流畅度、帧率，继而减少卡顿以及花屏等现象。

另外，考虑到Android原生的UI体系下，组织视图控件的层次关系时不仅需要更多的存储空间，在调整已有层次关系时还缺乏灵活性。因此，本申实施例通过容器组件对显示界面中的各视图控件的层次关系进行组织。

该组织方法具体包括：

多个容器组件中的至少一部分容器组件包括有该显示界面中的视图控件，其中，所述多个容器组件成树状结构，各所述容器组件包括布局标识，所述布局标识用于描述该容器组件作为父容器组件时，该容器组件的子容器组件的布局样式。下面对步骤S100进行详细说明。

该电子设备100遍历所述多个容器组件，根据所述多个容器组件之间的树状连接关系以及各所述容器组件的布局标识确定出所述显示界面中各视图控件之间的层次关系。

其中，各视图控件之间的层次关系具体包括各视图控件的尺寸以及各视图控件的位置。该电子设备100遍历所述多个容器组件，根据所述多个容器组件之间的树状连接关系以及各所述容器组件的布局标识确定对各所述视图控件进行测量，获得各所述视图控件的尺寸；遍历所述多个容器组件，根据所述多个容器组件之间的树状连接关系以及各所述容器组件的布局标识对各所述视图控件进行布局，获得各所述视图控件的位置；根据所述各所述视图控件的尺寸以及所述各所述视图控件的位置获得所述各视图控件之间的层次关系。

下面结合图5，对本申请实施例提供的通过容器组件组织各视图控件的层次关系的方式进行说明。如图5所示，其中包括构成3个层级的5个容器。其中，每个“Cell”代表一个容器组件，分别为根容器组件500、第一容器组件501、第二容器组件502、第三容器组件503以及第四容器组件504。

根容器组件500通过“线性布局”标识指明第一容器组件501与第二容器组件502所对应的视图控件成线性布局的方式排列；第二容器组件502通过“表格布局”标识指明第三容器组件503与第四容器组件504所对应的视图控件成表格布局的方式排列。

第一容器组件501中包括有文本控件、图像控件以及按钮控件，则第一容器组件501在待显示界面中的对应位置显示有文本、图像以及按钮。因此，基于本申请实施例所提供的容器组件，开发人员可以灵活组织容器组件之间的树状连接关系以适应视图控件之间的不同层次关系，并根据待显示界面的样式需求往容器组件中添加相应的视图控件。

基于上述过容器组件组织各视图控件的层次关系描述，该电子设备100在解析多个容器组件之间的组织方式时，从根容器组件开始，根据容器组件之间的树状连接关系依次遍历各容器组件，根据容器组件中的布局标识确定其子容器组件的布局样式，并结合容器组件中各自包括的视图控件，获得各视图控件的层次关系。

应理解的是，在Android原生的UI体系下，组织视图控件的层次关系时，需要先声明一布局组件，布局组件中的控件则按照该布局组件的布局方式对其中的视图控件进行布局。请参照图6，为本申请实施例提供的Android原生的UI体系下的，实现与图5相同层次关系时，所需要的组织方式。如图6所示，Android原生的UI体系下，布局组件(线性布局组件、帧布局组件)需要占用一个层级，因此，相较于本申请中的容器组件，在实现相同的显示界面时，各视图控件之间层次关系更为复杂。并且，布局组件的存储需要占用更多的存储空间。

并且，由于通过Android原生的UI体系下，组织视图控件的层次关系时，需要先声明一布局组件，因此，若需要变更原有的布局方式(将线性布局变更为表格布局)，开发人员需要更改源代码，修改源代码中对应的布局组件(将线性布局组件变更为表格布局组件)，并基于修改后的布局组件，对代码的其他部分进行适应性调整。

因此，通过本申请实施例提供的容器组件，只需要更改容器组件中的布局标识即可更改显示界面中各视图控件的层次关系，能够提高开发人员组织视图控件层次关系时的灵活性。

并且，在实现动态布局功能时，不需要如Android原生的UI体系下，在应用程序中内置多个冗余的布局样式，仅需要更改容器中的布局标识，即可根据该布局标识绘制出对应的布局样式，进而能够避免存储冗余的布局样式对存储空间带来的消耗。

因此，通过该界面显示方法，开发人员可以灵活组织容器组件之间的树状连接关系以适应视图控件之间的不同层次关系，并根据显示界面的样式需求往其中添加相应的视图控件。并且，通过容器组件中的布局标识，方便开发人员实现布局样式的变更，降低了开发难度，提高了开发过程中的灵活程度。同时，相较于冗余布局样式实现动态布局，通过容器组件中的布局标识能够降低对存储空间的消耗。

进一步地，本申请还通过重写Android原生的UI体系下各视图控件，将其中不必要的属性以及方法进行了剔除。经测试发现，本申请实施所提供的容器与视图控件能够明显减少对存储空间的消耗。具体参见图7所示的测试对比结果。如图7所示，包括了单个容器组件、文本控件、图像控件以及布局组件对存储空间的消耗情况。

其中，Android原生的UI体系下单个文本控件占用812字节。图像控件占用553字节。布局组件占用672个字节。而本申请实施例中，单个文本控件占用287个字节。图像控件占用245个字节。布局标识占用205个字节。即使容器组件与视图控件相互集合同样低于Android原生的UI体系下对存储空间的消耗。

由于该显示界面中的各视图控件通过容器进行组织，因此，在绘制时，该电子设备100从根容器组件开始，依次对各容器中的视图控件进行绘制。其中，针对每个容器组件中的视图控件，该电子设备100根据容器组件中各视图控件的排列顺序，依次对该容器组件中各视图控件进行绘制。

例如，一容器组件中包括有图像控件以及文本控件，该电子设备100先绘制图像控件，在绘制的图像控件的基础上，绘制文本控件。其中，图像控件与文本控件相同的区域，绘制文本控件时，对已绘制的图像控件进行覆盖。

考虑到显示效果的丰富，所述容器组件还包括动效控件。该动效控件用于对该容器组件中各视图控件的动态效果提供支持。例如，该动效控件可以提供移动、回弹、旋转、缩放、延时、显示优先级、以及透明度变化等功能。

应理解的是，电子设备100通过获取多帧显示界面的视图数据，依次在屏幕中进行显示，以实现动态效果。然而，在获取多帧显示界面的视图数据之前，电子设备100需要根据具体要实现的动态效果，计算显示界面中各视图控件新的位置状态。并且，动态效果越复杂，相应的计算量越大，因此，该电子设备100通过第一线程900进行上述动态效果的计算，使得第二线程800能够基于第一线程900所计算获得的各视图控件新的层次关系进行绘制，相较于Android原生的UI体系下将显示界面的测量、布局以及显示界面的绘制等相关操作和非显示界面操作同步执行，能够提高显示界面的流畅度。

该动效控件绑定容器组件中至少一个视图控件。请参照图8，在步骤S130之前，该界面显示方法还包括：

步骤S110，针对绑定该动效控件的视图控件，通过第一线程900获取该视图控件执行该动效控件对应动态变化后新的位置状态。

步骤S120，根据各视图控件新的位置状态获得新的层次关系。

由于第一线程900与第二线程800并行执行，通过上述获得各视图控件新的层次关系的步骤，该电子设备100在通过第二线程800在对当前显示界面进行绘制的同时，第一线程900计算动态效果中的其他显示界面各视图控件的层次关系，使得在显示下一帧显示界面时，直接基于已经计算完成的新的层次关系进行绘制。如此，能够提高显示显示界面的流畅度。

另外，关于动效控件与视图控件的绑定方式。作为一种可能的实现方式，通过动效控件中的属性值与容器组件进行绑定，使得该容器组件中所有的视图控件呈现相同的动态效果。

该电子设备100通过动效控件获得容器组件中所有视图控件动效变换后新的位置状态，基于新的位置状态获得新的层次关系，对新的显示界面进行绘制。

通过上述界面显示方法，在相同硬件配置参数的移动终端下进行测试，测试结果显示，上述界面显示方法的将Android原生的UI体系下的掉帧率从28％降低到5％，能够明显提高显示界面的流畅度。

作为另外一种实现方式，容器组件中添加多个动效控件，各动效控件通过属性值与不同的视图控件进行绑定。该电子设备100通过各动效控件对各视图控提供与所绑定的动效控件相对应的动态效果。

例如，以包括有图像控件以及按钮控件的容器组件为例，将图像控件绑定提供缩放功能的动效控件，对按钮控件绑定提供透明度变化功能的动效控件。当点击该按钮时，调整按钮的透明度，并对图像控件中的图片进行缩放。

关于步骤S110的具体实现方式，请参照图9，步骤S110具体包括：

步骤S110-1，获取该视图控件执行该动效控件对应动态变化后，需要发生的位置偏移量。

步骤S110-2，基于该视图控件当前的位置状态，根据该位置偏移量获得该视图控件新的位置状态。

动效控件有很多种类，下面以提供旋转效果的动效控件为例，该动效控件与图像控件绑定，提供将图像控件中的图片旋转90°的动态效果。该电子设备100通过动效控件提供9张显示界面的视图数据依次进行显示实现该动态效果，即每张显示界面中，该图像旋转10°。

针对每张显示界面，该电子设备100计算该图片旋转10°需要发生的偏移量，并基于该图片当前的位置状态，确定该发生该偏移量之后，该图片新的位置状态。

应理解的是，通常的技术方案中，当检测到用户需要更新显示屏幕中的内容时，基于显示屏幕中已显示的视图控件，获取新的数据，并根据新的数据重新绘制显示界面获得新的视图数据，在显示屏幕中进行显示。因此，相较于直接对视图数据进行显示，需要更多的时间来获取新的数据，并根据新的数据进行重新绘制，以及获得新的显示界面新的视图数据。

鉴于此，由于多个待显示界面之间，包括相同视图控件，并且各待显示界面中视图控件所构成的界面样式相同，差别仅在于各待显示界面中显示的数据存在差异。下面结合图10，对步骤S130的一种可能的实现方式中进行说明：

步骤S130-1，根据层次关系进行绘制，获得多个显示界面的视图数据，各显示界面包括层次关系相同的视图控件。

步骤S130-2，基于多个显示界面的视图数据，将各显示界面依次显示到屏幕中。

该电子设备100基于相同的界面样式提前绘制多个待显示界面，用户在滑动屏幕更新屏幕中的显示内容时，不再需要重新对显示界面中的各视图控件进行重新绘制，将提前绘制好的视图数据直接进行显示即可。由于在更新显示屏幕的显示界面时，不在需要等待绘制步骤以获取视图数据，能够提高滑动屏幕时的流畅感。

下面以新闻应用为例，结合请参照图11，对上述步骤进行示例型说明。该电子设备100基于相同视图控件所构成的界面样式，除了当前显示界面700，还提前绘制了2个待显示界面，分别为第一待显示界面701以及第二待显示界面702，其中，第一待显示界面701与第二待显示界面702的界面样式相同，但界面中显示的新闻内容存在差异。用户在向上滑动屏幕时，将第一显示界面的视图数据直接进行显示，因此，省却了等待绘制的过程，能够提高滑动屏幕时的流畅感。

值得说明的是，本申请实施例中基于容器组件以及视图控件所构成的图形界面框架，基于Android原生的UI体系中的ViewGroup组件进行开发，使得复用ViewGroup组件的按键事件派发、触摸事件派发以及焦点选择的功能。

基于相同的发明构思，本申请实施还提供一种界面显示装置110，应用于运行有Andriod系统的电子设备100，所述电子设备100配置有用于组织显示界面中各视图控件之间层次关系的多个容器组件，所述电子设备100运行有第一线程900以及第二线程800。请参照图12，界面显示装置110包括：

视图数据模块1101，用于通过所述第一线程900，解析所述多个容器组件之间的组织方式获得所述显示界面中各视图控件之间层次关系。

在本申请实施例中，关于该视图数据模块1101用于执行图4中的步骤S100，关于该视图数据模块1101的详细描述，可以参考步骤S100的详细描述。

界面显示模块1102，用于通过所述第二线程800，根据所述层次关系进行绘制，获得所述显示界面的视图数据，并根据所述视图数据将所述显示界面显示到屏幕中。

在本申请实施例中，关于该界面显示模块1102用于执行图4中的步骤S130，关于该界面显示模块1102的详细描述，可以参考步骤S130的详细描述。

可选地，所述多个容器组件中的至少一部分容器组件包括有该显示界面中的视图控件，其中，所述多个容器组件成树状结构，各所述容器组件包括布局标识，所述布局标识用于描述该容器组件作为父容器组件时，该容器组件的子容器组件的布局样式；所述界面显示模块1102具体包括：

遍历所述多个容器组件，根据所述多个容器组件之间的树状连接关系以及各所述容器组件的布局标识确定出所述显示界面中各视图控件之间的层次关系。

本申请实施例还提供一种存储介质。该存储介质存储有计算机程序，该计算机程序被处理器130执行时，实现界面显示方法。

综上所述，本申请一种界面显示方法、装置、电子设备及存储介质通过上述界面显示方法，第一线程用于获取显示界面中各视图控件之间层次关系，第二线程用于处理与获取显示界面中各视图控件之间层次关系无关的数据处理操作，以避免其对第一线程造成干扰。由于显示界面的绘制依赖于各视图控件之间层次关系，通过避免第二线程对第一线程造成干扰，能够提高显示界面显示过程的流畅度、帧率，继而减少卡顿以及花屏等现象。

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

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

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

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

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

Claims (10)

1.一种界面显示方法，其特征在于，应用于运行有Andriod系统的电子设备，所述电子设备配置有用于组织显示界面中各视图控件之间层次关系的多个容器组件，所述电子设备运行有第一线程以及第二线程，所述方法包括：

通过所述第一线程，解析所述多个容器组件之间的组织方式获得所述显示界面中各视图控件之间层次关系；

通过所述第二线程，根据所述层次关系进行绘制，获得所述显示界面的视图数据，并根据所述视图数据将所述显示界面显示到屏幕中。

2.根据权利要求1所述的界面显示方法，其特征在于，所述多个容器组件中的至少一部分容器组件包括有该显示界面中的视图控件，其中，所述多个容器组件成树状结构，各所述容器组件包括布局标识，所述布局标识用于描述该容器组件作为父容器组件时，该容器组件的子容器组件的布局样式；

所述通过所述第一线程，解析所述多个容器组件之间的组织方式获得所述显示界面中各视图控件之间层次关系的步骤包括：

遍历所述多个容器组件，根据所述多个容器组件之间的树状连接关系以及各所述容器组件的布局标识确定出所述显示界面中各视图控件之间的层次关系。

3.根据权利要求2所述的界面显示方法，其特征在于，所述遍历所述多个容器组件，根据所述多个容器组件之间的树状连接关系以及各所述容器组件的布局标识确定出所述显示界面中各视图控件之间的层次关系的步骤，包括：

遍历所述多个容器组件，根据所述多个容器组件之间的树状连接关系以及各所述容器组件的布局标识确定对各所述视图控件进行测量，获得各所述视图控件的尺寸；

遍历所述多个容器组件，根据所述多个容器组件之间的树状连接关系以及各所述容器组件的布局标识对各所述视图控件进行布局，获得各所述视图控件的位置；

根据所述各所述视图控件的尺寸以及所述各所述视图控件的位置获得所述各视图控件之间的层次关系。

4.根据权利要求3所述的界面显示方法，其特征在于，所述容器组件还包括动效控件，所述动效控件绑定所述容器组件中至少一个视图控件，所述方法还包括：

针对绑定该动效控件的视图控件，通过所述第一线程获取该视图控件执行该动效控件对应动态变化后新的位置状态；

根据各所述视图控件新的位置状态获得新的层次关系。

5.根据权利要求4所述的界面显示方法，其特征在于，所述通过所述第一线程获取该视图控件执行该动效控件对应动态变化后新的位置状态的步骤，包括：

获取该视图控件执行该动效控件对应动态变化后，需要发生的位置偏移量；

基于该视图控件当前的位置状态，根据该位置偏移量获得该视图控件新的位置状态。

6.根据权利要求1所述的界面显示方法，其特征在于，所述通过所述第二线程，根据所述层次关系进行绘制，获得所述显示界面的视图数据，并根据所述视图数据将所述显示界面显示到屏幕中的步骤，包括：

根据所述层次关系进行绘制，获得多个显示界面的视图数据，各所述显示界面包括层次关系相同的视图控件；

基于所述多个显示界面的视图数据，将各所述显示界面依次显示到所述屏幕中。

7.一种界面显示装置，其特征在于，应用于运行有Andriod系统的电子设备，所述电子设备配置有用于组织显示界面中各视图控件之间层次关系的多个容器组件，所述电子设备运行有第一线程以及第二线程，所述界面显示装置包括：

视图数据模块，用于通过所述第一线程，解析所述多个容器组件之间的组织方式获得所述显示界面中各视图控件之间层次关系；

界面显示模块，用于通过所述第二线程，根据所述层次关系进行绘制，获得所述显示界面的视图数据，并根据所述视图数据将所述显示界面显示到屏幕中。

8.根据权利要求7所述的界面显示装置，其特征在于，所述多个容器组件中的至少一部分容器组件包括有该显示界面中的视图控件，其中，所述多个容器组件成树状结构，各所述容器组件包括布局标识，所述布局标识用于描述该容器组件作为父容器组件时，该容器组件的子容器组件的布局样式,所述界面显示模块的具体包括:

遍历所述多个容器组件，根据所述多个容器组件之间的树状连接关系以及各所述容器组件的布局标识确定出所述显示界面中各视图控件之间的层次关系。

9.一种电子设备，其特征在于，所述电子设备包括处理器以及存储器，所述存储器存储有计算机可执行指令，所述计算机可执行指令被所述处理器执行时，实现如权利要求1-6任意一项所述的界面显示方法。

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

Images