一种界面显示处理方法、装置及设备制造方法及图纸

技术编号:27005889 阅读:17 留言:0更新日期:2021-01-08 17:08
本发明专利技术公开一种界面显示处理方法、装置及设备。该方法包括:检测当前界面的手势操作,所述当前界面预先划分为第一区域和第二区域;在所述手势操作为上滑手势时,所述第一区域的内容跟随所述手势向上移动,与在顶部位置显示的新加入的第三区域的内容生成形成新界面。

【技术实现步骤摘要】
一种界面显示处理方法、装置及设备本申请是2015年11月2日提交的、申请号为201510741944.9、专利技术名称为一种界面显示处理方法、装置及设备的专利申请的分案申请。
本专利技术涉及移动互联网
,具体涉及一种界面显示处理方法、装置及设备。
技术介绍
目前,随着智能移动终端技术的不断发展,用户愈加喜欢使用移动终端浏览各种网页内容,例如新闻、视频、图片等。移动终端一般通过各种浏览器显示各种网页内容。相关的浏览器显示网页内容的页面,例如显示新闻资讯时,有一种方式是采用常见的瀑布流的方式展现内容,这些内容可以简称为信息流。由于终端屏幕的限制,这些信息流一般是部分内容显示在当前界面,部分内容未显示,如果检测到用户滑动屏幕,再将未显示的内容显示在当前界面。但是,一般浏览器的显示界面中,显示的内容可能比较多,例如既有新闻资讯内容,又有导航栏和搜索入口等,因此对于这些不同功能的显示内容,在检测到用户使用手势操作浏览器界面时,需要提供一种处理方法使得能根据手势操作实现界面显示的自然过渡切换。
技术实现思路
为解决上述技术问题,本专利技术提供一种界面显示处理方法、装置及设备,能根据手势操作实现界面显示的自然过渡切换。根据本专利技术的第一方面,提供一种界面显示处理方法,包括:检测当前界面的手势操作,所述当前界面预先划分为第一区域和第二区域;在所述手势操作符合预定手势时,切换进入包含所述第一区域的内容的新界面;所述手势操作为上滑手势;所述切换进入包含所述第一区域的内容的新界面包括:切换进入包含所述第一区域的内容及新加入的第三区域的内容的新界面;其中,所述切换进入包含所述第一区域的内容及新加入的第三区域的内容的新界面,包括:在所述手势操作为上滑手势时,所述第一区域的内容跟随所述手势向上移动,与在顶部位置显示的新加入的第三区域的内容形成新界面。可选的,所述第一区域跟随手势移动,所述第二区域不随手势移动。可选的,所述第一区域包含导航区域及内容区域或仅包含内容区域,其中,所述内容区域为信息流。可选的,所述信息流包含多个频道内容的集合,且在当前界面呈现至少一个频道内容的集合。可选的,所述新界面为信息流的首页。可选的,所述在所述手势操作符合预定手势时,切换进入包含所述第一区域的内容的新界面包括:在所述手势操作符合预定手势且所述手势位于所述第一区域时,切换进入包含所述第一区域的内容的新界面。可选的,所述第三区域为信息流的标题栏区域。可选的,还包括:当检测到所述上滑手势的移动距离大于或等于设定距离阈值,或所述上滑手势的移动速度大于或等于设定速度阈值时,所述第一区域的内容与在顶部位置显示的新加入的第三区域的内容拼接形成新界面。可选的,所述在顶部位置显示的新加入的第三区域的内容是在顶部位置自上而下、自左向右或自右向左滑入显示。可选的,所述在所述手势操作为上滑手势时,所述第一区域的内容跟随所述手势向上移动包括:在所述手势操作为上滑手势时,将所述第一区域截图后的截图内容跟随所述手势向上移动。可选的,还包括:在所述将所述第一区域截图后的截图内容跟随所述手势向上移动时,所述第二区域的内容显示蒙版效果并被所述第一区域的内容和所述第三区域的内容覆盖。可选的,在所述上滑手势的移动速度大于或等于设定速度阈值时,所述第一区域的内容与所述第三区域的内容拼接时显示反向回弹动画。可选的,在所述第一区域的内容与所述第三区域的内容拼接时,在连接的边缘区域显示逐渐淡入的外阴影。可选的,所述切换进入包含所述第一区域的内容的新界面时还包括:在新界面的工具栏区域中显示所述当前界面的工具栏的各个图标中的其中一个图标。可选的,在检测到所进入的新界面的工具栏区域中的返回主页图标被触摸后,返回的主页中所述第一区域显示对应新界面显示频道的内容。根据本专利技术的第二方面,提供一种界面显示处理方法,包括:检测当前界面的手势操作,所述当前界面预先划分为第一区域和第二区域;在所述手势操作符合预定手势时,切换进入包含所述第一区域的内容的新界面;所述手势操作为下拉手势;所述切换进入包含所述第一区域的内容的新界面包括:切换进入包含所述第一区域的内容及新加入的第三区域的内容的新界面;其中,所述切换进入包含所述第一区域的内容及新加入的第三区域的内容的新界面,包括:在所述手势操作为下拉手势时,所述第一区域的内容跟随所述手势向下移动,再反弹向上移动,与在顶部位置显示的新加入的第三区域的内容形成新界面。可选的,所述第一区域跟随手势移动,所述第二区域不随手势移动。可选的,所述方法还包括:在所述第一区域的内容跟随所述手势向下移动同时进行后台刷新,将所述后台刷新后的内容与在顶部位置显示的新加入的第三区域的内容拼接形成新界面。可选的,所述第一区域包含导航区域及内容区域或仅包含内容区域,其中,所述内容区域为信息流。可选的,所述信息流包含多个频道内容的集合,且在当前界面呈现至少一个频道内容的集合。可选的,所述新界面为信息流的首页。可选的,所述在所述手势操作符合预定手势时,切换进入包含所述第一区域的内容的新界面包括:在所述手势操作符合预定手势且所述手势位于所述第一区域时,切换进入包含所述第一区域的内容的新界面。可选的,所述切换进入包含所述第一区域的内容及新加入的第三区域的内容的新界面包括:在所述手势操作为下拉手势时,切换进入包含所述第一区域后台刷新后的内容及新加入的第三区域的内容的新界面。可选的,所述第三区域为信息流的标题栏区域。可选的,还包括:当检测到所述下拉手势释放后,所述第一区域的内容再反弹向上移动与在顶部位置显示的新加入的第三区域的内容拼接形成新界面。可选的,所述在顶部位置显示的新加入的第三区域的内容是在顶部位置自上而下、自左向右或自右向左滑入显示。可选的,在所述第一区域的内容与所述第三区域的内容拼接时,在连接的边缘区域显示逐渐淡入的外阴影。可选的,所述在所述手势操作为下拉手势时,所述第一区域的内容跟随所述手势向下移动同时进行后台刷新包括:在所述手势操作为下拉手势时,所述第一区域的内容跟随所述手势向下移动,所述第二区域的内容逐渐消失并在所述第二区域的位置显示刷新提示,后台对第一区域的内容进行内容刷新。可选的,所述第二区域的内容逐渐消失包括:将所述第二区域的下边缘向下进行拉伸变形,同时所述第二区域的内容逐渐消失。可选的,所述将所述第二区域的下边缘向下进行拉伸变形包括:将所述第二区域的下边缘采用二次贝塞尔曲线方式向下进行拉伸变形。可选的,所述第一区域的内容跟随所述手势向下移动包括:所述第一区域的内容跟随所述手势向下移动到设定距离阈值后停止移动。可选的,所述切换进入包含所述第一区本文档来自技高网...

【技术保护点】
1.一种界面显示处理方法,其特征在于,包括:/n检测当前界面的手势操作,所述当前界面预先划分为第一区域和第二区域;/n在所述手势操作符合预定手势时,切换进入包含所述第一区域的内容的新界面;/n所述手势操作为上滑手势;/n所述切换进入包含所述第一区域的内容的新界面包括:/n切换进入包含所述第一区域的内容及新加入的第三区域的内容的新界面;/n其中,所述切换进入包含所述第一区域的内容及新加入的第三区域的内容的新界面,包括:/n在所述手势操作为上滑手势时,所述第一区域的内容跟随所述手势向上移动,与在顶部位置显示的新加入的第三区域的内容形成新界面。/n

【技术特征摘要】
1.一种界面显示处理方法,其特征在于,包括:
检测当前界面的手势操作,所述当前界面预先划分为第一区域和第二区域;
在所述手势操作符合预定手势时,切换进入包含所述第一区域的内容的新界面;
所述手势操作为上滑手势;
所述切换进入包含所述第一区域的内容的新界面包括:
切换进入包含所述第一区域的内容及新加入的第三区域的内容的新界面;
其中,所述切换进入包含所述第一区域的内容及新加入的第三区域的内容的新界面,包括:
在所述手势操作为上滑手势时,所述第一区域的内容跟随所述手势向上移动,与在顶部位置显示的新加入的第三区域的内容形成新界面。


2.根据权利要求1所述的方法,其特征在于,所述第一区域跟随手势移动,所述第二区域不随手势移动。


3.根据权利要求2所述的方法,其特征在于,所述第一区域包含导航区域及内容区域或仅包含内容区域,其中,所述内容区域为信息流。


4.根据权利要求3所述的方法,其特征在于,所述信息流包含多个频道内容的集合,且在当前界面呈现至少一个频道内容的集合。


5.根据权利要求2所述的方法,其特征在于,所述新界面为信息流的首页。


6.根据权利要求2所述的方法,其特征在于,所述在所述手势操作符合预定手势时,切换进入包含所述第一区域的内容的新界面包括:
在所述手势操作符合预定手势且所述手势位于所述第一区域时,切换进入包含所述第一区域的内容的新界面。


7.根据权利要求2所述的方法,其特征在于,所述第三区域为信息流的标题栏区域。


8.根据权利要求2所述的方法,其特征在于,还包括:
当检测到所述上滑手势的移动距离大于或等于设定距离阈值,或所述上滑手势的移动速度大于或等于设定速度阈值时,所述第一区域的内容与在顶部位置显示的新加入的第三区域的内容拼接形成新界面。


9.根据权利要求2所述的方法,其特征在于,所述在顶部位置显示的新加入的第三区域的内容是在顶部位置自上而下、自左向右或自右向左滑入显示。


10.根据权利要求2所述的方法,其特征在于,所述在所述手势操作为上滑手势时,所述第一区域的内容跟随所述手势向上移动包括:
在所述手势操作为上滑手势时,将所述第一区域截图后的截图内容跟随所述手势向上移动。


11.根据权利要求10所述的方法,其特征在于,还包括:
在所述将所述第一区域截图后的截图内容跟随所述手势向上移动时,所述第二区域的内容显示蒙版效果并被所述第一区域的内容和所述第三区域的内容覆盖。


12.根据权利要求8所述的方法,其特征在于,在所述上滑手势的移动速度大于或等于设定速度阈值时,所述第一区域的内容与所述第三区域的内容拼接时显示反向回弹动画。


13.根据权利要求8所述的方法,其特征在于,在所述第一区域的内容与所述第三区域的内容拼接时,在连接的边缘区域显示逐渐淡入的外阴影。


14.根据权利要求1至13任一项所述的方法,其特征在于,所述切换进入包含所述第一区域的内容的新界面时还包括:
在新界面的工具栏区域中显示所述当前界面的工具栏的各个图标中的其中一个图标。


15.根据权利要求1至13任一项所述的方法,其特征在于:在检测到所进入的新界面的工具栏区域中的返回主页图标被触摸后,返回的主页中所述第一区域显示对应新界面显示频道的内容。


16.一种界面显示处理方法,其特征在于,包括:
检测当前界面的手势操作,所述当前界面预先划分为第一区域和第二区域;
在所述手势操作符合预定手势时,切换进入包含所述第一区域的内容的新界面;
所述手势操作为下拉手势;
所述切换进入包含所述第一区域的内容的新界面包括:
切换进入包含所述第一区域的内容及新加入的第三区域的内容的新界面;
其中,所述切换进入包含所述第一区域的内容及新加入的第三区域的内容的新界面,包括:
在所述手势操作为下拉手势时,所述第一区域的内容跟随所述手势向下移动,再反弹向上移动,与在顶部位置显示的新加入的第三区域的内容形成新界面。


17.根据权利要求16所述的方法,其特征在于,所述第一区域跟随手势移动,所述第二区域不随手势移动。


18.根据权利要求17所述的方法,其特征在于,所述方法还包括:
在所述第一区域的内容跟随所述手势向下移动同时进行后台刷新,将所述后台刷新后的内容与在顶部位置显示的新加入的第三区域的内容拼接形成新界面。


19.根据权利要求18所述的方法,其特征在于,所述第一区域包含导航区域及内容区域或仅包含内容区域,其中,所述内容区域为信息流。


20.根据权利要求19所述的方法,其特征在于,所述信息流包含多个频道内容的集合,且在当前界面呈现至少一个频道内容的集合。


21.根据权利要求18所述的方法,其特征在于,所述新界面为信息流的首页。


22.根据权利要求18所述的方法,其特征在于,所述在所述手势操作符合预定手势时,切换进入包含所述第一区域的内容的新界面包括:
在所述手势操作符合预定手势且所述手势位于所述第一区域时,切换进入包含所述第一区域的内容的新界面。


23.根据权利要求18所述的方法,其特征在于,所述切换进入包含所述第一区域的内容及新加入的第三区域的内容的新界面包括:
在所述手势操作为下拉手势时,切换进入包含所述第一区域后台刷新后的内容及新加入的第三区域的内容的新界面。


24.根据权利要求18所述的方法,其特征在于,所述第三区域为信息流的标题栏区域。


25.根据权利要求18所述的方法,其特征在于,还包括:
当检测到所述下拉手势释放后,所述第一区域的内容再反弹向上移动与在顶部位置显示的新加入的第三区域的内容拼接形成新界面。


26.根据权利要求18所述的方法,其特征在于,所述在顶部位置显示的新加入的第三区域的内容是在顶部位置自上而下、自左向右或自右向左滑入显示。


27.根据权利要求25所述的方法,其特征在于,在所述第一区域的内容与所述第三区域的内容拼接时,在连接的边缘区域显示逐渐淡入的外阴影。


28.根据权利要求18所述的方法,其特征在于,所述在所述手势操作为下拉手势时,所述第一区域的内容跟随所述手势向下移动同时进行后台刷新包括:
在所述手势操作为下拉手势时,所述第一区域的内容跟随所述手势向下移动,所述第二区域的内容逐渐消失并在所述第二区域的位置显示刷新提示,后台对第一区域的内容进行内容刷新。


29.根据权利要求28所述的方法,其特征在于,所述第二区域的内容逐渐消失包括:
将所述第二区域的下边缘向下进行拉伸变形,同时所述第二区域的内容逐渐消失。


30.根据权利要求29所述的方法,其特征在于,所述将所述第二区域的下边缘向下进行拉伸变形包括:
将所述第二区域的下边缘采用二次贝塞尔曲线方式向下进行拉伸变形。


31.根据权利要求18所述的方法,其特征在于,所述第一区域的内容跟随所述手势向下移动包括:
所述第一区域的内容跟随所述手势向下移动到设定距离阈值后停止移动。...

【专利技术属性】
技术研发人员:饶亮肖遥航
申请(专利权)人:阿里巴巴中国有限公司
类型:发明
国别省市:浙江;33

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

1