应用界面更新方法、装置、存储介质及电子设备与流程

本公开涉及计算机技术领域，具体地，涉及一种应用界面更新方法、装置、存储介质及电子设备。

背景技术

随着科学技术的不断发展，电子技术也得到了飞速发展，各种各样的电子设备已经成为人们娱乐生活中不可或缺的一部分，比如，手机、pad(personaldigitalassistant，平板电脑)，等等，这些电子设备丰富了人们的生活。电子设备上通常安装有各种应用程序，供用户使用。

目前，程序员在开发应用程序时，一般是直接编码开发，代码的复用率较低，且较为耗时耗力。同时，用户在操作应用程序过程中，常常会对应用的界面进行更新，比如在社交应用的某个界面上发布一条信息，等等，针对更新操作，直接编码开发出的应用程序在进行界面更新时，会基于用户的更新操作对整个应用界面的元素进行全部的刷新显示，因此对于dom(documentobjectmodel，文档对象模型)的操作较多，界面刷新耗时较长。

技术实现要素：

本公开的目的是提供一种应用界面更新方法、装置、存储介质及电子设备，能够减少应用界面更新时的dom操作，提升应用界面的更新速度。

根据本公开实施例的第一方面，提供一种应用界面更新方法，包括：

获取针对应用界面的更新操作，其中，所述应用界面通过在预先封装的树形结构模板的各结点上添加应用数据而创建；

根据所述更新操作，确定界面更新后的更新界面；

将所述应用界面每一层级的结点分别与所述更新界面相应层级的结点进行对比，以确定差异信息；

根据所述差异信息调整所述应用界面的结点，以显示更新后的界面。

可选的，根据所述差异信息调整所述应用界面的结点，包括：

根据所述差异信息，生成结点调整指令；

根据所述结点调整指令，对所述应用界面进行结点添加、结点删除、或结点移动的操作，或者进行其中的两种或三种操作的组合，以显示更新后的界面。

可选的，根据所述差异信息，生成结点调整指令，包括：

在所述差异信息指示所述应用界面的一结点在所述更新界面的对应位置上不存在时，生成用于删除该结点的结点调整指令。

可选的，根据所述差异信息，生成结点调整指令，包括：

在所述差异信息指示所述更新界面的一结点在所述应用界面的对应位置上不存在时，生成用于添加该结点的结点调整指令。

可选的，根据所述差异信息，生成结点调整指令，包括：

在所述差异信息指示所述更新界面的第一结点与所述应用界面的相同位置上的第二结点不相同时，生成用于删除所述第二结点的结点调整指令，以及生成用于添加所述第一结点的结点调整指令。

可选的，根据所述差异信息，生成结点调整指令，包括：

在所述差异信息指示所述更新界面的一结点在当前层级中的位置与该结点在所述应用界面同层级中的位置不同时，生成用于移动该结点的结点调整指令。

根据本公开实施例的第二方面，提供一种应用界面更新装置，包括：

获取模块，用于获取针对应用界面的更新操作，其中，所述应用界面通过在预先封装的树形结构模板的各结点上添加应用数据而创建；

确定模块，用于根据所述更新操作，确定界面更新后的更新界面；

对比模块，用于将所述应用界面每一层级的结点分别与所述更新界面相应层级的结点进行对比，以确定差异信息；

调整模块，用于根据所述差异信息调整所述应用界面的结点，以显示更新后的界面。

可选的，所述调整模块包括：

指令生成模块，用于根据所述差异信息，生成结点调整指令；

调整子模块，用于根据所述结点调整指令，对所述应用界面进行结点添加、结点删除、或结点移动的操作，或者进行其中的两种或三种操作的组合，以显示更新后的界面。

可选的，所述指令生成模块用于：

在所述差异信息指示所述应用界面的一结点在所述更新界面的对应位置上不存在时，生成用于删除该结点的结点调整指令。

可选的，所述指令生成模块用于：

在所述差异信息指示所述更新界面的一结点在所述应用界面的对应位置上不存在时，生成用于添加该结点的结点调整指令。

可选的，所述指令生成模块用于：

在所述差异信息指示所述更新界面的第一结点与所述应用界面的相同位置上的第二结点不相同时，生成用于删除所述第二结点的结点调整指令，以及生成用于添加所述第一结点的结点调整指令。

可选的，所述指令生成模块用于：

在所述差异信息指示所述更新界面的一结点在当前层级中的位置与该结点在所述应用界面同层级中的位置不同时，生成用于移动该结点的结点调整指令。

根据本公开实施例的第三方面，提供一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现第一方面中任一项所述方法的步骤。

根据本公开实施例的第四方面，提供一种电子设备，包括：

存储器，其上存储有计算机程序；

处理器，用于执行所述存储器中的所述计算机程序，以实现第一方面中任一项所述方法的步骤。

本公开中，应用界面可以是通过在预先封装的树形结构模板的各结点上添加应用数据而创建。获取针对创建好的应用界面的更新操作时，会根据更新操作，确定界面更新后的更新界面，然后将应用界面每一层级的结点分别与更新界面相应层级的结点进行对比，以确定差异信息，再根据差异信息调整应用界面的结点，从而显示更新后的界面。通过这样的方式，应用界面是基于树形结构模板来创建的，应用的开发较为方便快捷，缩短了开发周期，同时，在进行更新操作时，无需针对整个应用界面进行刷新显示，而只需针对更新前的界面进行差异更新即可，实现起来较为快捷，提高了应用界面更新的速度，也提升了用户体验。

本公开的其他特征和优点将在随后的具体实施方式部分予以详细说明。

附图说明

附图是用来提供对本公开的进一步理解，并且构成说明书的一部分，与下面的具体实施方式一起用于解释本公开，但并不构成对本公开的限制。在附图中：

图1是根据一示例性实施例示出的一种应用界面更新方法的流程图；

图2是根据一示例性实施例示出的树形结构模板示意图；

图3是根据一示例性实施例示出应用页面比对示意图；

图4是根据一示例性实施例示出另一应用页面比对示意图；

图5是根据一示例性实施例示出另一应用页面比对示意图；

图6是根据一示例性实施例示出另一应用页面比对示意图；

图7是根据一示例性实施例示出的一种应用界面更新装置的框图；

图8是根据一示例性实施例示出的一种电子设备的框图。

具体实施方式

以下结合附图对本公开的具体实施方式进行详细说明。应当理解的是，此处所描述的具体实施方式仅用于说明和解释本公开，并不用于限制本公开。

图1是根据一示例性实施例示出的一种方法的流程图，如图1所示，该任务执行方法可以应用于计算机中，包括以下步骤。

步骤s11：获取针对应用界面的更新操作。

步骤s12：根据更新操作，确定界面更新后的更新界面。

步骤s13：将应用界面每一层级的结点分别与更新界面相应层级的结点进行对比，以确定差异信息。

步骤s14：根据差异信息调整应用界面的结点，以显示更新后的界面。

本公开实施例中，应用界面是通过在预先封装的树形结构模板的各结点上添加应用数据而创建的。根据实际开发需求，可以由多个应用界面构成一个应用程序。以下将对应用界面的构建方式进行说明。

一个应用程序，可以理解为由模板、应用数据、及操作组成，模板可以是预先封装好的树形结构模板，可以是根据需要进行设计并封装的，也可以是从已有的应用程序的设计界面中抽取得到的该应用程序的树形结构模板，等等，本公开实施例中，可以预先构建多个树形结构模板，存储在模板库中，开发人员在开发应用程序时，可以根据开发需要选择合适的模板，当然，开发人员也可以根据开发需求对已有模板的树形结构进行更改，本公开实施例对此不作限定。应用数据即为开发的应用程序所包含的数据内容，比如要显示的内容，等等。操作即为用户使用应用程序时对应用界面进行的操作。

例如，社交应用a包含“消息”、“工作”、“联系人”、及“我的”四个应用界面，从每个应用界面抽取得到的树形结构模板如图2所示。抽取得到的树形结构模板可以存储在模板库中供开发人员下次开发应用时使用。那么开发人员在使用树形结构模板构建应用程序时，可以基于模板，在各结点上添加应用数据即可，比如，以图2所示的从应用界面“我的”抽取的模板为例，要在列表1中添加显示“我的红包”、“福利社”、及“收藏”，可以通过定义json(javascriptobjectnotation，js对象简谱)串添加数据：我的-列表1：{modal＝“list_modal_1”,data＝[{icon＝‘imag1.png’,title＝‘我的红包’},{icon＝‘imag2.png’,title＝福利社’},{icon＝‘imag3.png’,title＝‘收藏’}]}。

通过以上方式，开发人员可以较为方便地利用封装好的属性结构模板进行应用界面的开发，简化了应用开发过程，节省开发时间。

在通过以上方式开发的应用界面中，为了进一步对用户操作进行优化，本公开在接收到用户针对应用界面的更新操作时，无需对整个更新后的应用界面进行dom创建，而是对比出旧界面与新界面之间的差异信息，然后基于差异信息对旧界面进行更改即可显示新界面，提高了应用界面的更新速度，也提高了用户体验。

在确定更新前的应用界面与更新后的更新界面之间的差异时，可以是按照树形结构的每一层级的结点分别进行对比，如图3所示，左边的树形结构指示更新前的应用界面，右便的树形结构指示更新后的更新界面，圆形标识代表树形结构中的结点，在进行比对时，是按照同一层级同一位置进行比对，从而准确找出存在差异的结点。

可选的，根据差异信息调整应用界面的结点，可以根据差异信息，生成结点调整指令，然后根据结点调整指令，对应用界面进行结点添加、结点删除、或结点移动的操作，或者进行其中的两种或三种操作的组合，以显示更新后的界面。

由于本公开实施例中，应用界面可以是基于树形结构模板创建的，那么在对比出更新前后的应用界面的差异信息后，可以直接根据差异信息对树形结构的结点进行添加、删除、或移动，便可将应用界面调整为更新界面，无需针对整个更新界面进行dom操作，提升了界面更新的速度。

结点调整指令是基于差异信息来生成的，应当理解的是，指令可能有多条，也就是需要对应用界面执行多个操作，比如根据差异信息，需要对应用界面执行结点删除以及结点添加的操作，那么可以按照执行顺序将各结点调整指令放入队列，在更新应用界面时，直接执行队列中的全部指令即可实现对应用界面的更新。以下将对生成结点调整指令的方式进行说明。

在一种实施方式中，在差异信息指示应用界面的一结点在更新界面的对应位置上不存在时，生成用于删除该结点的结点调整指令。

也就是更新操作包含了对结点进行删除的操作，如图4所示，逐个层级比对更新前的应用界面与更新后的更新页面，得到的差异信息表明在第二层级中更新界面没有了结点b，那么将生成用于删除结点b以及结点b包括的子结点的结点调整指令。

在一种实施方式中，在差异信息指示更新界面的一结点在应用界面的对应位置上不存在时，生成用于添加该结点的结点调整指令。

也即是更新操作包含了添加结点的操作，继续参见图4，差异信息还表明在结点c之下，插入了结点b以及结点b包括的子结点d和e，那么可以生成用于在结点c下添加结点b及其子结点的结点调整指令。

在一种实施方式中，在差异信息指示更新界面的第一结点与应用界面的相同位置上的第二结点不相同时，生成用于删除第二结点的结点调整指令，以及生成用于添加第一结点的结点调整指令。

也即是更新操作包含更改结点的操作，如图5所示更新操作将结点c更改为了结点k，那么可以先生成删除结点c的结点调整指令并放入队列，再生成添加结点k的结点调整指令放入队列，在后续更新时，执行队列中的两条结点调整指令即可快捷地实现对应用界面的更新。

在一种实施方式中，在差异信息指示更新界面的一结点在当前层级中的位置与该结点在应用界面同层级中的位置不同时，生成用于移动该结点的结点调整指令。

请参见图6，图6为更新前的应用界面与更新后的更新界面在同一层级上的对比示意图，在更新前的应用界面中，结点顺序从后往前依次是a、b、c、d，而更新后的更新页面中，结点顺序从后往前依次是b、a、d、c，移动次数最少的方式是将a移到b前方，此时b自然排到a后方，将c移动到d前方，d自然排到c后方。以下将对如何确定移动方式进行说明。

为了减少移动次数，只需将位于后方的结点往前移动，原本位于前方的结点无需动作。遍历新集合(更新界面包含的结点)，根据结点的标识(key)来判断是否旧集合(更新前的应用界面包含的结点)中有相同的结点，如果存在相同的结点，那么将该结点在旧集合中的结点位置(oldchild.index)与结点标识值lastindex(初始值为0)进行比较，满足oldchild.index<lastindex时进行移动，反之不移动，具体操作如下：

请继续参见图6：遍历结点发现结点b在旧集合中的位置b.oldindex＝1，此时lastindex＝0，不满足b.oldindex<lastindex，此时不移动b；

更新lastindex＝max(old.index，lastindex)，此时lastindex＝1，nextindex++；

遍历发现结点a，a.oldindex＝0，此时lastindex＝1，满足移动条件，对a进行移动，比如生成结点调整指令move(old.index，nextindex)；

更新lastindex＝max(old.index，lastindex)，lastindex＝1，nextindex++；

顺次遍历d，发现旧集合中存在d，且d.oldindex＝3，此时lastindex＝1，不满足oldindex<lastindex的条件，无需进行移动；

更新lastindex＝max(d.oldindex，lastindex)，lastindex＝3，nextindex++；

顺次遍历c，c.oldindex＝2，此时lastindex＝3，满足移动条件，对c进行移动，比如生成结点调整指令move(old.index，nextindex)。

通过上述各种情况，生成结点调整指令后，在更新前的应用界面上执行结点调整指令即可实现更新界面的显示，提升了界面更新速度。

请参见图7，基于同一发明构思，本公开实施例提供一种应用界面更新装置700，该装置700可以包括：

获取模块701，用于获取针对应用界面的更新操作，其中，所述应用界面通过在预先封装的树形结构模板的各结点上添加应用数据而创建；

确定模块702，用于根据所述更新操作，确定界面更新后的更新界面；

对比模块703，用于将所述应用界面每一层级的结点分别与所述更新界面相应层级的结点进行对比，以确定差异信息；

调整模块704，用于根据所述差异信息调整所述应用界面的结点，以显示更新后的界面。

可选的，所述调整模块704包括：

指令生成模块，用于根据所述差异信息，生成结点调整指令；

调整子模块，用于根据所述结点调整指令，对所述应用界面进行结点添加、结点删除、或结点移动的操作，或者进行其中的两种或三种操作的组合，以显示更新后的界面。

可选的，所述指令生成模块用于：

在所述差异信息指示所述应用界面的一结点在所述更新界面的对应位置上不存在时，生成用于删除该结点的结点调整指令。

可选的，所述指令生成模块用于：

在所述差异信息指示所述更新界面的一结点在所述应用界面的对应位置上不存在时，生成用于添加该结点的结点调整指令。

可选的，所述指令生成模块用于：

在所述差异信息指示所述更新界面的第一结点与所述应用界面的相同位置上的第二结点不相同时，生成用于删除所述第二结点的结点调整指令，以及生成用于添加所述第一结点的结点调整指令。

可选的，所述指令生成模块用于：

在所述差异信息指示所述更新界面的一结点在当前层级中的位置与该结点在所述应用界面同层级中的位置不同时，生成用于移动该结点的结点调整指令。

关于上述实施例中的装置，其中各个模块执行操作的具体方式已经在有关该方法的实施例中进行了详细描述，此处将不做详细阐述说明。

图8是根据一示例性实施例示出的一种电子设备800的框图。如图8所示，该电子设备800可以包括：处理器801，存储器802。该电子设备800还可以包括多媒体组件803，输入/输出(i/o)接口804，以及通信组件805中的一者或多者。

其中，处理器801用于控制该电子设备800的整体操作，以完成上述的应用界面更新方法中的全部或部分步骤。存储器802用于存储各种类型的数据以支持在该电子设备800的操作，这些数据例如可以包括用于在该电子设备800上操作的任何应用程序或方法的指令，以及应用程序相关的数据，例如联系人数据、收发的消息、图片、音频、视频等等。该存储器802可以由任何类型的易失性或非易失性存储设备或者它们的组合实现，例如静态随机存取存储器(staticrandomaccessmemory，简称sram)，电可擦除可编程只读存储器(electricallyerasableprogrammableread-onlymemory，简称eeprom)，可擦除可编程只读存储器(erasableprogrammableread-onlymemory，简称eprom)，可编程只读存储器(programmableread-onlymemory，简称prom)，只读存储器(read-onlymemory，简称rom)，磁存储器，快闪存储器，磁盘或光盘。多媒体组件803可以包括屏幕和音频组件。其中屏幕例如可以是触摸屏，音频组件用于输出和/或输入音频信号。例如，音频组件可以包括一个麦克风，麦克风用于接收外部音频信号。所接收的音频信号可以被进一步存储在存储器802或通过通信组件805发送。音频组件还包括至少一个扬声器，用于输出音频信号。i/o接口804为处理器801和其他接口模块之间提供接口，上述其他接口模块可以是键盘，鼠标，按钮等。这些按钮可以是虚拟按钮或者实体按钮。通信组件805用于该电子设备800与其他设备之间进行有线或无线通信。无线通信，例如wi-fi，蓝牙，近场通信(nearfieldcommunication，简称nfc)，2g、3g或4g，或它们中的一种或几种的组合，因此相应的该通信组件805可以包括：wi-fi模块，蓝牙模块，nfc模块。

在一示例性实施例中，电子设备800可以被一个或多个应用专用集成电路(applicationspecificintegratedcircuit，简称asic)、数字信号处理器(digitalsignalprocessor，简称dsp)、数字信号处理设备(digitalsignalprocessingdevice，简称dspd)、可编程逻辑器件(programmablelogicdevice，简称pld)、现场可编程门阵列(fieldprogrammablegatearray，简称fpga)、控制器、微控制器、微处理器或其他电子元件实现，用于执行上述的应用界面更新方法。

在另一示例性实施例中，还提供了一种包括程序指令的计算机可读存储介质，该程序指令被处理器执行时实现上述的应用界面更新方法的步骤。例如，该计算机可读存储介质可以为上述包括程序指令的存储器802，上述程序指令可由电子设备800的处理器801执行以完成上述的应用界面更新方法。

以上结合附图详细描述了本公开的优选实施方式，但是，本公开并不限于上述实施方式中的具体细节，在本公开的技术构思范围内，可以对本公开的技术方案进行多种简单变型，这些简单变型均属于本公开的保护范围。

另外需要说明的是，在上述具体实施方式中所描述的各个具体技术特征，在不矛盾的情况下，可以通过任何合适的方式进行组合，为了避免不必要的重复，本公开对各种可能的组合方式不再另行说明。

此外，本公开的各种不同的实施方式之间也可以进行任意组合，只要其不违背本公开的思想，其同样应当视为本公开所公开的内容。