页面动画的实现方法、装置和移动终端制造方法及图纸

技术编号:13046577 阅读:64 留言:0更新日期:2016-03-23 14:20
本公开是关于一种页面动画的实现方法、装置和移动终端。该方法包括:接收页面加载指令;其中,所述页面加载指令用于指示将当前的第一页面过渡至第二页面;根据所述页面加载指令将所述第一页面的前一页面的WebView上的页面内容元素清空,将所述第二页面的页面元素内容加载进所述前一页面的WebView上形成所述第二页面并显示;其中,所述第一页面的应用栏App bar与所述第二页面的App bar之间的变化满足预设的变化条件,所述第一页面的App bar与所述前一页面的App bar之间的变化满足所述变化条件。本公开的方法,在无限加载新页面的过程中,内存占用率低,避免造成内存溢出的问题。

【技术实现步骤摘要】

本公开涉及通信技术,尤其涉及页面动画的实现方法、装置和移动终端
技术介绍
移动客户端(Application,简称APP)中,使用动画设计能够有效地引导用户的注意力,通过对页面上的导航、页面内容元素的转变进行合理的安排,从而让用户能够对交互的前后变化有合理的预期。目前最为主流的安卓操作系统(Android)和苹果操作系统(iOS)的设计规范中,都定义了对动画设计的要求,第三方APP及深度定制的系统可参考相应的动画设计规范进行APP的动画设计,并且可以自行定义APP的设计形式。相关技术中,无论是Android还是iOS系统,现有的APP动画都是以整个页面为单位移动的。在一个页面中可以包括位于页面顶部或者顶部的应用栏(Appbar)和位于页面中间区域的页面容器(WebView),该WebView用来显示页面的内容元素,当Appbar有较大变化时(如从一级页面到二级页面的过渡),这种移动方式十分合理,也具有整体性。但是,当页面的Appbar变化较小(例如同级页面的过渡)时,若同级页面存在不断打开新页面加载的情况,对于通过安卓客户端的原生方式(Native)实现的APP就会容易出现会因内存溢出导致APP强制退出的情况。
技术实现思路
为克服相关技术中存在的问题,本公开提供一种页面动画的实现方法、装置和移动终端。根据本公开实施例的第一方面,提供一种页面动画的实现方法,包括:接收页面加载指令;其中,所述页面加载指令用于指示将当前的第一页面过渡至第二页面;根据所述页面加载指令将所述第一页面的前一页面的WebView上的页面内容元素清空,将所述第二页面的页面元素内容加载进所述前一页面的WebView上形成所述第二页面并显示;其中,所述第一页面的应用栏Appbar与所述第二页面的Appbar之间的变化满足预设的变化条件,所述第一页面的Appbar与所述前一页面的Appbar之间的变化满足所述变化条件。进一步地,所述第一页面的Appbar、所述第二页面的Appbar、所述前一页面的Appbar均通过原生方式Native语言实现;所述第一页面的WebView、所述第二页面的WebView、所述前一页面的WebView均通过网页Web开发语言实现。可选的,所述第一页面、所述第二页面和所述前一页面均为同级页面。可选的,所述第一页面与所述第二页面为不同级页面,所述第一页面与所述前一页面为不同级页面。进一步地,所述第一页面的应用栏Appbar与所述第二页面的Appbar之间的变化满足预设的变化条件,所述第一页面的Appbar与所述前一页面的Appbar之间的变化满足所述变化条件,包括:所述第一页面的Appbar与所述第二页面的Appbar类型相同,且所述第一页面的Appbar的标题文字与所述第二页面的Appbar的标题文字不同;所述第一页面的Appbar与所述前一页面的Appbar类型相同,且所述第一页面的Appbar的标题文字与所述前一页面的Appbar的标题文字不同。更进一步地,所述将所述第二页面的页面元素内容加载进所述前一页面的WebView上之后,所述方法还包括:将所述前一页面的Appbar的标题文字更改为与所述第二页面的页面元素内容对应的标题文字。可选的,所述第一页面的WebView和所述前一页面的WebView均为水平放置。本公开的实施例提供的技术方案可以包括以下有益效果:通过根据页面加载指令,将第一页面的前一页面的WebView上的页面内容元素清空,将第二页面的页面元素内容加载进该前一页面的WebView上,实现第一页面到第二页面的动画切换,本实施例的方法,在实现新页面的无限加载过程中,仅需要用到两个页面的WebView,即当前的第一页面的WebView和第一页面的前一页面的WebView,在加载新的页面时,对于页面连续跳转的操作,只需要反复切换当前的第一页面的WebView、第一页面的前一页面的WebView之间的指向关系即可实现,而无需在每一次加载新页面时都加载新的WebView,确保了内存的最低占用值,从而不会造成移动终端内存的溢出,进而避免出现APPFC的情况发生。根据本公开实施例的第二方面,提供一种页面动画的实现装置,包括:接收模块,被配置为接收页面加载指令;其中,所述页面加载指令用于指示将当前的第一页面过渡至第二页面;处理模块,被配置为根据所述页面加载指令将所述第一页面的前一页面的WebView上的页面内容元素清空,将所述第二页面的页面元素内容加载进所述前一页面的WebView上形成所述第二页面;其中,所述第一页面的应用栏Appbar与所述第二页面的Appbar之间的变化满足预设的变化条件,所述第一页面的Appbar与所述前一页面的Appbar之间的变化满足所述变化条件;显示模块,被配置为显示所述第二页面。进一步地,所述第一页面的Appbar、所述第二页面的Appbar、所述前一页面的Appbar均通过原生方式Native语言实现;所述第一页面的WebView、所述第二页面的WebView、所述前一页面的WebView均通过网页Web开发语言实现。可选的,所述第一页面、所述第二页面和所述前一页面均为同级页面。可选的,所述第一页面与所述第二页面为不同级页面,所述第一页面与所述前一页面为不同级页面。进一步地,所述第一页面的应用栏Appbar与所述第二页面的Appbar之间的变化满足预设的变化条件,所述第一页面的Appbar与所述前一页面的Appbar之间的变化满足所述变化条件,包括:所述第一页面的Appbar与所述第二页面的Appbar类型相同,且所述第一页面的Appbar的标题文字与所述第二页面的Appbar的标题文字不同;所述第一页面的Appbar与所述前一页面的Appbar类型相同,且所述第一页面的Appbar的标题文字与所述前一页面的Appbar的标题文字不同。更进一步地,所述装置还包括:更改模块,被配置为在所述处理模块将所述第二页面的页面元素内容加载进所述前一页面的WebView上之后,将所述前一页面的Appbar的标题文字更改为与所述第二页面的页面元素内容对应的标题文字。可选的,所述第一页面的WebView和所述前一页面的WebView均为水平放置。本公开的实施例提供的技术方案可以包括以下有益效果:处理模块通过根据接收模块接收到的页面加载指令,将第一页面的前一页面的WebView上的页面内容元素清空,将第二页面的页面元素内容本文档来自技高网...

【技术保护点】
一种页面动画的实现方法,其特征在于,包括:接收页面加载指令;其中,所述页面加载指令用于指示将当前的第一页面过渡至第二页面;根据所述页面加载指令将所述第一页面的前一页面的网络视图WebView上的页面内容元素清空,将所述第二页面的页面元素内容加载进所述前一页面的WebView上形成所述第二页面并显示;其中,所述第一页面的应用栏App bar与所述第二页面的App bar之间的变化满足预设的变化条件,所述第一页面的App bar与所述前一页面的App bar之间的变化满足所述变化条件。

【技术特征摘要】
1.一种页面动画的实现方法,其特征在于,包括:
接收页面加载指令;其中,所述页面加载指令用于指示将当前的第一页面过渡至第二
页面;
根据所述页面加载指令将所述第一页面的前一页面的网络视图WebView上的页面内
容元素清空,将所述第二页面的页面元素内容加载进所述前一页面的WebView上形成所
述第二页面并显示;其中,所述第一页面的应用栏Appbar与所述第二页面的Appbar之
间的变化满足预设的变化条件,所述第一页面的Appbar与所述前一页面的Appbar之间
的变化满足所述变化条件。
2.根据权利要求1所述的方法,其特征在于,所述第一页面的Appbar、所述第二页
面的Appbar、所述前一页面的Appbar均通过原生方式Native语言实现;所述第一页面
的WebView、所述第二页面的WebView、所述前一页面的WebView均通过网页Web开
发语言实现。
3.根据权利要求1或2所述的方法,其特征在于,所述第一页面、所述第二页面和
所述前一页面均为同级页面。
4.根据权利要求1或2所述的方法,其特征在于,所述第一页面与所述第二页面为
不同级页面,所述第一页面与所述前一页面为不同级页面。
5.根据权利要求1所述的方法,其特征在于,所述第一页面的应用栏Appbar与所
述第二页面的Appbar之间的变化满足预设的变化条件,所述第一页面的Appbar与所述
前一页面的Appbar之间的变化满足所述变化条件,包括:
所述第一页面的Appbar与所述第二页面的Appbar类型相同,且所述第一页面的App
bar的标题文字与所述第二页面的Appbar的标题文字不同;
所述第一页面的Appbar与所述前一页面的Appbar类型相同,且所述第一页面的App
bar的标题文字与所述前一页面的Appbar的标题文字不同。
6.根据权利要求5所述的方法,其特征在于,所述将所述第二页面的页面元素内容
加载进所述前一页面的WebView上之后,所述方法还包括:
将所述前一页面的Appbar的标题文字更改为与所述第二页面的页面元素内容对应的
标题文字。
7.根据权利要求6所述的方法,其特征在于,所述第一页面的WebView和所述前
一页面的WebView均为水平放置。
8.一种页面动画的实现装置,其特征在于,包括:
接收模块,被配置为接收页面加载指令;其中,所述页面加载指令用于指示将当前的
第一页面过渡至第二页面;
处理模块,被配置为根据所述页面加载指令将所述第一页面的前一页面的WebView
上的页面内容元素清空,将所述第二页面的页面元素内容加载进所述前一页面的
WebView上形成所述第二页面;其中,所述第一页面的应用栏App...

【专利技术属性】
技术研发人员:杨伟贤李林李大松
申请(专利权)人:小米科技有限责任公司
类型:发明
国别省市:北京;11

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1