CN107066174A - 浮层显示方法、装置及用户终端 - Google Patents

浮层显示方法、装置及用户终端 Download PDF

Info

Publication number
CN107066174A
CN107066174A CN201710238559.1A CN201710238559A CN107066174A CN 107066174 A CN107066174 A CN 107066174A CN 201710238559 A CN201710238559 A CN 201710238559A CN 107066174 A CN107066174 A CN 107066174A
Authority
CN
China
Prior art keywords
floating layer
viewing area
application interface
floating
predetermined registration
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN201710238559.1A
Other languages
English (en)
Inventor
王兴龙
孙新杰
姜毅
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Alibaba China Co Ltd
Original Assignee
Guangzhou Shenma Mobile Information Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Guangzhou Shenma Mobile Information Technology Co Ltd filed Critical Guangzhou Shenma Mobile Information Technology Co Ltd
Priority to CN201710238559.1A priority Critical patent/CN107066174A/zh
Publication of CN107066174A publication Critical patent/CN107066174A/zh
Pending legal-status Critical Current

Links

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • G06F3/0483Interaction with page-structured environments, e.g. book metaphor
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0487Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser
    • G06F3/0488Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures

Abstract

本申请实施例提供的浮层显示方法、装置及用户终端包括:响应于浮层显示触发指令,将浮层浮显于所述应用界面的第一显示区域,所述第一显示区域小于所述应用界面的显示区域;当接收到作用于所述浮层的第一预设操作后,将所述浮层浮显于所述应用界面的第二显示区域,所述第二显示区域大于所述第一显示区域且小于或等于所述应用界面的显示区域。本申请实施例提供的浮层显示方法能够显示更多的页面内容,增加用户在应用程序的界面获取的信息量,有利于提高用户的用户体验。

Description

浮层显示方法、装置及用户终端
技术领域
本申请涉及计算机技术领域,具体而言,涉及一种浮层显示方法、装置及用户终端。
背景技术
随着互联网技术的发展,对终端中应用程序的各种功能要求也越来越高。如何提高应用程序的界面显示效果及用户体验也是业界普遍关心的问题。
现有的常见的界面显示方法包括:在应用程序的界面设置带有超链接的按钮供用户点击,用户点击按钮后,应用程序的界面中会显示或隐藏与按钮相对应的内容;或者,根据作用于应用程序界面的横向滑动操作,实现内容切换。但现有的界面显示方法往往只能在应用程序的界面显示一个页面的内容,使得用户获取的信息量较少。
发明内容
有鉴于此,本申请实施例提供了一种浮层显示方法、装置及用户终端,与现有的应用程序的界面显示方法相比,本申请实施例提供的浮层显示方法能够显示更多的页面内容,增加用户在应用程序的界面获取的信息量,有利于提高用户的用户体验。
为实现上述目的,本申请实施例提供了一种浮层显示方法,用于在应用界面上显示浮层,所述方法包括:响应于浮层显示触发指令,将浮层浮显于所述应用界面的第一显示区域,所述第一显示区域小于所述应用界面的显示区域;当接收到作用于所述浮层的第一预设操作后,将所述浮层浮显于所述应用界面的第二显示区域,所述第二显示区域大于所述第一显示区域且小于或等于所述应用界面的显示区域。
本申请实施例还提供了一种浮层显示装置,所述装置包括:浮层预览模块,用于响应于浮层显示触发指令,将浮层浮显于所述应用界面的第一显示区域,所述第一显示区域小于所述应用界面的显示区域;全屏浮层模块,用于当接收到作用于所述浮层的第一预设操作后,将所述浮层浮显于所述应用界面的第二显示区域,所述第二显示区域大于所述第一显示区域且小于或等于所述应用界面的显示区域。
本申请实施例还提供了一种用户终端,所述用户终端包括存储器和处理器,所述存储器耦接到所述处理器,所述存储器存储指令,当所述指令由所述处理器执行时,使所述处理器执行以下操作:响应于浮层显示触发指令,将浮层浮显于所述应用界面的第一显示区域,所述第一显示区域小于所述应用界面的显示区域;当接收到作用于所述浮层的第一预设操作后,将所述浮层浮显于所述应用界面的第二显示区域,所述第二显示区域大于所述第一显示区域且小于或等于所述应用界面的显示区域。
本申请实施例提供的浮层显示方法、装置及用户终端的有益效果为:
本申请实施例提供的浮层显示方法、装置及用户终端通过接收浮层显示触发指令,将浮层浮显在应用界面的第一显示区域,其中,第一显示区域小于应用界面的显示区域,当接收到作用于浮层的第一预设操作后,再将浮层浮显于应用界面的第二显示区域。第二显示区域大于第一显示区域,且小于或等于应用界面的显示区域,第二显示区域可以包括第一显示区域。当浮层浮显在第一显示区域时,由于第一显示区域未占据整个应用界面的显示区域,故用户可以同时看到浮层的内容以及浮层之下页面的未被浮层遮住的内容。当用户想查看更多浮层上的内容时,可以执行第一预设操作,使浮层浮显于应用界面的第二显示区域,增加了用户的阅读视野。本申请实施例提供的浮层显示方法能够显示更多的页面内容,增加用户在应用程序的界面获取的信息量,有利于提高用户的用户体验。
附图说明
为了更清楚的说明本申请实施例或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单的介绍,显而易见地,下面描述中的附图仅仅是本申请的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
图1是本申请实施例的应用环境示意图;
图2示出了本申请实施例提供的用户终端的结构框图;
图3示出了本申请第一实施例提供的浮层显示方法的流程图;
图4示出了本申请第一实施例的一种浮层显示结果页的示意图;
图5示出了本申请第一实施例的另一种浮层显示结果页的示意图;
图6示出了本申请第一实施例提供的浮层显示方法的一种具体实施方式的流程图;
图7示出了本申请第一实施例提供的浮层显示方法的另一种具体实施方式的流程图;
图8示出了本申请第一实施例提供的浮层显示方法的再一种具体实施方式的流程图;
图9示出了浮层显示于应用界面的一种具体实施方式的示意图;
图10示出了本申请第一实施例中浮层的顶端与应用界面的显示区域的顶端重合时的示意图;
图11示出了本申请第一实施例中显示第一提示信息的一种具体实施方式;
图12示出了本申请第一实施例中显示第二提示信息的一种具体实施方式;
图13示出了本申请第二实施例提供的浮层显示装置的结构框图;
图14示出了本申请第二实施例提供的浮层显示装置的一种具体实施方式的结构框图;
图15示出了本申请第二实施例提供的浮层显示装置的另一种具体实施方式的结构框图;
图16示出了图14中第一浮层关闭模块的具体结构框图。
具体实施方式
本申请下述各实施例均可应用于如图1所示的环境中。如图1所示,服务器10通过网络30与一个或多个用户终端20进行通信连接,以进行数据通信或交互。在本申请实施例中,用户终端20中安装有客户端,该客户端可以是应用程序(如搜索引擎、浏览器),与服务器10相对应,从而为用户提供服务(例如信息查询、内容浏览)。所述服务器10可以是数据库服务器、即时通信服务器、网络服务器、验证服务器等多个服务器,也可以是一个服务器。所述用户终端20可以是个人电脑(personal computer,PC)、平板电脑、智能手机、电子书阅读器、膝上型便携计算机、车载电脑、智能穿戴设备等。所述网络30可以是无线网络或有线网络,例如无线网络可以是,但不限于Wi-Fi(无线保真)网络、2G/3G/4G网络等。
图2示出了一种可应用于本申请实施例中的用户终端20的结构框图。如图2所示,所述用户终端20包括存储器202、存储控制器204,一个或多个(图中仅示出一个)处理器206、外设接口208、射频模块210、音频模块212、触控屏幕214等。这些组件通过一条或多条通讯总线/信号线216相互通讯。
存储器202可用于存储软件程序以及模块,如本发明实施例中的浮层显示方法及装置对应的程序指令/模块,处理器206通过运行存储在存储器202内的软件程序以及模块,从而执行各种功能应用以及数据处理,如本发明实施例提供的浮层显示方法。
存储器202可包括高速随机存储器,还可包括非易失性存储器,如一个或者多个磁性存储装置、闪存、或者其他非易失性固态存储器。处理器206以及其他可能的组件对存储器202的访问可在存储控制器204的控制下进行。
外设接口208将各种输入/输入装置耦合至处理器206以及存储器202。在一些实施例中,外设接口208,处理器206以及存储控制器204可以在单个芯片中实现。在其他一些实例中,他们可以分别由独立的芯片实现。
射频模块210用于接收以及发送电磁波,实现电磁波与电信号的相互转换,从而与通讯网络或者其他设备进行通讯。
音频模块212向用户提供音频接口,其可包括一个或多个麦克风、一个或者多个扬声器以及音频电路。
触控屏幕214在用户终端20与用户之间同时提供一个输出及输入界面。具体地,触控屏幕214向用户显示视频输出,这些视频输出的内容可包括文字、图形、视频及其任意组合。
可以理解,图2所示的结构仅为示意,用户终端20还可包括比图2中所示更多或者更少的组件,或者具有与图2所示不同的配置。图2中所示的各组件可以采用硬件、软件或其组合实现。
第一实施例
图3示出了本发明第一实施例提供的一种浮层显示方法的流程图,请参阅图3,本实施例描述的是用户终端的处理流程,所述方法包括:
步骤S110,响应于浮层显示触发指令,将浮层浮显于所述应用界面的第一显示区域,所述第一显示区域小于所述应用界面的显示区域。
于本发明实施例中,应用界面指的是客户端的应用界面。应用界面上可以有一个或多个内容链接,当内容链接为多个时,每个内容链接均可以有与内容链接对应的浮层。内容链接具体可以为带有超链接的文字或图片。当然,浮层也可以设置为对应于该应用界面或该应用界面上的某个区域或虚拟按钮,或者对应于某种操作手势。
于本发明实施例中,浮层是可堆叠于应用界面的一种交互(UI)控件。在客户端接收到浮层显示触发指令前,浮层是隐藏的。当客户端接收到浮层显示触发指令后,浮层会浮显于应用界面的预设位置,即第一显示区域。
例如,用户如果对多个内容链接中的某个内容链接感兴趣,在点击该内容链接后,会从应用界面的底部弹出一个浮层,例如可以从应用界面的底部向上滑动,并且会在应用界面呈现出滑动的动态效果,并滑动至第一显示区域的位置,以给用户提供一个预览界面。
在一种具体实施方式中,用户终端在接收到用户对多个内容链接中的一个内容链接的点击操作后,可以在网页的主体部分(body)中插入使用fixed语句定位的滑动浮层容器。同时,利用translateY将浮层移动至距离应用界面的顶部预定个像素(例如50个像素)的位置,即第一显示区域。其中,translateY用于表示在Y轴(垂直方向)移动相应元素的移动参数,在本申请中,元素是浮层。通过设置translateY可以使浮层位于应用界面的不同位置。
浮层显示触发指令是用于触发浮层显示的指令,浮层显示触发指令可以由用户点击应用界面的内容链接触发,还可以由用户的操作手势来触发。操作手势可以包括但不限于滑动、点击、或长按应用界面。进一步的,用户可以通过手指点击内容链接,或滑动、点击、长按应用界面,也可以用触控笔、鼠标等输入设备点击内容链接,或滑动、点击、长按应用界面。可以理解的是,具体的触发方式不应该理解为是对本申请的限定。不同的触发方式可以对应不同的浮层设置。例如,如果浮层显示触发指令由点击内容链接触发,则浮层可以设置为与内容链接对应。如果浮层显示触发指令由点击虚拟按钮触发,则浮层可以设置为与虚拟按钮对应。如果浮层显示触发指令由滑动应用界面触发,则浮层可以设置为与滑动操作手势对应,等等,这里不再一一列举。
客户端在接收到浮层显示触发指令后,将对应的浮层浮显在应用界面的第一显示区域。优选的,第一显示区域小于应用界面的显示区域。例如,如图4所示,第一显示区域可以位于应用界面的中下部位置,即图4中浮层所在的区域。当然,第一显示区域也可以位于应用界面的中上部、左部或右部。
另外,可以理解的是,第一显示区域所占应用界面整个显示区域的占比并不限于图4所示,可以根据不同客户端的需求设计不同的占比,例如,当对应浮层所显示的内容较少时,占比可以设计的比较小,当对应浮层所显示的内容较多时,占比可以设计的比较大,本申请的具体方案并不以此为限。
当浮层显示在第一显示区域时,用户可以看到浮层上所显示的内容,例如,如图4所示的内容1-内容9,也可以看到应用界面显示区域除第一显示区域以外的区域(也就是图4中的第一预设区域)的内容。
步骤S120,当接收到作用于所述浮层的第一预设操作后,将所述浮层浮显于所述应用界面的第二显示区域,所述第二显示区域大于所述第一显示区域且小于或等于所述应用界面的显示区域。
客户端在接收到作用于浮层的第一预设操作后,将浮层浮显于应用界面的第二显示区域,如参见图5,第二显示区域大于第一显示区域且小于或等于应用界面的整个显示区域。优选的,第二显示区域包括了整个第一显示区域。在一种具体实施方式中,当接收到作用于所述浮层的第一预设操作后,浮层显示的区域由应用界面的中下部改变为应用界面的整个显示区域。
例如,用户如果对显示在第一显示区域的浮层感兴趣,可以用手向上滑动该浮层,以使该浮层进入全屏模式,即在应用界面的整个显示区域显示。若用户在第一显示区域执行上滑操作,则设置浮层的移动参数translateY为translateY(0),浮层滑动到在应用界面的顶部。
第一预设操作具体可以包括滑动(例如上滑)、点击、或长按等手势操作,也可以为其他操作,如将用户终端向远离用户的方向挥动,第一预设操作的具体操作动作不应该理解为是对本申请的限制。
由于第二显示区域大于第一显示区域,因此,当客户端接收到第一预设操作时,浮层所显示的内容将会更多,如图5显示的内容1-内容12。
进一步的,请参照图6,在本实施例的一种具体实施方式中,在步骤S110之后还可以包括步骤S130,若接收到作用于所述浮层或接收到作用于第一预设区域的第二预设操作,关闭所述浮层。
第二预设操作包括滑动(例如下滑)、点击、双击等手势操作,也可以为其他操作,如将用户终端上下或前后来回挥动等,第二预设操作的具体操作动作不应该理解为是对本申请的限制,只要与第一预设操作进行区别即可。
下面以第二预设操作为点击操作或下滑操作为例进行说明,当浮层浮显于第一显示区域,也就是如图4所示的情况,点击操作具体可以作用于第一预设区域的任意区域,下滑操作具体可以作用于浮层的任意区域,即客户端在接收到作用于第一预设区域的点击操作或接收到作用于浮层的下滑操作后,关闭浮层。第一预设区域是应用界面的显示区域中,除第一显示区域以外的区域。当然,客户端也可以在接收到作用于浮层的点击操作后关闭浮层,例如,可以在用户点击浮层右上角的叉号时关闭浮层。
例如,在一种具体实施方式中,可以在浮层下滑超过预定预定个像素时,设置浮层的移动参数translateY为translateY(-100%),关闭浮层,若在下滑过程中,未超过预定个像素,则浮层恢复到原来的位置。
进一步的,请参照图7,在本实施例的另一种具体实施方式中,在步骤S120之后可以包括步骤S140,若接收到作用于所述浮层的第二预设操作,关闭所述浮层。
同样的,第二预设操作也可以包括滑动(例如下滑)、点击、双击等手势操作,也可以为其他操作,如将用户终端上下或前后来回挥动等,第二预设操作的具体操作动作不应该理解为是对本申请的限制,只要与第一预设操作进行区别即可。当浮层浮显于第二显示区域,也就是如图5所示的情况,点击操作具体可以作用于如图5所示的浮层的右上角的叉号,下滑操作具体可以作用于浮层的任意区域,即客户端在接收到作用于浮层的右上角的叉号的点击操作后,或接收到作用于浮层的任意区域的下滑操作,则关闭浮层,即设置移动参数translateY为translateY(-100%)。
进一步的,请参照图8,在本实施例的再一种具体实施方式中,在步骤S120之后还可以包括如下步骤:
步骤S151,若所述浮层的顶端与所述应用界面的显示区域的顶端重合时,接收作用于所述浮层的操作。
详情请参见图5,图5示出了浮层的顶端与应用界面的显示区域的顶端重合的情况。浮层的宽度可以与应用界面的显示区域的宽度相同,浮层的长度可以超过应用界面的显示区域的长度,即应用界面的显示区域不能完全显示整个浮层,客户端需要接收作用于浮层的上滑操作或下滑操作以上滑所述浮层或下滑所述浮层,从而实现浮层的不同区域在应用界面的显示区域的显示,即实现浮层的滚动显示。客户端可以接收作用于浮层的第三预设操作,并根据第三预设操作,滚动显示浮层,滚动显示具体可以通过iscroll组件实现。第三预设操作可以包括上滑操作,也可以包括下滑操作。
具体请参见图9,图9示出了浮层显示于应用界面的一种具体实施方式。图9示出的虚线框可以为应用界面的显示区域,图9示出的实线框为浮层,客户端接收到作用于浮层的上滑操作或下滑操作以上滑浮层或下滑浮层,从而实现浮层的滚动显示。浮层的顶端与应用界面的显示区域的顶端重合时如图10所示。
步骤S152,若作用于所述浮层的操作为下滑操作,将内容信息下滑。
浮层包括内容信息,且内容信息显示于浮层的浮显范围。请参见图4,当浮层浮显于第一显示区域时,内容信息也显示于浮层的浮显范围,即第一显示区域。请参见图5,当浮层浮显于第二显示区域时,内容信息也显示在浮层的浮显范围,即第二显示区域。
内容信息包括多个卡片版块以及多个内容版块,如图4和图5所示,卡片版块为切换组件,即多个卡片版块中的每个均对应相应的内容版块,切换组件具体可以为tab组件。内容版块可以为文字内容版块、图片内容版块等。内容信息下滑,可以是卡片版块的位置保持不变,内容版块向下移动,如图11所示;也可以是卡片版块与内容版块均向下移动。
具体地,图5中的卡片1、卡片2、卡片3以及卡片4可以分别对应“全部连衣裙”、“大码连衣裙”、“雪纺连衣裙”以及“真丝连衣裙”,则卡片1对应的多个内容版块为关于连衣裙的文字或图片,卡片2对应的多个内容版块为关于大码连衣裙的文字或图片,卡片3对应的多个内容版块为关于雪纺连衣裙的文字或图片,卡片4对应的多个内容版块为关于真丝连衣裙的文字或图片。当然,卡片1、卡片2、卡片3以及卡片4也可以对应其他的内容信息。多个卡片版块中的每个对应的内容信息以及多个内容版块的排版方式不应该理解为是对本申请的限制。
客户端在接收到作用于多个卡片版块中的一个内容信息的第四预设操作时,可以从服务器获取与该卡片版块对应的内容信息,并且将获得的内容信息通过内容版块的形式显示在浮层的预设区域。第四预设操作可以为点击操作,也可以为语音输入操作,具体操作形式不应该理解为是对本申请的限制。浮层的预设区域可以为浮层的浮显范围。
步骤S153,在由于所述内容信息下滑而在所述浮层形成的空白界面显示第一提示信息。
内容信息下滑后,会在浮层形成空白界面。客户端可以在空白界面显示第一提示信息。详情请参见图11,图11是显示第一提示信息的一种具体实施方式,浮层中的多个卡片版块的位置不变,多个内容版块的位置随着下滑操作而向下移动,从而在卡片版块与内容版块之间形成空白界面。第一提示信息可以为图11示出的“继续滑动关闭页面”信息,以提醒用户若继续进行下滑操作,则会关闭当前的浮层。
步骤S154,若所述内容信息的下滑距离超过第一阈值,取消显示所述第一提示信息,显示第二提示信息。
客户端判断内容信息的下滑距离是否超过第一阈值,若超过第一阈值,客户端取消第一提示信息的显示,并显示第二提示信息。详情请参见图12,图12是显示第二提示信息的一种具体实施方式,如图12所示,卡片版块与内容版块之间的间距超过图11示出的卡片版块与内容版块之间的间距且超过第一阈值时,客户端取消显示第一提示信息,显示第二提示信息。第二提示信息可以为如图12示出的“松开手指关闭页面”信息,以提醒用户在松开手指后,当前的浮层将会被关闭。第一阈值的具体数值不应该理解为是对本发明的限制。
具体地,第一阈值可以为50个像素,即若浮层的下滑距离超过50个像素,则提示“松开手指关闭页面”信息,并且在用户松开手指时,设置浮层的移动参数translateY为translateY(-100%),浮层关闭。
步骤S155,在不再接收到所述下滑操作时关闭所述浮层。
客户端若不再接收到下滑操作,则关闭当前浮层。例如用户松开执行下滑操作的手指时,客户端便不再接收到下滑操作,浮层被关闭。
客户端还可以接收上滑操作,并根据上滑操作滚动显示浮层,并且在滑动至浮层的底部时,客户端从服务器请求更多数据,以便继续在浮层进行数据展示。
本实施例提供的浮层显示方法能够先在应用界面的部分区域显示浮层,在接收到预设操作后,再在更大的区域显示浮层,能够实现同时显示浮层的内容以及浮层以下的页面中未被浮层遮住的内容,增加用户在应用程序的界面获取的信息量,提高用户体验。
第二实施例
本申请实施例还提供了一种浮层显示装置,详情请参见图13,该装置300包括:
浮层预览模块310,用于响应于浮层显示触发指令,将浮层浮显于所述应用界面的第一显示区域,所述第一显示区域小于所述应用界面的显示区域。
全屏浮层模块320,用于当接收到作用于所述浮层的第一预设操作后,将所述浮层浮显于所述应用界面的第二显示区域,所述第二显示区域大于所述第一显示区域且小于或等于所述应用界面的显示区域。
图13示出的浮层显示装置与图3示出的浮层显示方法相对应,在此便不做赘述。
详情请参见图14,本申请提供的浮层显示装置还可以包括:
第一浮层关闭模块330,用于若接收到作用于所述浮层或作用于第一预设区域的第二预设操作,关闭所述浮层。
第二预设操作包括滑动(例如下滑)、点击、双击等手势操作,也可以为其他操作,如将用户终端上下或前后来回挥动等,第二预设操作的具体操作动作不应该理解为是对本申请的限制,只要与第一预设操作进行区别即可。
详情请参见图15,本申请提供的浮层显示装置还可以包括:
第二浮层关闭模块340,用于若接收到作用于所述浮层的第二预设操作,关闭所述浮层。
同样的,第二预设操作也可以包括滑动(例如下滑)、点击、双击等手势操作,也可以为其他操作,如将用户终端上下或前后来回挥动等,第二预设操作的具体操作动作不应该理解为是对本申请的限制,只要与第一预设操作进行区别即可。当浮层浮显于第二显示区域,也就是如图5所示的情况,点击操作具体可以作用于如图5所示的浮层的右上角的叉号,下滑操作具体可以作用于浮层的任意区域,即客户端在接收到作用于浮层的右上角的叉号的点击操作后,或接收到作用于浮层的任意区域的下滑操作,则关闭浮层。
具体地,本申请提供的浮层显示装置还可以包括切换模块,用于若接收到作用于所述至少一个切换组件的第四预设操作,从服务器获取与该切换组件对应的信息,并将上述信息显示在所述浮层的预设区域。
详情请参见图4和图5,切换组件可以为卡片版块,即多个卡片版块中的每个均对应相应的内容版块。内容版块可以为文字内容版块、图片内容版块等。
客户端在接收到作用于多个卡片版块中的一个的第四预设操作时,可以从服务器获取与该卡片版块对应的内容信息,并且将获得的内容信息通过内容版块的形式显示在浮层的预设区域。第四预设操作可以为点击操作,也可以为语音输入操作,具体操作形式不应该理解为是对本申请的限制。浮层的预设区域可以为浮层的浮显范围。
详情请参见图16,第一浮层关闭模块330具体可以包括:
操作接收子模块331,用于若所述浮层的顶端与所述应用界面的显示区域的顶端重合时,接收作用于所述浮层的操作。
浮层处理子模块332,用于若作用于所述浮层的操作为下滑操作时,将所述内容信息下滑。
第一提示信息子模块333,用于在由于所述内容信息下滑而在浮层形成的空白界面显示第一提示信息。
第二提示信息子模块334,用于判断所述内容信息的下滑距离是否超过第一阈值,若是,取消显示所述第一提示信息,显示第二提示信息。
接收指令模块335,用于在不再接收到所述下滑操作时关闭所述浮层。
上述模块与图8示出的步骤S151至步骤S155相对应,在此便不做赘述。
本申请实施例提供的浮层显示方法、装置及用户终端通过接收浮层显示触发指令,将浮层浮显在应用界面的第一显示区域,其中,第一显示区域小于应用界面的显示区域,当接收到作用于浮层的第一预设操作后,再将浮层浮显于应用界面的第二显示区域。第二显示区域大于第一显示区域,且小于或等于应用界面的显示区域,第二显示区域可以包括第一显示区域。当浮层浮显在第一显示区域时,由于第一显示区域未占据整个应用界面的显示区域,故用户可以同时看到浮层的内容以及浮层之下页面的未被浮层遮住的内容。当用户想查看更多浮层上的内容时,可以执行第一预设操作,使浮层浮显于应用界面的第二显示区域,增加了用户的阅读视野。本申请实施例提供的浮层显示方法能够显示更多的页面内容,增加用户在应用程序的界面获取的信息量,有利于提高用户的用户体验。
需要说明的是,本说明书中的各个实施例均采用递进的方式描述,每个实施例重点说明的都是与其他实施例的不同之处,各个实施例之间相同相似的部分互相参见即可。对于装置类实施例而言,由于其与方法实施例基本相似,所以描述的比较简单,相关之处参见方法实施例的部分说明即可。
在本申请所提供的几个实施例中,应该理解到,所揭露的装置和方法,也可以通过其它的方式实现。以上所描述的装置实施例仅仅是示意性的,例如,附图中的流程图和框图显示了根据本发明的多个实施例的装置、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上,流程图或框图中的每个方框可以代表一个模块、程序段或代码的一部分,所述模块、程序段或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意,在有些作为替换的实现方式中,方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如,两个连续的方框实际上可以基本并行地执行,它们有时也可以按相反的顺序执行,这依所涉及的功能而定。也要注意的是,框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合,可以用执行规定的功能或动作的专用的基于硬件的系统来实现,或者可以用专用硬件与计算机指令的组合来实现。
另外,在本发明各个实施例中的各功能模块可以集成在一起形成一个独立的部分,也可以是各个模块单独存在,也可以两个或两个以上模块集成形成一个独立的部分。
所述功能如果以软件功能模块的形式实现并作为独立的产品销售或使用时,可以存储在一个计算机可读取存储介质中。基于这样的理解,本发明的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质中,包括若干指令用以使得一台计算机设备(可以是个人计算机,服务器,或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。而前述的存储介质包括:U盘、移动硬盘、只读存储器(ROM,Read-Only Memory)、随机存取存储器(RAM,Random Access Memory)、磁碟或者光盘等各种可以存储程序代码的介质。需要说明的是,在本文中,诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来,而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、方法、物品或者设备所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括所述要素的过程、方法、物品或者设备中还存在另外的相同要素。
以上所述仅为本发明的优选实施例而已,并不用于限制本发明,对于本领域的技术人员来说,本发明可以有各种更改和变化。凡在本发明的精神和原则之内,所作的任何修改、等同替换、改进等,均应包含在本发明的保护范围之内。应注意到:相似的标号和字母在下面的附图中表示类似项,因此,一旦某一项在一个附图中被定义,则在随后的附图中不需要对其进行进一步定义和解释。
以上所述,仅为本发明的具体实施方式,但本发明的保护范围并不局限于此,任何熟悉本技术领域的技术人员在本发明揭露的技术范围内,可轻易想到变化或替换,都应涵盖在本发明的保护范围之内。因此,本发明的保护范围应所述以权利要求的保护范围为准。

Claims (16)

1.一种浮层显示方法,其特征在于,用于在应用界面上显示浮层,所述方法包括:
响应于浮层显示触发指令,将浮层浮显于所述应用界面的第一显示区域,所述第一显示区域小于所述应用界面的显示区域;
当接收到作用于所述浮层的第一预设操作后,将所述浮层浮显于所述应用界面的第二显示区域,所述第二显示区域大于所述第一显示区域且小于或等于所述应用界面的显示区域。
2.根据权利要求1所述的方法,其特征在于,所述将所述浮层浮显于所述应用界面的第二显示区域之后,还包括:
若接收到作用于所述浮层的第二预设操作,关闭所述浮层。
3.根据权利要求1所述的方法,其特征在于,所述将浮层浮显于所述应用界面的第一显示区域之后,还包括:
若接收到作用于所述浮层或作用于第一预设区域的第二预设操作,关闭所述浮层。
4.根据权利要求2所述的方法,其特征在于,所述浮层包括内容信息,所述内容信息显示于所述浮层的浮显范围内,所述若接收到作用于所述浮层的第二预设操作,关闭所述浮层,包括:
若所述浮层的顶端与所述应用界面的显示区域的顶端重合时,接收作用于所述浮层的操作;
若作用于所述浮层的操作为所述第二预设操作,将所述内容信息下滑,并在不再接收到所述第二预设操作时关闭所述浮层。
5.根据权利要求4所述的方法,其特征在于,所述将所述内容信息下滑与所述并在不再接收到所述下滑操作时关闭所述浮层之间,包括:
在由于所述内容信息下滑而在所述浮层形成的空白界面显示第一提示信息;
判断所述内容信息的下滑距离是否超过第一阈值,若是,取消显示所述第一提示信息,显示第二提示信息。
6.根据权利要求2至5任意一项所述的方法,其特征在于,所述第二预设操作包括点击操作或下滑操作。
7.根据权利要求1所述的方法,其特征在于,所述将所述浮层浮显于所述应用界面的第二显示区域之后,还包括:
若接收到作用于所述浮层的第三预设操作,滚动显示所述浮层。
8.根据权利要求7所述的方法,其特征在于,所述第三预设操作包括上滑操作或下滑操作。
9.根据权利要求1所述的方法,其特征在于,所述浮层包括至少一个切换组件,所述方法还包括:
若接收到作用于所述至少一个切换组件的第四预设操作,从服务器获取与该切换组件对应的信息,并将上述信息显示在所述浮层的预设区域。
10.一种浮层显示装置,其特征在于,所述装置包括:
浮层预览模块,用于响应于浮层显示触发指令,将浮层浮显于所述应用界面的第一显示区域,所述第一显示区域小于所述应用界面的显示区域;
全屏浮层模块,用于当接收到作用于所述浮层的第一预设操作后,将所述浮层浮显于所述应用界面的第二显示区域,所述第二显示区域大于所述第一显示区域且小于或等于所述应用界面的显示区域。
11.根据权利要求10所述的装置,其特征在于,所述装置还包括:
第一浮层关闭模块,用于若接收到作用于所述浮层的第二预设操作,关闭所述浮层。
12.根据权利要求11所述的装置,其特征在于,所述第一浮层关闭模块还包括:
操作接收子模块,用于若所述浮层的顶端与所述应用界面的显示区域的顶端重合时,接收作用于所述浮层的操作;
浮层处理子模块,用于若作用于所述浮层的操作为第二预设操作,将所述内容信息下滑,并在不再接收到所述第二预设操作时关闭所述浮层。
13.根据权利要求12所述的装置,其特征在于,所述第一浮层关闭模块还包括:
第一提示信息子模块,用于在由于所述内容信息下滑而在浮层形成的空白界面显示第一提示信息;
第二提示信息子模块,用于判断所述内容信息的下滑距离是否超过第一阈值,若是,取消显示所述第一提示信息,显示第二提示信息。
14.根据权利要求10所述的装置,其特征在于,所述装置还包括:
浮层滚动模块,用于若接收到作用于所述浮层的第三预设操作,滚动显示所述浮层。
15.根据权利要求10所述的装置,其特征在于,所述浮层包括至少一个切换组件,所述装置还包括:
切换模块,用于若接收到作用于所述至少一个切换组件的第四预设操作,从服务器获取与该切换组件对应的信息,并将上述信息显示在所述浮层的预设区域。
16.一种用户终端,其特征在于,所述用户终端包括存储器和处理器,所述存储器耦接到所述处理器,所述存储器存储指令,当所述指令由所述处理器执行时,使所述处理器执行以下操作:
响应于浮层显示触发指令,将浮层浮显于所述应用界面的第一显示区域,所述第一显示区域小于所述应用界面的显示区域;
当接收到作用于所述浮层的第一预设操作后,将所述浮层浮显于所述应用界面的第二显示区域,所述第二显示区域大于所述第一显示区域且小于或等于所述应用界面的显示区域。
CN201710238559.1A 2017-04-13 2017-04-13 浮层显示方法、装置及用户终端 Pending CN107066174A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201710238559.1A CN107066174A (zh) 2017-04-13 2017-04-13 浮层显示方法、装置及用户终端

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201710238559.1A CN107066174A (zh) 2017-04-13 2017-04-13 浮层显示方法、装置及用户终端

Publications (1)

Publication Number Publication Date
CN107066174A true CN107066174A (zh) 2017-08-18

Family

ID=59599422

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201710238559.1A Pending CN107066174A (zh) 2017-04-13 2017-04-13 浮层显示方法、装置及用户终端

Country Status (1)

Country Link
CN (1) CN107066174A (zh)

Cited By (14)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN107688428A (zh) * 2017-08-31 2018-02-13 平安科技(深圳)有限公司 显示界面控制方法及服务器
CN108376173A (zh) * 2018-02-27 2018-08-07 北京金堤科技有限公司 企业门户页面的显示方法、装置和终端设备
CN109144364A (zh) * 2018-07-25 2019-01-04 上海携程商务有限公司 浮层解散的交互方法、系统、设备和存储介质
CN109375974A (zh) * 2018-09-26 2019-02-22 掌阅科技股份有限公司 书籍页面的展现方法、计算设备及计算机存储介质
CN110275741A (zh) * 2018-03-15 2019-09-24 阿里巴巴集团控股有限公司 内容显示方法及电子设备
CN110688047A (zh) * 2018-07-06 2020-01-14 北京豆网科技有限公司 用户终端和图形用户界面处理方法
CN110851521A (zh) * 2018-07-26 2020-02-28 阿里巴巴集团控股有限公司 数据可视化的方法、装置和存储介质
CN110955473A (zh) * 2018-09-26 2020-04-03 北京国双科技有限公司 显示加载提示信息的方法及装置
CN111240791A (zh) * 2020-01-22 2020-06-05 维沃移动通信有限公司 应用程序界面显示方法、电子设备和存储介质
CN111625589A (zh) * 2019-02-28 2020-09-04 阿里巴巴集团控股有限公司 信息显示方法及设备
CN111949900A (zh) * 2020-08-12 2020-11-17 北京百度网讯科技有限公司 显示方法、装置、设备以及存储介质
WO2021036871A1 (zh) * 2019-08-30 2021-03-04 Oppo广东移动通信有限公司 输入信息的方法、装置、终端及存储介质
WO2022262824A1 (zh) * 2021-06-16 2022-12-22 北京字节跳动网络技术有限公司 交互方法、装置、电子设备及计算机可读存储介质
WO2023025323A1 (zh) * 2021-08-27 2023-03-02 北京字跳网络技术有限公司 一种信息处理方法、装置、系统及存储介质

Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101390081A (zh) * 2005-04-07 2009-03-18 微软公司 用于在带有选项卡的浏览器内选择一选项卡的系统和方法
CN104965704A (zh) * 2015-06-17 2015-10-07 小米科技有限责任公司 信息显示方法及装置
CN105095564A (zh) * 2015-06-18 2015-11-25 刘成学 基于建筑信息模型的数据处理方法和装置
CN105739854A (zh) * 2016-01-21 2016-07-06 努比亚技术有限公司 交互信息处理方法及装置
CN106055195A (zh) * 2016-05-25 2016-10-26 维沃移动通信有限公司 一种文件夹的操作方法及移动终端
CN106302095A (zh) * 2015-06-04 2017-01-04 深圳市腾讯计算机系统有限公司 一种消息显示控制方法、装置及终端

Patent Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101390081A (zh) * 2005-04-07 2009-03-18 微软公司 用于在带有选项卡的浏览器内选择一选项卡的系统和方法
CN106302095A (zh) * 2015-06-04 2017-01-04 深圳市腾讯计算机系统有限公司 一种消息显示控制方法、装置及终端
CN104965704A (zh) * 2015-06-17 2015-10-07 小米科技有限责任公司 信息显示方法及装置
CN105095564A (zh) * 2015-06-18 2015-11-25 刘成学 基于建筑信息模型的数据处理方法和装置
CN105739854A (zh) * 2016-01-21 2016-07-06 努比亚技术有限公司 交互信息处理方法及装置
CN106055195A (zh) * 2016-05-25 2016-10-26 维沃移动通信有限公司 一种文件夹的操作方法及移动终端

Cited By (21)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN107688428B (zh) * 2017-08-31 2020-05-01 平安科技(深圳)有限公司 显示界面控制方法及服务器
CN107688428A (zh) * 2017-08-31 2018-02-13 平安科技(深圳)有限公司 显示界面控制方法及服务器
CN108376173A (zh) * 2018-02-27 2018-08-07 北京金堤科技有限公司 企业门户页面的显示方法、装置和终端设备
CN108376173B (zh) * 2018-02-27 2020-09-08 北京金堤科技有限公司 企业门户页面的显示方法、装置和终端设备
CN110275741B (zh) * 2018-03-15 2022-10-04 阿里巴巴集团控股有限公司 内容显示方法及电子设备
CN110275741A (zh) * 2018-03-15 2019-09-24 阿里巴巴集团控股有限公司 内容显示方法及电子设备
CN110688047A (zh) * 2018-07-06 2020-01-14 北京豆网科技有限公司 用户终端和图形用户界面处理方法
CN109144364A (zh) * 2018-07-25 2019-01-04 上海携程商务有限公司 浮层解散的交互方法、系统、设备和存储介质
CN110851521A (zh) * 2018-07-26 2020-02-28 阿里巴巴集团控股有限公司 数据可视化的方法、装置和存储介质
CN110851521B (zh) * 2018-07-26 2024-03-12 阿里巴巴集团控股有限公司 数据可视化的方法、装置和存储介质
CN109375974A (zh) * 2018-09-26 2019-02-22 掌阅科技股份有限公司 书籍页面的展现方法、计算设备及计算机存储介质
CN110955473B (zh) * 2018-09-26 2023-10-31 北京国双科技有限公司 显示加载提示信息的方法及装置
CN110955473A (zh) * 2018-09-26 2020-04-03 北京国双科技有限公司 显示加载提示信息的方法及装置
CN111625589A (zh) * 2019-02-28 2020-09-04 阿里巴巴集团控股有限公司 信息显示方法及设备
CN111625589B (zh) * 2019-02-28 2023-04-14 阿里巴巴集团控股有限公司 信息显示方法及设备
WO2021036871A1 (zh) * 2019-08-30 2021-03-04 Oppo广东移动通信有限公司 输入信息的方法、装置、终端及存储介质
CN112486370A (zh) * 2019-08-30 2021-03-12 Oppo广东移动通信有限公司 输入信息的方法、装置、终端及存储介质
CN111240791A (zh) * 2020-01-22 2020-06-05 维沃移动通信有限公司 应用程序界面显示方法、电子设备和存储介质
CN111949900A (zh) * 2020-08-12 2020-11-17 北京百度网讯科技有限公司 显示方法、装置、设备以及存储介质
WO2022262824A1 (zh) * 2021-06-16 2022-12-22 北京字节跳动网络技术有限公司 交互方法、装置、电子设备及计算机可读存储介质
WO2023025323A1 (zh) * 2021-08-27 2023-03-02 北京字跳网络技术有限公司 一种信息处理方法、装置、系统及存储介质

Similar Documents

Publication Publication Date Title
CN107066174A (zh) 浮层显示方法、装置及用户终端
US20240094872A1 (en) Navigating through documents in a document viewing application
US10228835B2 (en) Method for displaying information, and terminal equipment
CN104391636A (zh) 一种截屏方法及装置
CA3102222C (en) Method, device, terminal equipment and storage medium of sharing personal information
CN102314306A (zh) 人机界面呈现的方法及其手持装置
CN107357483A (zh) 数据分享方法及装置、计算机设备和计算机可读存储介质
CN104571877A (zh) 一种页面的显示处理方法及装置
CN102378958A (zh) 信息输入装置及信息输入方法
CN109062653B (zh) 长图文信息显示方法、计算机装置及计算机可读存储介质
CN105528167B (zh) 信息显示方法及装置
CN112988006A (zh) 显示方法、装置、电子设备和存储介质
CN106529567A (zh) 一种基于移动终端对图片过滤的方法和装置
CN105892851A (zh) 一种可视资源传输方法、装置及电子设备
CN109144392A (zh) 一种处理手势冲突的方法、装置及电子设备
CN105808307B (zh) 一种页面显示方法和装置
US9959010B1 (en) Method for displaying information, and terminal equipment
CN107180032A (zh) 评论内容显示方法及系统
CN105892794A (zh) 一种浏览器界面显示方法及装置
CN114443203A (zh) 一种信息显示方法及装置、电子设备和可读存储介质
CN113835585A (zh) 基于导航的应用界面切换方法、装置、设备及存储介质
CN109992580A (zh) 列表数据的处理方法及装置、存储介质、计算机设备
CN113325978A (zh) 消息显示方法、装置和电子设备
CN105988703A (zh) 一种业务对象的展示方法和装置
CN104462528A (zh) 基于移动终端的网页图片浏览方法及装置

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
TA01 Transfer of patent application right
TA01 Transfer of patent application right

Effective date of registration: 20200422

Address after: 310052 room 508, floor 5, building 4, No. 699, Wangshang Road, Changhe street, Binjiang District, Hangzhou City, Zhejiang Province

Applicant after: Alibaba (China) Co.,Ltd.

Address before: 510000 Guangdong city of Guangzhou province Whampoa Tianhe District Road No. 163 Xiping Yun Lu Yun Ping square B radio tower 12 layer 01 (the limit of unit self home office use)

Applicant before: GUANGZHOU SHENMA MOBILE INFORMATION TECHNOLOGY Co.,Ltd.

RJ01 Rejection of invention patent application after publication
RJ01 Rejection of invention patent application after publication

Application publication date: 20170818