CN114327698A - 一种页面切换的方法、系统、电子装置及存储介质 - Google Patents

Abstract

本申请公开一种页面切换的方法、系统、电子装置及存储介质，页面切换的方法包括：检测到从展示第一页面切换到展示第二页面的切换指令时，获取所述第二页面与所述第一页面之间相同显示内容元素和所述第二页面与所述第一页面之间对应位置的不同显示内容元素；将所述第二页面中的不同显示内容元素替换所述第一页面对应位置的不同显示内容元素，完成第一页面至第二页面的切换展示；从而使得第二第一页面之间的切换存在了关联，以此使得用户易于理解和感知页面之间的关系，因此为用户提供了动效交互体验，增加了用户对电子设备的使用体验。

Description

一种页面切换的方法、系统、电子装置及存储介质

技术领域

本申请涉及电子设备技术领域，具体涉及一种页面切换的方法、系统、电子装置及存储介质。

背景技术

电子设备在被用户使用的过程中，经常会反馈用户的操作进行页面间的切换，以使达到用户浏览或操作不同的页面。

现有的电子设备页面之间的切换方法，是将第二页面直接叠加在第一页面上，第二页面的背景是不透明的，能够完全覆盖旧页面，从而完成页面之间的切换。

但是，现有的电子设备页面之间的切换方法，第一页面及第二页面相互之间切换时没有关联，导致用户难以理解页面相互之间的关系。

发明内容

鉴于此，本申请提供一种页面切换的方法、系统、电子装置及存储介质，以解决现有的第一页面及第二页面相互之间切换时没有关联，导致用户难以理解页面之间具有的层级关系的技术问题。

本申请第一方面提供一种页面切换的方法，包括以下步骤：检测到从展示第一页面切换到展示第二页面的切换指令时，获取所述第二页面与所述第一页面之间相同显示内容元素和所述第二页面与所述第一页面之间对应位置的不同显示内容元素；将所述第二页面中的不同显示内容元素替换所述第一页面对应位置的不同显示内容元素，完成第一页面至第二页面的切换展示。

本申请上述的页面切换的方法，通过将第二页面的不同显示内容元素替换第一页面对应位置的不同显示内容元素，能够完成不同页面之间显示内容的切换，从而完成不同页面之间的切换展示，同时，由于第二页面与第一页面之间的对应位置存在相同显示内容元素，使得在进行页面切换时，相同显示元素呈现出没有发生更换的视觉效果，从而使得两个页面切换时以相同显示元素作为关联，因此便于用户理解页面相互之间的关系。

本申请第二方面提供一种页面切换的系统，包括：检测及获取模块，用于检测到从展示第一页面切换到展示第二页面的切换指令时，获取所述第二页面与所述第一页面之间的相同显示内容元素和所述第二页面与所述第一页面之间对应位置的不同显示内容元素；元素替换模块，用于将第二页面中的不同显示内容元素替换所述第一页面对应位置的不同显示内容元素，完成第一页面至第二页面的切换展示。

本申请上述的页面切换的系统，通过元素替换模块能够将第二页面的不同显示内容元素替换第一页面对应位置的不同显示内容元素，完成不同页面之间显示内容的切换，从而完成不同页面之间的切换展示，同时，由于第二页面与第一页面之间的对应位置存在相同显示内容元素，使得在进行页面切换时，相同显示元素呈现出没有发生更换的视觉效果，从而使得两个页面切换时以相同显示元素作为关联，因此便于用户理解页面相互之间的关系。

本申请第三方面提供一种电子装置，包括：存储器、处理器及存储在所述存储器上并可在所述处理器上运行的计算机程序，所述处理器执行所述计算机程序时，实现上述中的任意一项所述页面切换的方法。

本申请第四方面提供一种计算机可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时，实现上述中的任意一项所述页面切换的方法。

附图说明

为了更清楚地说明本申请实施例中的技术方案，下面将对实施例描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本申请的一些实施例，对于本领域技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1是本申请实施例页面切换的方法的流程示意图；

图2是图1中S1执行后S2的具体流程示意图；

图3是图2中S1执行后S11的具体流程示意图；

图4是图2中S11执行后S12的具体流程示意图；

图5为本申请实施例页面切换的方法的非一级页面的页面元素分布图；

图6为本申请实施例页面切换的方法的一级页面的页面元素分布图；

图7是本申请实施例电子装置的结构示意框图；

图8A、图8B、图8C及图8D依次为本申请实施例页面切换的方法一级页面至二级页面的切换效果示意图；

图8D、图9A、图9B及图9C依次为本申请实施例页面切换的方法二级页面至三级页面的切换效果示意图。

具体实施方式

下面结合附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅是本申请一部分实施例，而非全部实施例。基于本申请中的实施例，本领域技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本申请保护的范围。在不冲突的情况下，下述各个实施例及其技术特征可以相互组合。

参照图1，本申请实施例提供一种页面切换的方法，包括：S1、检测到从展示第一页面切换到展示第二页面的切换指令时，获取第二页面与第一页面之间相同显示内容元素和第二页面与第一页面之间对应位置的不同显示内容元素；S2、将第二页面中的不同显示内容元素替换第一页面对应位置的不同显示内容元素，完成第一页面至第二页面的切换展示。

在进行页面切换时，通过将第二页面的不同显示内容元素替换第一页面对应位置的不同显示内容元素，能够完成不同页面之间显示内容的切换，从而完成不同页面之间的切换展示，同时，由于第二页面与第一页面之间的对应位置存在相同显示内容元素，使得在进行页面切换时，相同显示元素呈现出没有发生更换的视觉效果，从而使得两个页面切换时以相同显示元素作为关联。

请参阅图5及图6，在页面中，组成页面的元素包括标题栏1、页面内容栏2，及第二页面与第一页面在相同位置具有相同元素的共有元素栏3，第二页面为将要切换至的页面，第一页面为将要消除的页面。

在本实施例中，相同显示内容元素可以为上述中的共有元素栏3；不同显示内容元素可以为上述中的标题栏1及内容栏2；在进行页面切换时。

请参阅图8A至图9C，通过将第二页面的相同显示内容元素替换在第一页面的相同显示内容元素处，能够使得第二页面及第一页面切换时，体现出共有元素没有发生改变的视觉效果，从而通过相同显示内容元素在用户的视觉上保持了第二页面及第一页面之间的衔接关系，而又通过使用第二页面中的不同显示内容元素替换在第一页面对应位置的不同显示内容元素处，能够使得第二第一页面之间的切换存在了关联，以此使得用户易于理解和感知页面之间的关系，因此为用户提供了动效交互体验，增加了用户对电子设备的使用体验。

其中，在图8A至图8D中，8A为一级页面且作为第一页面，8D为第二页面，在进行页面切换时，第一页面8A的标题栏(Settings)虚化并缩小至图8B的状态，同时第一页面的内容栏虚化至图8B的状态，直至图8A页面的标题栏及内容栏虚化至完全透明，随后第二页面从完全透明逐渐降低透明度至图8C的半透明状态，直至降低透明度至图8D表现的完全不透明的状态。

在图8D至图9C中，8D作为第一页面，9C作为第二页面，且第一页面及第二页面均不是一级页面，在从第一页面8D切换至第二页面9C的过程中，第一页面8D的标题栏(Wi-Fi&internet)及内容栏逐渐虚化至9A状态，随后逐渐虚化至完全透明，随后第二页面从完全透明态逐渐降低透明度至图9B的状态，直至降低透明度至图9C表现的完全不透明状态。

第二页面与第一页面之间的不同元素包括标题栏、内容栏；共有元素为第二页面与第一页面在相同位置且具有相同元素的共有元素栏。

在本实施例中，将第二页面中的不同显示内容元素替换第一页面对应位置的不同显示内容元素的步骤包括：S11、若第二页面的标题栏与第一页面的标题栏不同，利用第一动态效果将第一页面的标题栏消除；S12、利用第二动态效果将第二页面的标题栏替换在第一页面的标题栏处。

请参阅图1及图2，执行完S1即执行S2的S11，通过使用第一动态效果及第二动态效果，能够使得第一页面的标题栏及第二页面的标题栏之间的切换存在动态的变化关系，从而使得第二页面及第一页面之间的切换存在动态变化关系。

在本实施例中将第二页面中的不同显示内容元素替换替换第一页面对应位置的不同显示内容元素的步骤还包括：S13、利用第三动态效果将第一页面的显示内容栏消除；S14、利用第四动态效果将第二页面的显示内容栏替换替换在第一页面的内容栏处。

请参阅图1及图2，执行完S1，在执行S11的同时，执行S13，通过使用第三动态效果及第四动态效果，能够使得第二第一页面的内容栏之间的切换存在动态的变化关系，从而进一步增加了第二第一页面之间的切换存在的动态变化关系。

在另一实施例中，利用第一动态效果将第一页面的标题栏消除包括：对第一页面的标题栏使用旋转、缩放平移、和/或虚化的动态效果，并消除第一页面的标题栏。

在将第一页面的标题栏消除的同时，使用旋转、缩放、平移和/或虚化的动态效果，能够使得标题栏在消除的过程中，动态效果更加的明显，能够使得第二页面的标题栏与第一页面的标题栏之间的动态衔接更加明显，从而增强了第一页面的标题栏及第二页面的标题栏之间存在动态的变化关系，使得用户能够更加易于理解页面之间具有的动态变化关系。

在本实施例中，页面切换的方法还包括：判断第二页面或第一页面是否为一级页面；若是，则将分割栏划分为共有元素栏；若否，则将分割栏及功能图标划分为共有元素栏；分割栏用于分割标题栏及页面内容栏；功能图标图标用于在用户点击后实现预定功能。

分割栏为实体的分割线或空白的分割区；功能图标为返回图标，用于在用户点击后从返回当前页面的更高一层级页面。

由于一级页面为初始页面，无法返回更高一层级的页面；而非一级页面，可以返回更高一层级的页面，因此在一级页面上没有返回图标，在非一级页面上具有返回图标。

在本实施例中，一级页面在初始状态下，分割栏为空白的分割区，一级页面在非初始状态下，分割栏为分割线，一级页面在响应于用户的上滑操作后，页面上滑，从初始状态转变为非初始状态的过程中，标题栏内的标题逐渐缩小至预定大小，分割线从透明态逐渐降低透明度将空白的分割区覆盖，从而将标题栏及内容栏分割；非一级页面的分割栏为分割线，这样设置的分割栏，能够便于用户区分当前页面是否为一级页面。

在本实施例中，使用第一动态效果将第一页面的标题栏消除包括：S111、判断第一页面是否为一级页面；S112、若第一页面为一级页面，则对第一页面的标题栏使用缩小或放大的动态效果，并将标题栏逐渐虚化至透明，以消除第一页面的标题栏；S113、若第一页面不为一级页面，则对第一页面的标题栏使用平移的动态效果，并将标题栏逐渐虚化至透明，以消除第一页面的标题栏。

在本实施例中，S112为：若第一页面为一级页面，则对第一页面的标题栏使用缩小的动态效果，并将标题栏逐渐虚化至透明，消除第一页面的标题栏。

请参阅图2及图3，在S1执行完后，即执行S11的S111，随后执行S113或S112，在第一页面为一级页面的情况下，通过将一级页面标题栏使用缩小或放大的动态效果，非一级页面的标题栏使用平移的动态效果，能够进一步便于用户区分当前页面是否为一级页面。

在第一页面为非一级页面的情况下，第一页面的标题栏使用的动态效果为标题栏内的标题在第一页面上沿水平方向的平移。

请参阅图8A至图9C，通过使用平移的动态效果，能够体现标题栏逐渐被空出来的视觉效果，因此在将第二页面的标题栏替换在第一页面的标题栏上后，体现的是当前页面上的标题栏逐渐被空出来，又被填充的视觉效果，因此增强了第一页面的标题栏及第二页面的标题栏之间存在的动态变化关系。

其中，在图8A至图8D中，图8A为一级页面且作为第一页面，8D为第二页面，在进行页面切换时，除了标题栏及内容栏的透明态改变，还有标题栏的动态效果，第一页面8A的标题栏(Settings)缩小至8B的标题栏(Settings)所示；第二页面的标题栏(Wi-Fi&internet)在透明度改变的同时，还从左向右平移(从图8C平移至图8D的状态)。

在图8D至图9C中，8D作为第一页面，9C作为第二页面，且第一页面及第二页面均不是一级页面，在进行页面切换时，除了标题栏及内容栏的透明态改变，还有标题栏的动态效果，第一页面8D的标题栏(Wi-Fi&internet)从右向左移动(从图8D平移至图9A的状态)，在第一页面被消除后，第二页面的标题栏(SIM&network settings)从右向左移动(从图9B移动至图9C的状态)。

在另一实施例中，利用第二动态效果将第二页面的标题栏替换在第一页面的标题栏处包括：对第二页面的标题栏使用旋转、缩放、平移和/或降低透明度的动态效果，替换第一页面的标题栏。

在将第二页面的标题栏替换第一页面的标题栏的同时，使用旋转、缩放、平移和/或降低透明度的动态效果，能够使得标题栏在消除的过程中，动态效果更加的明显，能够使得第二页面的标题栏与第一页面的标题栏之间的动态衔接更加明显，从而增强了第一页面的标题栏及第二页面的标题栏之间存在动态的变化关系，使得用户能够更加易于理解页面之间具有的动态变化关系。

在本实施例中，使用第二动态效果将第二页面的标题栏替换在第一页面的标题栏处包括：S121、判断第二页面是否为一级页面；S122、若第二页面为一级页面，则对第二页面的标题栏使用缩小或放大的动态效果，并将标题栏从透明态逐渐降低透明度至正常显示，替换第一页面的标题栏，正常显示为完成第一页面至第二页面的切换后第二页面的标题栏的显示形态；S123、若第二页面不为一级页面，对第二页面的标题栏使用平移的动态效果，并将标题栏从透明态逐渐降低透明度至正常显示，替换第一页面的标题栏，正常显示为完成第一页面至第二页面的切换后第二页面的标题栏的显示形态。

在本实施例中，S122为：若第二页面为一级页面，则对第二页面的标题栏使用缩小或放大的动态效果，并将标题栏从透明态逐渐降低透明度至正常显示，替换第一页面的标题栏，从而进一步地方便了用户区分当前页面是否为一级页面。

请参阅图2及图4，在S11执行完后，即执行S11的S121，随后执行S122或S123，在第二页面为非一级页面的情况下，第二页面的标题栏使用动态效果为标题栏内的标题在第二页面上沿水平方向的平移，且平移方向与第一页面的标题栏在第一页面上的平移方向相同。

通过将第二页面标题栏使用平移的动态效果，且标题栏内标题的平移方向与第一页面的标题栏内标题的平移方向相同，请参阅图8A至图9C，体现的是呈滚动字幕的方式进行的第二页面与第一页面之间标题栏的切换，因此增强了第一页面的标题栏及第二页面的标题栏之间存在的动态变化关系。

具体地，在图8A至图9C中，以图8D至图9C为例，8D作为第一页面，9C作为第二页面，且第一页面及第二页面均不是一级页面，在进行页面切换时，除了标题栏及内容栏的透明态改变，还有标题栏的动态效果，第一页面8D的标题栏(Wi-Fi&internet)从右向左移动(从图8D平移至图9A的状态)，在第一页面被消除后，第二页面的标题栏(SIM&networksettings)从右向左移动(从图9B移动至图9C的状态)，从而体现出滚动字幕的方式进行第二页面与第一页面之间标题栏的切换。

在另一实施例中，利用第三动态效果将第一页面的内容栏消除包括：对第一页面的内容栏使用旋转、缩放、平移和/或虚化的动态效果，并消除第一页面的内容栏。

在将第一页面的内容栏消除的同时，而使用旋转、缩放、平移和/或虚化的动态效果，能够使得第二页面的内容栏替换第一页面的内容栏的过程中，动态效果更加的明显，从而能够使得第二页面的内容栏与第一页面的内容栏之间的动态衔接更加明显，从而增强了第一页面的内容栏及第二页面的内容栏之间存在动态的变化关系，使得用户能够更加易于理解页面之间具有的层级关系

在本实施例中，使用第三动态效果将第一页面的内容栏消除包括：对第一页面的内容栏使用平移的动态效果，并将内容栏逐渐虚化至透明，消除第一页面的内容栏。

在将第一页面的内容栏虚化至透明后，第一页面的内容栏就已被消除，而在虚化的同时使用平移的动态效果，能够体现内容栏逐渐被空出来的视觉效果，因此在将第二页面的内容栏替换在第一页面的内容栏上后，请参阅图8A至图9C，体现的是当前页面上的内容栏逐渐被空出来，又被填充的视觉效果，因此增强了第一页面的内容栏及第二页面的内容栏之间存在的动态变化关系。

具体地，在图8A至图9C中，以图8D至图9C为例，8D作为第一页面，9C作为第二页面，且第一页面及第二页面均不是一级页面，在进行页面切换时，除了标题栏及内容栏的透明态改变，还有标题栏的动态效果，第一页面8D的标题栏(Wi-Fi&internet)从右向左移动(从图8D平移至图9A的状态)，呈现出逐渐将内容栏空出来的视觉效果，在第一页面被消除后，呈现出内容栏完全被空出来的效果，第二页面的标题栏(SIM&network settings)从右向左移动(从图9B移动至图9C的状态)，呈现逐渐填补内容栏的空白的效果，从而呈现出滚动字幕的方式进行第二页面与第一页面之间标题栏的切换。对第一页面的内容栏使用平移的动态效果为内容栏内的内容在第一页面上沿竖直方向的平移。

竖直方向的平移，不仅能够区别标题栏的内容水平方向的平移，增加了第二第一页面之间的切换关系，从而进一步增加了第二第一页面之间存在的动态变化关系。

在另一实施例中，使用第四动态效果将第二页面的内容栏替换在第一页面的内容栏处包括：对第二页面的内容栏使用旋转、缩放、平移和/或降低透明度的动态效果，并替换第一页面的内容栏。

在第一页面的内容栏被消除的过程中，而使用旋转、缩放、平移和/或降低透明度的动态效果，能够使得第二页面内容栏的动态效果更加的明显，从而能够使得第二页面的内容栏与第一页面的内容栏之间的动态衔接更加明显，从而增强了第一页面的内容栏及第二页面的内容栏之间存在动态的变化关系，使得用户能够更加易于理解页面之间具有的层级关系。

在本实施例中，使用第四动态效果将第二页面的内容栏替换在第一页面的内容栏处包括：对第二页面的内容栏使用平移的动态效果，并将内容栏从透明态逐渐降低透明度至正常显示，替换第一页面的内容栏，上述正常显示为完成第一页面至第二页面的切换后第二页面的内容栏的显示形态。

对第二页面的内容栏使用平移的动态效果为内容栏内的内容在第一页面上沿竖直方向的平移，且平移方向与第一页面的标题栏在第一页面上的平移方向相反。

通过将第二页面内容栏使用平移的动态效果，且内容栏内内容的平移方向与第一页面的内容栏内内容的平移方向相反，请参阅图8A至图9C，体现的是第一页面的内容栏划出当前页面，而第二页面的内容栏滑入当前页面的视觉效果，因此使得用户能够更加易于理解页面之间具有的层级关系。

本申请实施例还提供一种页面切换的系统，请参阅图7，包括：检测及获取模块，用于检测到从展示第一页面切换到展示第二页面的切换指令时，获取第二页面与第一页面之间的相同显示内容元素和第二页面与第一页面之间对应位置的不同显示内容元素；元素替换模块，用于将第二页面中的不同显示内容元素替换第一页面对应位置的不同显示内容元素，完成第一页面至第二页面的切换展示。

第二页面与第一页面之间的不同元素包括标题栏、内容栏；共有元素为第二页面与第一页面在相同位置且具有相同元素的共有元素栏。

元素替换模块包括：标题栏消除单元及标题栏替换单元；标题栏消除单元用于若第二页面的标题栏与第一页面的标题栏不同，利用第一动态效果将第一页面的标题栏消除；标题栏替换单元用于利用第二动态效果将第二页面的标题栏替换在第一页面的标题栏处。

元素替换模块还包括：内容栏消除单元及内容栏替换单元；内容栏消除单元用于利用第三动态效果将第一页面的内容栏消除；内容栏替换单元用于利用第四动态效果将第二页面的内容栏替换在第一页面的内容栏处。

在另一实施例中，标题栏消除单元包括：动态标题消除子单元，用于对第一页面的标题栏使用旋转、缩放平移、和/或虚化的动态效果，并消除第一页面的标题栏。

在本实施例中，标题栏消除单元包括：第一判断子单元、第一缩放子单元及第一平移子单元；第一判断子单元用于判断第一页面是否为一级页面；第一缩放子单元用于若第一页面为一级页面，则对第一页面的标题栏使用缩小或放大的动态效果，并将标题栏逐渐虚化至透明，消除第一页面的标题栏；平移子单元用于若第一页面不为一级页面，则对第一页面的标题栏使用平移的动态效果，并将标题栏逐渐虚化至透明，消除第一页面的标题栏。

在本实施例中，第一缩放子单元为缩小子单元，用于若第一页面为一级页面，则对第一页面的标题栏使用缩小动态效果，并将标题栏逐渐虚化至透明，消除第一页面的标题栏；且平移子单元使用的动态效果，为标题栏内的标题在第一页面上沿水平方向的平移。

在另一实施例中，标题栏替换单元包括：动态标题替换子单元，用于对第二页面的标题栏使用旋转、缩放、平移和/或降低透明度的动态效果，替换第一页面的标题栏。

在本实施例中，标题栏替换单元包括：第二判断子单元，第二缩放子单元及第二平移子单元；第二判断子单元用于判断第二页面是否为一级页面；第二缩放子单元用于若第二页面为一级页面，则对第二页面的标题栏使用缩小或放大的动态效果，并将标题栏从透明态逐渐降低透明度至正常显示，上述正常显示为完成第一页面至第二页面的切换后第二页面的标题栏的显示形态，替换第一页面的标题栏；第二平移子单元若第二页面不为一级页面，对第二页面的标题栏使用平移的动态效果，并将标题栏从透明态逐渐降低透明度至正常显示，替换第一页面的标题栏，上述正常显示为完成第一页面至第二页面的切换后第二页面的标题栏的显示形态。

在本实施例中，第二缩放子单元为放大子单元，用于若第二页面为一级页面，则对第二页面的标题栏使用放大的动态效果，并将标题栏从透明态逐渐降低透明度至正常显示，替换第一页面的标题栏；第二平移子单元对第二页面的标题栏使用平移的动态效果为标题栏内的标题在第二页面上沿水平方向的平移。

在另一实施例中，内容栏消除单元包括：动态内容消除子单元，用于对第一页面的内容栏使用旋转、缩放、平移和/或虚化的动态效果，并消除第一页面的内容栏。

在本实施例中，内容栏消除单元包括：第三平移子单元，用于对第一页面的内容栏使用平移的动态效果，并将内容栏逐渐虚化至透明，消除第一页面的内容栏。第三平移单元对第一页面的内容栏使用平移的动态效果为页面内容栏内的内容在第一页面上沿竖直方向的平移。

在另一实施例中，内容栏替换替换替换单元包括：动态内容替换替换子单元，用于对第二页面的内容栏使用旋转、缩放、平移和/或降低透明度的动态效果，并替换第一页面的内容栏。

在本实施例中，内容栏替换单元包括：第四平移子单元，用于对第二页面的内容栏使用平移的动态效果，并将内容栏从透明态逐渐降低透明度至正常显示，替换第一页面的内容栏，上述正常显示为完成第一页面至第二页面的切换后第二页面的内容栏的显示形态；第四平移子单元对第二页面的内容栏使用平移的动态效果为页面内容栏内的内容在第一页面上沿竖直方向的平移。

在本实施例中，页面切换的系统还包括：一级页面判断模块，用于判断第二页面或第一页面是否为一级页面；元素栏划分模块，用于第二页面或第一页面是一级页面的情况下，将分割栏划分为共有元素栏，并用于第二页面或第一页面不是一级页面的情况下，将分割栏及功能图标划分为共有元素栏；分割栏用于分割标题栏及页面内容栏；功能图标图标用于在用户点击后实现预定功能

本申请实施例提供一种电子装置，请参阅图6，该电子装置包括：存储器601、处理器602及存储在存储器601上并可在处理器602上运行的计算机程序，处理器602执行该计算机程序时，实现前述中描述的页面切换的方法。

进一步的，该电子装置还包括：至少一个输入设备603以及至少一个输出设备604。

上述存储器601、处理器602、输入设备603以及输出设备604，通过总线605连接。

其中，输入设备603具体可为摄像头、触控面板、物理按键或者鼠标等等。输出设备604具体可为显示屏。

存储器601可以是高速随机存取记忆体(RAM，Random Access Memory)存储器，也可为非不稳定的存储器(non-volatile memory)，例如磁盘存储器。存储器601用于存储一组可执行程序代码，处理器602与存储器601耦合。

本申请中描述的电子设备可以但不限于为诸如手机、平板电脑、笔记本电脑、掌上电脑、个人数字助理(Personal Digital Assistant，PDA)、便捷式媒体播放器(PortableMedia Player，PMP)、导航装置、可穿戴设备、智能手环、计步器等移动终端，以及诸如数字TV、台式计算机等固定终端中的任意一种。

进一步的，本申请实施例还提供了一种计算机可读存储介质，该计算机可读存储介质可以是设置于上述各实施例中的电子装置中，该计算机可读存储介质可以是前述中的存储器601。该计算机可读存储介质上存储有计算机程序，该程序被处理器602执行时实现前述实施例中描述的页面切换的方法。

进一步的，该计算机可存储介质还可以是U盘、移动硬盘、只读存储器601(ROM，Read-Only Memory)、RAM、磁碟或者光盘等各种可以存储程序代码的介质。

尽管已经相对于一个或多个实现方式示出并描述了本申请，但是本领域技术人员基于对本说明书和附图的阅读和理解将会想到等价变型和修改。本申请包括所有这样的修改和变型，并且仅由所附权利要求的范围限制。特别地关于由上述组件执行的各种功能，用于描述这样的组件的术语旨在对应于执行所述组件的指定功能(例如其在功能上是等价的)的任意组件(除非另外指示)，即使在结构上与执行本文所示的本说明书的示范性实现方式中的功能的公开结构不等同。

即，以上所述仅为本申请的实施例，并非因此限制本申请的专利范围，凡是利用本申请说明书及附图内容所作的等效结构或等效流程变换，例如各实施例之间技术特征的相互结合，或直接或间接运用在其他相关的技术领域，均同理包括在本申请的专利保护范围内。

另外，在本申请的描述中，术语“第一”、“第二”仅用于描述目的，而不能理解为指示或暗示相对重要性或者隐含指明所指示的技术特征的数量。由此，限定有“第一”、“第二”的特征可以明示或者隐含地包括一个或者更多个特征。在本申请的描述中，“多个”的含义是两个或两个以上，除非另有明确具体的限定。

为了使本领域任何技术人员能够实现和使用本申请，本申请给出了以上描述。在以上描述中，为了解释的目的而列出了各个细节。应当明白的是，本领域普通技术人员可以认识到，在不使用这些特定细节的情况下也可以实现本申请。在其它实施例中，不会对公知的结构和过程进行详细阐述，以避免不必要的细节使本申请的描述变得晦涩。因此，本申请并非旨在限于所示的实施例，而是与符合本申请所公开的原理和特征的最广范围相一致。

Claims (14)

1.一种页面切换的方法，其特征在于，包括以下步骤：

检测到从展示第一页面切换到展示第二页面的切换指令时，获取所述第二页面与所述第一页面之间相同显示内容元素和所述第二页面与所述第一页面之间对应位置的不同显示内容元素；

将所述第二页面中的不同显示内容元素替换所述第一页面对应位置的不同显示内容元素，完成第一页面至第二页面的切换展示。

2.根据权利要求1所述的页面切换的方法，其特征在于，

所述第二页面与所述第一页面之间的所述不同显示内容元素包括标题栏、内容栏；所述相同显示内容元素为第二页面与所述第一页面在相同位置且具有相同显示内容元素的共有元素栏；

所述将所述第二页面中的不同显示内容元素替换所述第一页面对应位置的不同显示内容元素的步骤包括：

若所述第二页面的标题栏与所述第一页面的标题栏不同，利用第一动态效果将所述第一页面的标题栏消除；

利用第二动态效果将所述第二页面的标题栏替换在所述第一页面的标题栏处。

3.根据权利要求2所述的页面切换的方法，其特征在于，

所述将所述第二页面中的不同显示内容元素替换替换所述第一页面对应位置的不同显示内容元素的步骤还包括：

利用第三动态效果将所述第一页面的显示内容栏消除；

利用第四动态效果将所述第二页面的显示内容栏替换替换在所述第一页面的内容栏处。

4.根据权利要求2所述的页面切换的方法，其特征在于，

所述利用第一动态效果将所述第一页面的标题栏消除包括：

对所述第一页面的所述标题栏使用旋转、缩放平移、和/或虚化的动态效果，并消除所述第一页面的标题栏。

5.根据权利要求4所述的页面切换的方法，其特征在于，所述利用第一动态效果将所述第一页面的标题栏消除包括：

若所述第一页面为一级页面，则对所述第一页面的所述标题栏使用缩小或放大的动态效果，并将所述标题栏逐渐虚化至透明，以消除所述第一页面的标题栏；

若所述第一页面不为一级页面，则对所述第一页面的所述标题栏使用平移的动态效果，并将所述标题栏逐渐虚化至透明，以消除所述第一页面的标题栏。

6.根据权利要求2所述的页面切换的方法，其特征在于，

所述利用第二动态效果将所述第二页面的标题栏替换在所述第一页面的标题栏处包括：

若所述第二页面为一级页面，则对所述第二页面的所述标题栏使用缩小或放大的动态效果，并将所述标题栏从透明态逐渐降低透明度至正常显示，替换所述第一页面的标题栏，所述正常显示为完成第一页面至第二页面的切换后所述第二页面的标题栏的显示形态；

若所述第二页面不为一级页面，对所述第二页面的所述标题栏使用平移的动态效果，并将所述标题栏从透明态逐渐降低透明度至正常显示，替换所述第一页面的标题栏，所述正常显示为完成第一页面至第二页面的切换后所述第二页面的标题栏的显示形态。

7.根据权利要求3所述的页面切换的方法，其特征在于，

所述利用第三动态效果将所述第一页面的内容栏消除包括：

对所述第一页面的所述内容栏使用平移的动态效果，并将所述内容栏逐渐虚化至透明，消除所述第一页面的内容栏。

8.根据权利要求7所述的页面切换的方法，其特征在于，

所述对所述第一页面的所述内容栏使用平移的动态效果为页面内容栏内的内容在所述第一页面上沿竖直方向的平移。

9.根据权利要求3所述的页面切换的方法，其特征在于，

所述利用第四动态效果将第二页面的内容栏替换替换在所述第一页面的内容栏处包括：

对第二页面的所述内容栏使用旋转、缩放、平移和/或降低透明度的动态效果，并替换替换所述第一页面的内容栏。

10.根据权利要求3所述的页面切换的方法，其特征在于，

所述使用第四动态效果将第二页面的内容栏替换替换在所述第一页面的内容栏处包括：

对第二页面的所述内容栏使用平移的动态效果，并将所述内容栏从透明态逐渐降低透明度至正常显示，替换替换所述第一页面的内容栏，所述正常显示为完成第一页面至第二页面的切换后所述第二页面的内容栏的显示形态。

11.根据权利要求2所述的页面切换的方法，其特征在于，

所述方法还包括：

判断所述第二页面或所述第一页面是否为一级页面；

若是，则将分割栏划分为相同显示内容元素栏；

若否，则将分割栏及功能图标划分为相同显示内容元素栏；

所述分割栏用于分割所述标题栏及页面内容栏；

所述功能图标图标用于在用户点击后实现预定功能。

12.一种页面切换的系统，其特征在于，包括：

检测及获取模块，用于检测到从展示第一页面切换到展示第二页面的切换指令时，获取所述第二页面与所述第一页面之间的相同显示内容元素和所述第二页面与所述第一页面之间对应位置的不同显示内容元素；

元素替换模块，用于将第二页面中的不同显示内容元素替换所述第一页面对应位置的不同显示内容元素，完成第一页面至第二页面的切换展示。

13.一种电子装置，包括：存储器、处理器及存储在所述存储器上并可在所述处理器上运行的计算机程序，其特征在于，所述处理器执行所述计算机程序时，实现权利要求1至11中的任意一项所述方法。

14.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时，实现权利要求1至11中的任意一项所述方法。

Images