CN106919323B - 界面显示方法及装置 - Google Patents

界面显示方法及装置 Download PDF

Info

Publication number
CN106919323B
CN106919323B CN201510984779.XA CN201510984779A CN106919323B CN 106919323 B CN106919323 B CN 106919323B CN 201510984779 A CN201510984779 A CN 201510984779A CN 106919323 B CN106919323 B CN 106919323B
Authority
CN
China
Prior art keywords
scroll
content
interface
path
interface content
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.)
Active
Application number
CN201510984779.XA
Other languages
English (en)
Other versions
CN106919323A (zh
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.)
Xiaomi Inc
Original Assignee
Xiaomi Inc
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 Xiaomi Inc filed Critical Xiaomi Inc
Priority to CN201510984779.XA priority Critical patent/CN106919323B/zh
Priority to PCT/CN2016/101295 priority patent/WO2017107617A1/zh
Priority to US15/362,829 priority patent/US20170185257A1/en
Priority to EP16203574.5A priority patent/EP3185114A1/en
Publication of CN106919323A publication Critical patent/CN106919323A/zh
Application granted granted Critical
Publication of CN106919323B publication Critical patent/CN106919323B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

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/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
    • G06F3/04883Interaction 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 for inputting data by handwriting, e.g. gesture or text
    • 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/0484Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/0485Scrolling or panning
    • 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/04815Interaction with a metaphor-based environment or interaction object displayed as three-dimensional, e.g. changing the user viewpoint with respect to the environment or object
    • 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/0482Interaction with lists of selectable items, e.g. menus
    • 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

界面显示方法及装置
技术领域
本公开涉及移动终端领域,特别涉及一种界面显示方法及装置。
背景技术
在移动终端所需显示的界面内容较多时,受移动终端屏幕尺寸的限制,界面内容往往不能在用户界面中全部显示。
相关技术中,用户可以通过滑动的方式,操作移动终端在用户界面中显示隐藏的界面内容。比如,移动终端接收到作用于用户界面中的向上滑动信号时,用户界面中的界面内容会相应的向上滑动。这样,之前隐藏在用户界面下方的界面内容会向上滑动,进而在用户界面中进行显示。
发明内容
为了解决相关技术中界面内容滑动至用户界面的边缘时,界面内容会突然消失,比较突兀的问题,本公开提供了一种界面显示方法及装置。所述技术方案如下:
根据本公开实施例的第一方面,提供了一种界面显示方法,所述方法包括:
接收作用于用户界面中的第一滑动信号;
根据所述第一滑动信号将所述用户界面中的界面内容进行平移显示;
当所述界面内容平移至位于边缘的卷动区域时,将所述界面内容在所述卷动区域中进行卷动显示,所述卷动显示是将所述界面内容沿三维空间中的卷动路径卷动收起时在所述卷动区域所在平面上的投影显示。
可选的,所述卷动路径是曲线路径或折线路径;
所述曲线路径包括:螺旋线路径、扇形路径、椭圆扇形路径、双曲线段路径和抛物线段路径中的任意一种;
所述折线路径为:由三维空间中的始点、终点及其余n个任意点,按预先设定的连接顺序连接所形成的折线路径,n为大于等于0的整数。
可选的,所述卷动区域是位于所述用户界面的卷动线和所述边缘之间的区域,所述卷动线是直线段、折线段和曲线段中的任意一种。
可选的,所述将所述界面内容在所述卷动区域中进行卷动显示,包括:
按照所述第一滑动信号的滑动速度显示沿着所述卷动路径卷动的所述界面内容;
或,
按照第一速度显示沿着所述卷动路径卷动的所述界面内容;所述第一速度与卷动距离在所述卷动区域所在平面上的投影距离成负相关关系,所述卷动距离为所述界面内容沿着所述卷动路径卷动的距离;
或,
按照第一预设初速度以及第一预设加速度显示沿着所述卷动路径匀减速卷动的所述界面内容。
可选的,所述方法,还包括:
在停止向所述卷动区域平移所述界面内容之后,将进入所述卷动区域的所述界面内容在所述卷动区域中进行反向卷动显示,所述反向卷动显示是将所述界面内容沿三维空间中的所述卷动路径反向卷出所述卷动区域时在所述卷动区域所在平面上的投影显示;
将所述用户界面中所述卷动区域之外的其他区域中的界面内容进行反向平移显示。
可选的,所述方法,还包括:
接收第二滑动信号,所述第二滑动信号的滑动方向与所述第一滑动信号的滑动方向相反;
在接收到所述第二滑动信号之后,执行所述将进入所述卷动区域的所述界面内容在所述卷动区域中进行反向卷动显示的步骤。
可选的,所述将进入所述卷动区域的所述界面内容在所述卷动区域中进行反向卷动显示,包括:
按照预设速度在所述卷动区域中显示沿着所述卷动路径反向卷出所述卷动区域的所述界面内容;
或,
按照第二预设初速度以及第二预设加速度显示沿着所述卷动路径反向匀加速卷出所述卷动区域的所述界面内容;
或,
按照第二速度显示沿着所述卷动路径反向卷出所述卷动区域的所述界面内容,所述第二速度根据预设三角函数的输出的变化而变化。
可选的,所述方法,还包括:
在所述第一滑动信号结束时,停止向所述卷动区域平移所述界面内容;
或者,
在所述界面内容中的预设内容移动至所述用户界面中的预设位置时,停止向所述卷动区域平移所述界面内容,所述预设内容为所述用户界面中所述第一滑动信号所对应的触发位置处的内容,或者,所述用户界面的界面内容中与所述卷动区域之间的距离最远的内容;
或者,
在所述界面内容按照减速滑动且滑动速度减为零时,停止向所述卷动区域平移所述界面内容。
可选的,所述方法,还包括:
在所述界面内容的移动过程中,若所述用户界面中与所述卷动区域相对的另一侧的边缘处出现空白区域,则在所述空白区域中填充显示预设填充内容。
根据本公开实施例的第二方面,提供了一种界面显示方法,所述方法包括:
接收作用于用户界面中的滑动信号;
根据所述滑动信号将所述用户界面中的界面内容进行平移显示;
当所述用户界面中隐藏显示的界面内容从屏幕外进入位于边缘的卷动区域时,将所述界面内容在所述卷动区域中进行卷动显示,所述卷动显示是将所述界面内容沿三维空间中的卷动路径卷动收起时在所述卷动区域所在平面上的投影显示。
可选的,所述卷动路径是曲线路径或折线路径;
所述曲线路径包括:螺旋线路径、扇形路径、椭圆扇形路径、双曲线段路径和抛物线段路径中的任意一种;
所述折线路径为:由三维空间中的始点、终点及其余n个任意点,按预先设定的连接顺序连接所形成的折线路径,n为大于等于0的整数。
可选的,所述卷动区域是位于所述用户界面的卷动线和所述边缘之间的区域,所述卷动线是直线段、折线段和曲线段中的任意一种。
可选的,所述将所述界面内容在所述卷动区域中进行卷动显示,包括:
按照所述滑动信号的滑动速度显示沿着所述卷动路径卷动的所述界面内容;
或,
按照目标速度显示沿着所述卷动路径卷动的所述界面内容;所述目标速度与卷动距离在所述卷动区域所在平面上的投影距离成负相关关系,所述卷动距离为所述界面内容沿着所述卷动路径卷动的距离;
或,
按照预设初速度以及预设加速度显示沿着所述卷动路径匀减速卷动的所述界面内容。
可选的,所述方法,还包括:
在所述滑动信号结束时,停止向所述卷动区域平移所述界面内容;
或者,
在所述界面内容中的预设内容移动至所述用户界面中的预设位置时,停止向所述卷动区域平移所述界面内容,所述预设内容为所述用户界面中所述滑动信号所对应的触发位置处的内容,或者,所述用户界面的界面内容中与所述卷动区域之间的距离最远的内容;
或者,
在所述界面内容按照减速滑动且滑动速度减为零时,停止向所述卷动区域平移所述界面内容。
根据本公开实施例的第三方面,提供了一种界面显示装置,所述装置包括:
第一接收模块,被配置为接收作用于用户界面中的第一滑动信号;
第一显示模块,被配置为根据所述第一接收模块接收到的所述第一滑动信号将所述用户界面中的界面内容进行平移显示;
第二显示模块,被配置为在所述界面内容平移至位于边缘的卷动区域时,将所述界面内容在所述卷动区域中进行卷动显示,所述卷动显示是将所述界面内容沿三维空间中的卷动路径卷动收起时在所述卷动区域所在平面上的投影显示。
可选的,所述卷动路径是曲线路径或折线路径;
所述曲线路径包括:螺旋线路径、扇形路径、椭圆扇形路径、双曲线段路径和抛物线段路径中的任意一种;
所述折线路径为:由三维空间中的始点、终点及其余n个任意点,按预先设定的连接顺序连接所形成的折线路径,n为大于等于0的整数。
可选的,所述卷动区域是位于所述用户界面的卷动线和所述边缘之间的区域,所述卷动线是直线段、折线段和曲线段中的任意一种。
可选的,所述第二显示模块,还被配置为:
按照所述第一滑动信号的滑动速度显示沿着所述卷动路径卷动的所述界面内容;
或,
按照第一速度显示沿着所述卷动路径卷动的所述界面内容;所述第一速度与卷动距离在所述卷动区域所在平面上的投影距离成负相关关系,所述卷动距离为所述界面内容沿着所述卷动路径卷动的距离;
或,
按照第一预设初速度以及第一预设加速度显示沿着所述卷动路径匀减速卷动的所述界面内容。
可选的,所述装置,还包括:
第三显示模块,被配置为在停止向所述卷动区域平移所述界面内容之后,将进入所述卷动区域的所述界面内容在所述卷动区域中进行反向卷动显示,所述反向卷动显示是将所述界面内容沿三维空间中的所述卷动路径反向卷出所述卷动区域时在所述卷动区域所在平面上的投影显示;
第四显示模块,被配置为将所述用户界面中所述卷动区域之外的其他区域中的界面内容进行反向平移显示。
可选的,所述装置,还包括:
第二接收模块,被配置为接收第二滑动信号,所述第二滑动信号的滑动方向与所述第一滑动信号的滑动方向相反;
所述第三显示模块,还被配置为在所述第二接收模块接收到所述第二滑动信号之后,执行所述将进入所述卷动区域的所述界面内容在所述卷动区域中进行反向卷动显示的步骤。
可选的,所述第三显示模块,还被配置为:
按照预设速度在所述卷动区域中显示沿着所述卷动路径反向卷出所述卷动区域的所述界面内容;
或,
按照第二预设初速度以及第二预设加速度显示沿着所述卷动路径反向匀加速卷出所述卷动区域的所述界面内容;
或,
按照第二速度显示沿着所述卷动路径反向卷出所述卷动区域的所述界面内容,所述第二速度根据预设三角函数的输出的变化而变化。
可选的,所述装置,还包括停止平移模块,所述停止平移模块被配置为:
在所述第一滑动信号结束时,停止向所述卷动区域平移所述界面内容;
或者,
在所述界面内容中的预设内容移动至所述用户界面中的预设位置时,停止向所述卷动区域平移所述界面内容,所述预设内容为所述用户界面中所述第一滑动信号所对应的触发位置处的内容,或者,所述用户界面的界面内容中与所述卷动区域之间的距离最远的内容;
或者,
在所述界面内容按照减速滑动且滑动速度减为零时,停止向所述卷动区域平移所述界面内容。
可选的,所述装置,还包括:
内容填充模块,还被配置为在所述界面内容的移动过程中,若所述用户界面中与所述卷动区域相对的另一侧的边缘处出现空白区域,则在所述空白区域中填充显示预设填充内容。
根据本公开实施例的第四方面,提供了一种界面显示装置,所述装置包括:
接收模块,被配置为接收作用于用户界面中的滑动信号;
第一显示模块,被配置为根据所述接收模块接收到的所述滑动信号将所述用户界面中的界面内容进行平移显示;
第二显示模块,被配置为在所述用户界面中隐藏显示的界面内容从屏幕外进入位于边缘的卷动区域时,将所述界面内容在所述卷动区域中进行卷动显示,所述卷动显示是将所述界面内容沿三维空间中的卷动路径卷动收起时在所述卷动区域所在平面上的投影显示。
可选的,所述卷动路径是曲线路径或折线路径;
所述曲线路径包括:螺旋线路径、扇形路径、椭圆扇形路径、双曲线段路径和抛物线段路径中的任意一种;
所述折线路径为:由三维空间中的始点、终点及其余n个任意点,按预先设定的连接顺序连接所形成的折线路径,n为大于等于0的整数。
可选的,所述卷动区域是位于所述用户界面的卷动线和所述边缘之间的区域,所述卷动线是直线段、折线段和曲线段中的任意一种。
可选的,所述第二显示模块,被配置为:
按照所述滑动信号的滑动速度显示沿着所述卷动路径卷动的所述界面内容;
或,
按照目标速度显示沿着所述卷动路径卷动的所述界面内容;所述目标速度与卷动距离在所述卷动区域所在平面上的投影距离成负相关关系,所述卷动距离为所述界面内容沿着所述卷动路径卷动的距离;
或,
按照预设初速度以及预设加速度显示沿着所述卷动路径匀减速卷动的所述界面内容。
可选的,所述装置,还包括:停止平移模块,所述停止平移模块,被配置为:
在所述滑动信号结束时,停止向所述卷动区域平移所述界面内容;
或者,
在所述界面内容中的预设内容移动至所述用户界面中的预设位置时,停止向所述卷动区域平移所述界面内容,所述预设内容为所述用户界面中所述滑动信号所对应的触发位置处的内容,或者,所述用户界面的界面内容中与所述卷动区域之间的距离最远的内容;
或者,
在所述界面内容按照减速滑动且滑动速度减为零时,停止向所述卷动区域平移所述界面内容。
根据本公开实施例的第五方面,提供了一种界面显示装置,所述装置包括:
处理器;
用于存储所述处理器可执行指令的存储器;
其中,所述处理器被配置为:
接收作用于用户界面中的第一滑动信号;
根据所述第一滑动信号将所述用户界面中的界面内容进行平移显示;
当所述界面内容平移至位于边缘的卷动区域时,将所述界面内容在所述卷动区域中进行卷动显示,所述卷动显示是将所述界面内容沿三维空间中的卷动路径卷动收起时在所述卷动区域所在平面上的投影显示。
本公开的实施例提供的技术方案可以包括以下有益效果:
通过在用户界面中的界面内容平移至位于边缘的卷动区域时,将界面内容在卷动区域中进行卷动显示。其中,卷动显示是将界面内容沿三维空间中的卷动路径卷动收起时在卷动区域所在平面上的投影显示。解决了相关技术中界面内容滑动至用户界面的边缘时,界面内容会突然消失比较突兀的问题;达到了界面内容可以在边缘处的卷动区域中卷动显示,进而平缓的在用户界面中消失或者平缓地进入用户界面,降低界面内容突然消失或者突然出现时带来的突兀感的效果。
应当理解的是,以上的一般描述和后文的细节描述仅是示例性的,并不能限制本公开。
附图说明
此处的附图被并入说明书中并构成本说明书的一部分,示出了符合本公开的实施例,并于说明书一起用于解释本公开的原理。
图1是根据部分示例性实施例示出的一种界面显示方法所涉及的卷动区域的示意图。
图2是根据一示例性实施例示出的一种界面显示方法的流程图。
图3A是根据另一示例性实施例示出的一种界面显示方法的流程图。
图3B是根据另一示例性实施例示出的移动终端展示用户界面的展示示意图。
图3C是根据另一示例性实施例示出的卷动路径的示意图。
图3D是根据另一示例性实施例示出的界面内容在卷动区域中卷动显示的示意图。
图3E是根据另一示例性实施例示出的卷动距离和投影距离的示意图。
图3F是根据另一示例性实施例示出的另一种界面显示方法的流程图。
图3G是根据另一示例性实施例示出的卷动区域中的界面内容卷出的示意图。
图3H是根据另一示例性实施例示出的在空白区域中填充预设填充内容的示意图。
图4是根据一示例性实施例示出的一种界面显示方法的流程图。
图5是根据另一示例性实施例示出的一种界面显示方法的流程图。
图6是根据一示例性实施例示出的一种界面显示装置的框图。
图7是根据另一示例性实施例示出的一种界面显示装置的框图。
图8是根据一示例性实施例示出的一种界面显示装置的框图。
图9是根据另一示例性实施例示出的一种界面显示装置的框图。
图10是根据一示例性实施例示出的一种界面显示装置的框图。
具体实施方式
这里将详细地对示例性实施例进行说明,其示例表示在附图中。下面的描述涉及附图时,除非另有表示,不同附图中的相同数字表示相同或相似的要素。以下示例性实施例中所描述的实施方式并不代表与本公开相一致的所有实施方式。相反,它们仅是与如所附权利要求书中所详述的、本公开的一些方面相一致的装置和方法的例子。
移动终端可以通过用户界面向用户展示界面内容。比如,在浏览器中,移动终端可以通过用户界面向用户展示网页内容。又比如,在电子书阅读软件中,移动终端可以通过用户界面向用户展示电子书中的内容。再比如,在社交应用程序中,移动终端可以通过用户界面向用户展示好友的新鲜事。实际实现时,该用户界面可以占据移动终端的整个屏幕,也可以占据移动终端的部分屏幕,本实施例对此并不做限定。
在本公开各个示例性实施例所提供的界面显示方法中,用户界面中可以包括位于边缘的至少一个卷动区域。比如,用户界面中可以包括位于用户界面中的上边缘、下边缘、左边缘和右边缘中的至少一个边缘的卷动区域。以用户界面中同时包括两个卷动区域为例,请参考图1,用户界面中可以包括位于下边缘的第一卷动区域11和位于上边缘的第二卷动区域12。
卷动区域是用户界面中位于卷动线和距离该卷动线最近的一侧的屏幕边缘之间的区域。卷动线可以为直线段、折线段和曲线段中的任意一种。比如,请参考图1,卷动线可以为图中所示的第一卷动区域11所对应的折线段状的卷动线13,也可以为图中所示的第二卷动区域12所对应的曲线段状的卷动线14。
可选地,本公开各个示例性实施例所述的卷动线可以是虚拟的并不显示的线,其只是用于划定卷动区域的边界。并且实际实现时,卷动线与屏幕边缘之间的距离可以小于预设阈值。比如,以卷动区域为图1中的第一卷动区域11来举例说明,卷动线13与屏幕边缘之间的距离可以小于屏幕长度的1/5。
图2是根据一示例性实施例示出的一种界面显示方法的流程图,如图2所示,该界面显示方法包括以下步骤。
在步骤201中,接收作用于用户界面中的第一滑动信号。
在步骤202中,根据第一滑动信号将用户界面中的界面内容进行平移显示。
在步骤203中,当界面内容平移至位于边缘的卷动区域时,将界面内容在卷动区域中进行卷动显示。
卷动显示是将界面内容沿三维空间中的卷动路径卷动收起时在卷动区域所在平面上的投影显示。
综上所述,本公开实施例中提供的界面显示方法,通过在用户界面中的界面内容平移至位于边缘的卷动区域时,将界面内容在卷动区域中进行卷动显示。其中,卷动显示是将界面内容沿三维空间中的卷动路径卷动收起时在卷动区域所在平面上的投影显示。解决了相关技术中界面内容滑动至用户界面的边缘时,界面内容会突然消失比较突兀的问题;达到了界面内容可以在边缘处的卷动区域中卷动显示,进而平缓的在用户界面中消失,降低界面内容突然消失时带来的突兀感的效果。
图3A是根据一示例性实施例示出的一种界面显示方法的流程图,如图3A所示,该界面显示方法包括以下步骤。
在步骤301中,显示用户界面。
比如,用户在移动终端中通过浏览器查看A省前两个季度中每个月的人均消费水平时,移动终端可以展示图3B所示的界面。
在步骤302中,接收作用于用户界面中的第一滑动信号。
第一滑动信号可以为向上滑动、向下滑动、向左滑动或者向右滑动的滑动信号。
比如,结合图3B,当用户想要查看用户界面中上侧隐藏显示的界面内容时,用户可以在用户界面中施加向下滑动的第一滑动信号,相应的,移动终端可以接收到向下滑动的第一滑动信号。其中,用户界面中隐藏显示的界面内容是指用户界面中在第一滑动信号的滑动方向的相反方向侧隐藏的内容。
在步骤303中,以第一滑动信号所对应的滑动速度向第一滑动信号的滑动方向平移显示界面内容。
平移显示是指界面内容向第一滑动信号的滑动方向侧平移并显示。
以第一滑动信号所对应的滑动速度,也即用户手指的滑动速度为vuser来举例说明,移动终端可以按照vuser向第一滑动信号的滑动方向平移显示界面内容。
需要说明的是,如果平移显示之前,受用户界面的界面尺寸的限制,用户界面中存在在第一滑动信号的滑动方向的相反方向侧隐藏显示的界面内容,则在平移显示的过程中,用户界面中在第一滑动信号的滑动方向的相反方向侧隐藏的界面内容会以平移的方式从屏幕外进入屏幕内,而用户界面中在第一滑动信号的滑动方向侧的界面内容会相应的移出屏幕。
在步骤304中,当界面内容平移至位于边缘的卷动区域时,按照第一滑动信号的滑动速度显示沿着卷动路径卷动的界面内容。
卷动区域是位于用户界面的卷动线和距离该卷动线最近的一侧的屏幕边缘之间的区域,卷动线是直线段、折线段和曲线段中的任意一种。
卷动路径是曲线路径或折线路径;曲线路径包括:螺旋线路径、扇形路径、椭圆扇形路径、双曲线段路径和抛物线段路径中的任意一种;折线路径为:由三维空间中的始点、终点及其余n个任意点,按预先设定的连接顺序连接所形成的折线路径,n为大于等于0的整数。
比如,请参考图3C中的(1)图、(2)图和(3)图(以卷动线为直线段举例),其分别示出了卷动路径为椭圆扇形路径31、抛物线段路径32和折线路径33的情况。扇形路径与椭圆扇形路径类似,不同的是,扇形路径中连接弧线两端的半径相同,而椭圆扇形中连接弧线两端的半径不同。
以卷动路径为椭圆扇形路径来举例说明,请参考图3D(图中以卷动线为直线段来示意说明),当界面内容平移至卷动区域之后,进入卷动区域34的界面内容在卷动区域34中进行卷动显示。卷动显示是进入卷动区域34的界面内容沿三维空间中的椭圆扇形路径卷动收起时在卷动区域34所在平面35上的投影显示。
其中,界面内容在卷动区域中卷动的速度为第一滑动信号的滑动速度,也即界面内容的滑动速度为vuser
在步骤305中,在第一滑动信号结束时,停止向卷动区域平移界面内容。
需要说明的一点是,步骤303只是以移动终端按照第一滑动信号的滑动速度平移显示界面内容来举例说明,可选的:
在一种可能的实现方式中,
步骤303可以替换为:按照第一速度平移显示界面内容;第一速度与卷动距离在卷动区域所在平面上的投影距离成负相关关系,卷动距离为界面内容沿着卷动路径卷动的距离。
请参考图3E,弧线段AB即为卷动距离,直线段CD为该卷动距离在卷动区域34所在平面35上的投影距离。
界面内容的平移速度可以随着界面内容平移距离的增大而减小,并在界面内容移动至预设位置时,速度降为零。可选的,第一速度vi可以为:
Figure BDA0000889383450000121
或者,
Figure BDA0000889383450000122
其中,vuser为第一滑动信号的滑动速度,duser为界面内容中的预设内容从接触卷动线开始到到达预设位置处结束时用户手指的滑动距离,di为t时刻进入卷动区域的界面内容在卷动区域所在平面上的投影距离。
预设内容为用户界面中第一滑动信号所对应的触发位置处的内容,或者,用户界面的界面内容中与卷动区域之间的距离最大的内容。预设位置可以为用户界面中的一个固定位置,如卷动线处;也可以为固定位置偏移目标长度之后的位置。以预设位置为后者来举例,预设位置可以为预设内容到达卷动线的位置后继续移动手指移动距离的预设倍数后所对应的位置。比如,手指移动距离为d,预设倍数为1/2,则预设位置即为达到卷动线的位置后继续移动1/2d后所对应的位置。
在步骤303替换为上述内容之后,步骤304可以相应的替换为:按照第一速度显示沿着卷动路径卷动的界面内容;第一速度与卷动距离在卷动区域所在平面上的投影距离成负相关关系,卷动距离为界面内容沿着卷动路径卷动的距离。
界面内容的卷动速度可以随着界面内容平移距离的增大而减小,并在界面内容中的预设内容移动至预设位置时,速度降为零。可选的,第一速度vi可以为:
Figure BDA0000889383450000131
或者,
Figure BDA0000889383450000132
其中,vuser为第一滑动信号的滑动速度,duser为界面内容中的预设内容从接触卷动线开始到到达预设位置处结束时用户手指的滑动距离,di为t时刻进入卷动区域的界面内容在卷动区域所在平面上的投影距离。
经过上述替换之后,步骤305可以相应的替换为:在界面内容中的预设内容移动至用户界面中的预设位置时,停止向卷动区域平移界面内容,预设内容为用户界面中第一滑动信号所对应的触发位置处的内容,或者,用户界面的界面内容中与卷动区域之间的距离最远的内容。
比如,以预设位置为预设内容到达卷动线的位置后继续移动手指移动距离的预设倍数后所对应的位置,且预设倍数为1/2来举例,则在预设内容移动至卷动线,且继续移动1/2d之后,停止向卷动区域平移界面内容。其中,d为用户施加第一滑动信号时手指移动的距离。
又比如,以预设内容为用户界面的界面内容中与卷动区域之间的距离最远的内容,且预设位置为卷动线来举例说明,在图3B所示的用户界面中,当用户界面最上侧隐藏的界面内容平移至卷动线时,停止向卷动区域中平移界面内容。
在另一种可能的实现方式中,
步骤303可以替换为:按照第一预设初速度以及第一预设加速度以匀减速平移显示界面内容。
界面内容的平移速度还可以为初始速度为第一预设初速度,且按照第一预设加速度匀减速的速度。以第一预设初速度为第一滑动信号的滑动速度vuser,第一预设加速度可以为a来举例,则平移速度vi为:
Figure BDA0000889383450000141
在步骤303替换为上述内容之后,步骤304可以替换为:按照第一预设初速度以及第一预设加速度显示沿着卷动路径均减速卷动的界面内容。
界面内容在卷动区域中的卷动速度还可以为初始速度为第一预设初速度,且按照第一预设加速度均减速的速度。以第一预设初速度为第一滑动信号的滑动速度vuser,第一预设加速度可以为a来举例,则卷动速度vi为:
Figure BDA0000889383450000142
经过上述替换之后,步骤305可以相应的替换为:在界面内容按照减速滑动且滑动速度减为零时,停止向卷动区域平移界面内容。
需要说明的另一点是,本实施例所说的卷动速度vi为界面内容沿着三维空间中的卷动路径卷动显示的速度,界面内容在卷动区域所在平面上的运动轨迹的速度vscreen为vi在卷动区域所在平面上的分量,也即为vscreen:vscreen=vi*cosθ。其中,θ为t时刻界面内容沿着三维空间中的卷动路径运动的速度方向与其在卷动区域所在平面上投影的夹角。比如,请参考图3E,其示出了vi、vscreen以及θ之间的关系。
综上所述,本公开实施例中提供的界面显示方法,通过在用户界面中的界面内容平移至位于边缘的卷动区域时,将界面内容在卷动区域中进行卷动显示。其中,卷动显示是将界面内容沿三维空间中的卷动路径卷动收起时在卷动区域所在平面上的投影显示。解决了相关技术中界面内容滑动至用户界面的边缘时,界面内容会突然消失比较突兀的问题;达到了界面内容可以在边缘处的卷动区域中卷动显示,进而平缓的在用户界面中消失,降低界面内容突然消失时带来的突兀感的效果。
需要补充说明的第一点是,在步骤305之后,移动终端可以保持用户界面中的界面内容静止。当然,移动终端还可以将进入卷动区域的界面内容反向卷出。比如,请参考图3F,该界面显示方法还可以包括如下步骤。
在步骤306中,在停止向卷动区域平移界面内容之后,将进入卷动区域的界面内容在卷动区域中进行反向卷动显示。
其中,反向卷动显示是将界面内容沿三维空间中的卷动路径反向卷出卷动区域时在卷动区域所在平面上的投影显示。反向卷动显示与卷动显示类似,只是界面内容的卷动方向相反,本实施例在此不再赘述。
可选的,作为一种可能的实现方式,在界面内容的移动过程中,如果用户界面中与卷动区域相对的另一侧的边缘处出现空白区域,则为了避免浪费用户界面的显示资源的问题,移动终端还可以将进入卷动区域的界面内容在卷动区域中进行反向卷动显示。并且,在空白区域中重新被填充有界面内容时,移动终端停止反向卷出;或者,在空白区域达到预设的停止点时,停止反向卷出。
作为另一种可能的实现方式,若用户想要重新查看进入卷动区域的界面内容,则用户可以施加第二滑动信号,相应的,移动终端可以接收该第二滑动信号。第二滑动信号的滑动方向与第一滑动信号的滑动方向相反。在接收到第二滑动信号之后,将进入卷动区域的界面内容在卷动区域中进行反向卷动显示。此时,当第二滑动信号结束时,停止反向卷出。
比如,请参考图3G,用户施加向上滑动的第二滑动信号之后,移动终端可以将卷动区域中的界面内容沿着卷动路径向上卷出该卷动区域。
在步骤307中,将用户界面中卷动区域之外的其他区域中的界面内容进行反向平移显示。
与步骤306类似,移动终端可以将用户界面中卷动区域之外的其他区域中的界面内容进行反向平移显示。
需要补充说明的是,将进入卷动区域的界面内容在卷动区域中进行反向卷动显示的步骤可以包括如下三种可能的实现方式:
第一种,按照预设速度在卷动区域中显示沿着卷动路径反向卷出卷动区域的界面内容。
第二种,按照第二预设初速度以及第二预设加速度显示沿着卷动路径反向匀加速卷出卷动区域的界面内容。
第二预设初速度可以为零,也可以为其它预设的数值,本实施例对此并不做限定。
以第二预设初速度为零来举例,移动终端反向卷出界面内容的卷出速度vi可以为:vi=a*t。其中,
Figure BDA0000889383450000161
d为界面内容到达卷动线之后移动的距离。
第三种,按照第二速度显示沿着卷动路径反向卷出卷动区域的界面内容,第二速度根据预设三角函数的输出的变化而变化。
预设三角函数可以为sin函数或者cos函数,且本实施例的速度取三角函数的输出的绝对值。
以预设三角函数为sin函数来举例说明,第二速度可以为:
Figure BDA0000889383450000162
其中,
Figure BDA0000889383450000163
ds为卷动线与第一滑动信号的滑动方向的相反方向的边缘之间的距离,w为预设的卷动速率。
本实施例只是以移动终端通过上述方式将进入卷动区域的界面内容反向卷出来举例说明,可选的,移动终端还可以通过其他方式来实现,本实施例对此并不做限定。
需要补充说明的第二点是,在界面内容的移动过程中,若用户界面中与卷动区域相对的另一侧出现空白区域,则移动终端可以在空白区域中填充显示预设填充内容。其中,预设填充内容可以包括颜色、花纹、文字、图片和推广信息中的至少一种。
比如,结合图3B,当用户界面中最上侧隐藏的界面内容进入用户界面,且界面内容继续移动时,用户界面的上侧的边缘处将会出现空白区域,此时,为了避免显示空白的问题,移动终端可以在该空白区域中填充显示预设填充内容。以填充内容为花纹来举例,移动终端可以在空白区域36中展示图3H所示的花纹。
可选的,随着界面内容的继续平移,空白区域会不断增大,移动终端可以通过预设填充内容不断的填充该空白区域,本实施例对此并不做限定。
通过在空白区域中填充显示预设填充内容,避免了用户界面中出现空白进而浪费用户界面的显示资源的问题。同时,商家可以通过在该空白区域中填充推广信息来向用户进行产品推广,丰富了商家的推广渠道。
需要补充说明的第三点是,在移动终端显示用户界面时,若用户界面中的部分界面内容已经位于卷动区域,则移动终端显示用户界面的步骤可以包括:
在卷动区域中,按照卷动路径显示位于卷动区域中的界面内容。并且,在卷动区域之外的其他区域,则以平铺方式展示位于该其他区域中的界面内容。本实施例对此并不做限定。
通过在用户界面的卷动区域中按照卷动路径显示其中的界面内容,避免了采用平铺方式显示时,后续在卷动区域中卷动显示时,界面内容会发生变形的问题,提高了用户的用户体验。
图4是根据一示例性实施例示出的一种界面显示方法的流程图,上述实施例是界面内容平移至卷动区域时,对卷动区域中的界面内容进行卷动显示,而与上述实施例不同的是,本实施例是以用户界面中隐藏显示的界面内容从屏幕外进入卷动区域时,将界面内容在卷动区域中进行卷动显示来举例说明。如图4所示,该界面显示方法包括以下步骤。
在步骤401中,接收作用于用户界面中的滑动信号。
在步骤402中,根据滑动信号将用户界面中的界面内容进行平移显示。
在步骤403中,当用户界面中隐藏显示的界面内容从屏幕外进入位于边缘的卷动区域时,将界面内容在卷动区域中进行卷动显示。
卷动显示是将界面内容沿三维空间中的卷动路径卷动收起时在卷动区域所在平面上的投影显示。
综上所述,本公开实施例中提供的界面显示方法,通过在用户界面中隐藏显示的界面内容从屏幕外进入位于边缘的卷动区域时,将界面内容在卷动区域中进行卷动显示;解决了相关技术中界面内容刚进入屏幕内时,界面显示比较突兀的问题;达到了界面内容可以在卷动区域中卷动显示,进而平缓地进入用户界面,降低界面内容突然进入用户界面时带来的突兀感的效果。
图5是根据一示例性实施例示出的一种界面显示方法的流程图,上述实施例是界面内容平移至卷动区域时,对卷动区域中的界面内容进行卷动显示,而与上述实施例不同的是,本实施例是以用户界面中隐藏显示的界面内容从屏幕外进入卷动区域时,将界面内容在卷动区域中进行卷动显示来举例说明。如图5所示,该界面显示方法包括以下步骤。
在步骤501中,显示用户界面。
在步骤502中,接收作用于用户界面中的滑动信号。
在步骤503中,以滑动信号所对应的滑动速度向滑动信号的滑动方向平移显示界面内容。
步骤501至步骤503与上述实施例中的步骤301至步骤303类似,本实施例在此不再赘述。
在步骤504中,当用户界面中隐藏显示的界面内容从屏幕外进入位于边缘的卷动区域时,按照滑动信号的滑动速度显示沿着卷动路径卷动的界面内容。
在用户界面中的界面内容进行平移显示时,用户界面中之前隐藏显示的界面内容可能会从屏幕外进入到位于边缘的卷动区域。其中,用户界面中隐藏显示的界面内容是指用户界面中在滑动信号的滑动方向的相反方向侧隐藏的内容。
比如,用户向下滑动时,用户界面中上侧隐藏显示的界面内容会进入到位于屏幕边缘的卷动区域。
移动终端可以将进入卷动区域的界面内容进行卷动显示。其实际显示方式与上述实施例中的步骤304的显示方式类似,本实施例在此不再赘述。
在步骤505中,在滑动信号结束时,停止向卷动区域平移界面内容。
需要说明的一点是,步骤503只是以移动终端按照滑动信号的滑动速度平移显示界面内容来举例说明,可选的:
在一种可能的实现方式中,
步骤503可以替换为:按照目标速度平移显示界面内容;目标速度与卷动距离在卷动区域所在平面上的投影距离成负相关关系,卷动距离为界面内容沿着卷动路径卷动的距离。
界面内容的平移速度可以随着界面内容平移距离的增大而减小,并在界面内容移动至预定预设位置时,速度降为零。可选的,目标速度vi可以为:
Figure BDA0000889383450000191
或者,
Figure BDA0000889383450000192
其中,vuser为滑动信号的滑动速度,duser为界面内容中的预设内容从接触卷动线开始到到达预设位置处结束时用户手指的滑动距离,di为t时刻进入卷动区域的界面内容在用户界面所在平面上的投影距离。
预设内容为用户界面中滑动信号所对应的触发位置处的内容,或者,用户界面的界面内容中与卷动区域之间的距离最大的内容。预设位置可以为用户界面中的一个固定位置,如卷动线处,也可以为固定位置偏移目标长度之后的位置。以预设位置为后者来举例,预设位置可以为预设内容到达卷动线的位置后继续移动手指移动距离的预设倍数后所对应的位置。
在步骤503替换为上述内容之后,步骤504可以相应的替换为:按照目标速度显示沿着卷动路径卷动的界面内容;目标速度与卷动距离在卷动区域所在平面上的投影距离成负相关关系,卷动距离为界面内容沿着卷动路径卷动的距离。
界面内容的卷动速度可以随着界面内容平移距离的增大而减小,并在界面内容中的预设内容移动至预设位置时,速度降为零。可选的,目标速度vi可以为:
Figure BDA0000889383450000193
或者,
Figure BDA0000889383450000194
其中,vuser为滑动信号的滑动速度,duser为界面内容中的预设内容从接触卷动线开始到到达预设位置处结束时用户手指的滑动距离,di为t时刻进入卷动区域的界面内容在卷动区域所在平面上的投影距离。
在经过上述替换之后,步骤505可以替换为:在界面内容中的预设内容移动至用户界面中的预设位置时,停止向卷动区域平移界面内容,预设内容为用户界面中滑动信号所对应的触发位置处的内容,或者,用户界面的界面内容中与卷动区域之间的距离最远的内容。
在另一种可能的实现方式中,
步骤503还可以替换为:按照预设初速度以及预设加速度以匀减速平移显示界面内容。
可选的,界面内容在卷动区域中的平移速度还可以为初始速度为预设初速度,且按照预设加速度匀减速的速度。
可选的,以预设初速度为滑动信号的滑动速度vuser,预设加速度可以为a来举例,则卷动速度vi为:
Figure BDA0000889383450000201
步骤503替换为上述内容之后,步骤504可以替换为:按照预设初速度以及预设加速度显示沿着卷动路径匀减速卷动的界面内容。
可选的,界面内容在卷动区域中的卷动速度还可以为初始速度为预设初速度,且按照预设加速度匀减速的速度。
可选的,以预设初速度为滑动信号的滑动速度vuser,预设加速度可以为a来举例,则卷动速度vi为:
Figure BDA0000889383450000202
经过上述替换之后,步骤505可以替换为:在界面内容按照减速滑动且滑动速度减为零时,停止向卷动区域平移界面内容。
需要说明的另一点是,本步骤所说的卷动速度vi为界面内容沿着三维空间中的卷动路径卷动显示的速度,界面内容在卷动区域所在平面上的运动轨迹的速度则为vi在卷动区域所在平面上的分量,也即为vscreen:vscreen=vi*cosθ。其中,θ为t时刻界面内容沿着三维空间中的卷动路径运动的速度方向与其在卷动区域所在平面上投影的夹角。
需要说明的再一点是,在移动终端显示用户界面时,若用户界面中的部分界面内容已经位于卷动区域,则移动终端显示用户界面的步骤可以包括:
在卷动区域中,按照卷动路径显示位于卷动区域中的界面内容。并且,在卷动区域之外的其他区域,则以平铺方式展示位于该其他区域中的界面内容。本实施例对此并不做限定。
通过在用户界面的卷动区域中按照卷动路径显示其中的界面内容,避免了采用平铺方式显示时,后续在卷动区域中卷动显示时,界面内容会发生变形的问题,提高了用户的用户体验。
综上所述,本公开实施例中提供的界面显示方法,通过在用户界面中隐藏显示的界面内容从屏幕外进入位于边缘的卷动区域时,将界面内容在卷动区域中进行卷动显示;解决了相关技术中界面内容刚进入屏幕内时,界面显示比较突兀的问题;达到了界面内容可以在卷动区域中卷动显示,进而平缓地进入用户界面,降低界面内容突然进入用户界面时带来的突兀感的效果。
下述为本公开装置实施例,可以用于执行本公开方法实施例。对于本公开装置实施例中未披露的细节,请参照本公开方法实施例。
图6是根据一示例性实施例示出的一种界面显示装置的框图,该界面显示装置可以通过软件、硬件或者两者的结合实现成为移动终端的全部或者一部分,如图6所示,该界面显示装置包括但不限于:第一接收模块610、第一显示模块620和第二显示模块630。
第一接收模块610,被配置为接收作用于用户界面中的第一滑动信号。
第一显示模块620,被配置为根据第一接收模块610接收到的第一滑动信号将用户界面中的界面内容进行平移显示。
第二显示模块630,被配置为在界面内容平移至位于边缘的卷动区域时,将界面内容在卷动区域中进行卷动显示。
卷动显示是将界面内容沿三维空间中的卷动路径卷动收起时在卷动区域所在平面上的投影显示。
综上所述,本公开实施例中提供的界面显示装置,通过在用户界面中的界面内容平移至位于边缘的卷动区域时,将界面内容在卷动区域中进行卷动显示。其中,卷动显示是将界面内容沿三维空间中的卷动路径卷动收起时在卷动区域所在平面上的投影显示。解决了相关技术中界面内容滑动至用户界面的边缘时,界面内容会突然消失比较突兀的问题;达到了界面内容可以在边缘处的卷动区域中卷动显示,进而平缓的在用户界面中消失,降低界面内容突然消失时带来的突兀感的效果。
图7是根据一示例性实施例示出的一种界面显示装置的框图,该界面显示装置可以通过软件、硬件或者两者的结合实现成为移动终端的全部或者一部分,如图7所示,该界面显示装置包括但不限于:第一接收模块710、第一显示模块720和第二显示模块730。
第一接收模块710,被配置为接收作用于用户界面中的第一滑动信号。
第一滑动信号可以为向上滑动、向下滑动、向左滑动或者向右滑动的滑动信号。
第一显示模块720,被配置为根据第一接收模块710接收到的第一滑动信号将用户界面中的界面内容进行平移显示。
在第一接收模块710接收到第一滑动信号之后,第一显示模块720按照第一滑动信号的滑动方向平移显示用户界面中的界面内容。
第二显示模块730,被配置为在界面内容平移至位于边缘的卷动区域时,将界面内容在卷动区域中进行卷动显示。
卷动显示是将界面内容沿三维空间中的卷动路径卷动收起时在卷动区域所在平面上的投影显示。
在第一显示模块720按照第一滑动信号的滑动方向平移显示用户界面中的界面内容时,在界面内容平移至卷动线处时,第二显示模块730可以将进入卷动线之后也即进入卷动区域的界面内容在卷动区域中进行卷动显示。
可选的,卷动区域是位于用户界面的卷动线和边缘之间的区域,卷动线是直线段、折线段和曲线段中的任意一种。
并且,卷动路径是曲线路径或折线路径;曲线路径包括:螺旋线路径、扇形路径、椭圆扇形路径、双曲线段路径和抛物线段路径中的任意一种;折线路径为:由三维空间中的始点、终点及其余n个任意点,按预先设定的连接顺序连接所形成的折线路径,n为大于等于0的整数。
可选的,第二显示模块730将界面内容在卷动区域中卷动显示可以包括如下三种可能的实现方式:
第一种,按照第一滑动信号的滑动速度显示沿着卷动路径卷动的界面内容。
以第一滑动信号所对应的滑动速度,也即用户的手指滑动速度为vuser来举例说明,第二显示模块730可以按照vuser显示沿着卷动路径卷动的界面内容。
第二种,按照第一速度显示沿着卷动路径卷动的界面内容;第一速度与卷动距离在卷动区域所在平面上的投影距离成负相关关系,卷动距离为界面内容沿着卷动路径卷动的距离。
界面内容的卷动速度可以随着界面内容平移距离的增大而减小,并在界面内容中的预设内容移动至预设位置时,速度降为零。可选的,第一速度vi可以为:
Figure BDA0000889383450000231
或者,
Figure BDA0000889383450000232
其中,vuser为第一滑动信号的滑动速度,duser为界面内容中的预设内容从接触卷动线开始到到达预设位置处结束时用户手指的滑动距离,di为t时刻进入卷动区域的界面内容在卷动区域所在平面上的投影距离。
预设内容为用户界面中第一滑动信号所对应的触发位置处的内容,或者,用户界面的界面内容中与卷动区域之间的距离最大的内容。预设位置可以为用户界面中的一个固定位置,如卷动线处,也可以为固定位置偏移目标长度之后的位置。以预设位置为后者来举例,预设位置可以为预设内容到达卷动线的位置后继续移动手指移动距离的预设倍数后所对应的位置。
第三种,按照第一预设初速度以及第一预设加速度显示沿着卷动路径匀减速卷动的界面内容。
可选的,界面内容在卷动区域中的卷动速度还可以为初始速度为第一预设初速度,且按照第一预设加速度匀减速的速度。
可选的,以第一预设初速度为第一滑动信号的滑动速度vuser,第一预设加速度可以为a来举例,则卷动速度vi为:
Figure BDA0000889383450000233
本实施例所说的卷动速度vi为界面内容沿着三维空间中的卷动路径卷动显示的速度,界面内容在卷动区域所在平面上的运动轨迹的速度则为vi在卷动区域所在平面上的分量,也即为vscreen:vscreen=vi*cosθ。其中,θ为t时刻界面内容沿着三维空间中的卷动路径运动的速度方向与其在卷动区域所在平面上投影的夹角。
需要补充说明的一点是,第一显示模块720平移显示界面内容的平移速度与上述第二显示模块730卷动显示的速度类似,也即第一显示模块720也可以包括以下三种可能的实现方式:
第一种,第一显示模块720以第一滑动信号的滑动速度向第一滑动信号的滑动方向平移显示界面内容。
以第一滑动信号所对应的滑动速度,也即用户的手指滑动速度为vuser来举例说明,第一显示模块720可以按照vuser向第一滑动信号的滑动方向平移显示界面内容。
第二种,按照第一速度平移显示界面内容;第一速度与卷动距离在卷动区域所在平面上的投影距离成负相关关系,卷动距离为界面内容沿着卷动路径卷动的距离。
界面内容的平移速度可以随着界面内容平移距离的增大而减小,并在界面内容移动至预设位置时,速度降为零。可选的,第一速度vi可以为:
Figure BDA0000889383450000241
或者,
Figure BDA0000889383450000242
其中,vuser为第一滑动信号的滑动速度,duser为界面内容中的预设内容从接触卷动线开始到到达预设位置处结束时用户手指的滑动距离,di为t时刻进入卷动区域的界面内容在用户界面所在平面上的投影距离。
第三种,按照第一预设初速度以及第一预设加速度以匀减速平移显示界面内容。
可选的,界面内容在卷动区域中的平移速度还可以为初始速度为第一预设初速度,且按照第一预设加速度匀减速的速度。
可选的,以第一预设初速度为第一滑动信号的滑动速度vuser,第一预设加速度可以为a来举例,则卷动速度vi为:
Figure BDA0000889383450000243
可选的,该装置还包括:第三显示模块740和第四显示模块750。
第三显示模块740,被配置为在停止向卷动区域平移界面内容之后,将进入卷动区域的界面内容在卷动区域中进行反向卷动显示。
其中,反向卷动显示是将界面内容沿三维空间中的卷动路径反向卷出卷动区域时在卷动区域所在平面上的投影显示。
可选的,作为一种可能的实现方式,在界面内容的移动过程中,如果用户界面中与卷动区域相对的一侧的边缘处出现空白区域,则为了避免浪费用户界面的显示资源的问题,第三显示模块740还可以将进入卷动区域的界面内容在卷动区域中进行反向卷动显示。此时,在空白区域中重新被填充有界面内容时,停止反向卷出;或者,在空白区域达到预设的停止点时,停止反向卷出。
第四显示模块750,被配置为将用户界面中卷动区域之外的其他区域中的界面内容进行反向平移显示。
与第三显示模块740类似,第四显示模块750可以将用户界面中卷动区域之外的其他区域中的界面内容进行反向平移显示。
可选的,该装置还包括:第二接收模块760。
第二接收模块760,被配置为接收第二滑动信号,第二滑动信号的滑动方向与第一滑动信号的滑动方向相反。
作为一种可能的实现方式,若用户想要查看进入卷动区域的界面内容,则用户可以施加第二滑动信号,相应的,第二接收模块760可以接收该第二滑动信号。第二滑动信号的滑动方向与第一滑动信号的滑动方向相反。在接收到第二滑动信号之后,第三显示模块740将进入卷动区域的界面内容在卷动区域中进行反向卷动显示。
可选的,第三显示模块740进行反向卷动显示可以包括如下三种可能的实现方式:
第一种,按照预设速度在卷动区域中显示沿着卷动路径反向卷出卷动区域的界面内容。
第二种,按照第二预设初速度以及第二预设加速度显示沿着卷动路径反向匀加速卷出卷动区域的界面内容。
第二预设初速度可以为零,也可以为其它预设的数值,本实施例对此并不做限定。
以第二预设初速度为零来举例,第三显示模块740反向卷出界面内容的卷出速度vi可以为:vi=a*t。其中,
Figure BDA0000889383450000251
d为界面内容到达卷动线之后移动的距离。
第三种,按照第二速度显示沿着卷动路径反向卷出卷动区域的界面内容,第二速度根据预设三角函数的输出的变化而变化。
预设三角函数可以为sin函数或者cos函数,且第二速度为预设三角函数的输出的绝对值。以预设三角函数为sin函数来举例,第二速度可以为:
Figure BDA0000889383450000261
其中,
Figure BDA0000889383450000262
ds为卷动线与第一滑动信号的滑动方向的相反方向的边缘之间的距离,w为预设的卷动速率。
本实施例只是以第三显示模块740通过上述几种方式将进入卷动区域的界面内容反向卷出来举例说明,可选的,第三显示模块740还可以通过其他方式来实现,本实施例对此并不做限定。
可选的,该装置还包括:停止平移模块770。
停止平移模块770,被配置为:
在第一滑动信号结束时,停止向卷动区域平移界面内容;
或者,
在界面内容中的预设内容移动至用户界面中的预设位置时,停止向卷动区域平移界面内容,预设内容为用户界面中第一滑动信号所对应的触发位置处的内容,或者,用户界面的界面内容中与卷动区域之间的距离最远的内容
或者,
在界面内容按照减速滑动且滑动速度减为零时,停止向卷动区域平移界面内容。
需要说明的是,上述停止平移模块770的三种可能的实现方式依次对应于第二显示模块730的三种可能的实现方式。
可选的,该装置还包括:内容填充模块780。
内容填充模块780,被配置为在界面内容的移动过程中,若用户界面中与卷动区域相对的另一侧的边缘处出现空白区域,则在空白区域中填充显示预设填充内容。
其中,预设填充内容可以包括颜色、花纹、文字、图片和推广信息中的至少一种。
可选的,随着界面内容的继续平移,空白区域会不断增大,相应的,内容填充模块780可以通过预设填充内容不断的填充该空白区域,本实施例对此并不做限定。
需要补充说明的一点是,在界面显示装置显示用户界面时,若用户界面中的部分界面内容已经位于卷动区域,则界面显示装置显示用户界面可以包括:
在卷动区域中,按照卷动路径显示位于卷动区域中的界面内容。并且,在卷动区域之外的其他区域,则以平铺方式展示位于该其他区域中的界面内容。本实施例对此并不做限定。
综上所述,本公开实施例中提供的界面显示装置,通过在用户界面中的界面内容平移至位于边缘的卷动区域时,将界面内容在卷动区域中进行卷动显示。其中,卷动显示是将界面内容沿三维空间中的卷动路径卷动收起时在卷动区域所在平面上的投影显示。解决了相关技术中界面内容滑动至用户界面的边缘时,界面内容会突然消失比较突兀的问题;达到了界面内容可以在边缘处的卷动区域中卷动显示,进而平缓的在用户界面中消失,降低界面内容突然消失时带来的突兀感的效果。
通过在空白区域中填充显示预设填充内容,避免了用户界面中出现空白进而浪费用户界面的显示资源的问题。同时,商家可以通过在该空白区域中填充推广信息来向用户进行产品推广,丰富了商家的推广渠道。
通过在用户界面的卷动区域中按照卷动路径显示其中的界面内容,避免了采用平铺方式显示时,后续在卷动区域中卷动显示时,界面内容会发生变形的问题,提高了用户的用户体验。
图8是根据一示例性实施例示出的一种界面显示装置的框图,该界面显示装置可以通过软件、硬件或者两者的结合实现成为移动终端的全部或者一部分,如图8所示,该界面显示装置包括但不限于:接收模块810、第一显示模块820和第二显示模块830。
接收模块810,被配置为接收作用于用户界面中的滑动信号。
第一显示模块820,被配置为根据接收模块810接收到的滑动信号将用户界面中的界面内容进行平移显示。
第二显示模块830,被配置为在用户界面中隐藏显示的界面内容从屏幕外进入位于边缘的卷动区域时,将界面内容在卷动区域中进行卷动显示。
卷动显示是将界面内容沿三维空间中的卷动路径卷动收起时在卷动区域所在平面上的投影显示。
综上所述,本公开实施例中提供的界面显示装置,通过在用户界面中隐藏显示的界面内容从屏幕外进入位于边缘的卷动区域时,将界面内容在卷动区域中进行卷动显示;解决了相关技术中界面内容刚进入屏幕内时,界面显示比较突兀的问题;达到了界面内容可以在卷动区域中卷动显示,进而平缓的进入用户界面,降低界面内容突然进入用户界面时带来的突兀感的效果。
图9是根据一示例性实施例示出的一种界面显示装置的框图,该界面显示装置可以通过软件、硬件或者两者的结合实现成为移动终端的全部或者一部分,如图9所示,该界面显示装置包括但不限于:接收模块910、第一显示模块920和第二显示模块930。
接收模块910,被配置为接收作用于用户界面中的滑动信号。
第一显示模块920,被配置为根据接收模块910接收到的滑动信号将用户界面中的界面内容进行平移显示。
第一显示模块920的实现方法与上述实施例中的第一显示模块720的实现方法类似,本实施例在此不再赘述。
第二显示模块930,被配置为在用户界面中隐藏显示的界面内容从屏幕外进入位于边缘的卷动区域时,将界面内容在卷动区域中进行卷动显示。
卷动显示是将界面内容沿三维空间中的卷动路径卷动收起时在卷动区域所在平面上的投影显示。
可选的,卷动区域是位于用户界面的卷动线和边缘之间的区域,卷动线是直线段、折线段和曲线段中的任意一种。
并且,卷动路径是曲线路径或折线路径;曲线路径包括:螺旋线路径、扇形路径、椭圆扇形路径、双曲线段路径和抛物线段路径中的任意一种;折线路径为:由三维空间中的始点、终点及其余n个任意点,按预先设定的连接顺序连接所形成的折线路径,n为大于等于0的整数。
可选的,第二显示模块930将界面内容在卷动区域中卷动显示可以包括如下三种可能的实现方式:
第一种,按照滑动信号的滑动速度显示沿着卷动路径卷动的界面内容。
以滑动信号所对应的滑动速度,也即用户的手指滑动速度为vuser来举例说明,第二显示模块930可以按照vuser显示沿着卷动路径卷动的界面内容。
第二种,按照目标速度显示沿着卷动路径卷动的界面内容;目标速度与卷动距离在卷动区域所在平面上的投影距离成负相关关系,卷动距离为界面内容沿着卷动路径卷动的距离。
界面内容的卷动速度可以随着界面内容平移距离的增大而减小,并在界面内容中的预设内容移动至预设位置时,速度降为零。可选的,目标速度vi可以为:
Figure BDA0000889383450000291
或者,
Figure BDA0000889383450000292
其中,vuser为滑动信号的滑动速度,duser为界面内容中的预设内容从接触卷动线开始到到达预设位置处结束时用户手指的滑动距离,di为t时刻进入卷动区域的界面内容在卷动区域所在平面上的投影距离。
预设内容为用户界面中滑动信号所对应的触发位置处的内容,或者,用户界面的界面内容中与卷动区域之间的距离最大的内容。预设位置可以为用户界面中的一个固定位置,如卷动线处,也可以为固定位置偏移目标长度之后的位置。以预设位置为后者来举例,预设位置可以为预设内容到达卷动线的位置后继续移动手指移动距离的预设倍数后所对应的位置。
第三种,按照预设初速度以及预设加速度显示沿着卷动路径匀减速卷动的界面内容。
可选的,界面内容在卷动区域中的卷动速度还可以为初始速度为预设初速度,且按照预设加速度匀减速的速度。
可选的,以预设初速度为滑动信号的滑动速度vuser,预设加速度可以为a来举例,则卷动速度vi为:
vi=vuser-a*t (t≤vuser/a)。
本实施例所说的卷动速度vi为界面内容沿着三维空间中的卷动路径卷动显示的速度,界面内容在卷动区域所在平面上的运动轨迹的速度则为vi在卷动区域所在平面上的分量,也即为vscreen:vscreen=vi*cosθ。其中,θ为t时刻界面内容沿着三维空间中的卷动路径运动的速度方向与其在卷动区域所在平面上投影的夹角。
需要补充说明的一点是,第一显示模块920平移显示界面内容的平移速度与第二显示模块930卷动显示的速度类似,也即第一显示模块920可以包括如下三种可能的实现方式:
第一种,第一显示模块920以滑动信号的滑动速度向滑动信号的滑动方向平移显示界面内容。
以滑动信号所对应的滑动速度,也即用户的手指滑动速度为vuser来举例说明,第一显示模块920可以按照vuser向滑动信号的滑动方向平移显示界面内容。
第二种,按照目标速度平移显示界面内容;目标速度与卷动距离在卷动区域所在平面上的投影距离成负相关关系,卷动距离为界面内容沿着卷动路径卷动的距离。
界面内容的平移速度可以随着界面内容平移距离的增大而减小,并在界面内容移动至预定预设位置时,速度降为零。可选的,目标速度vi可以为:
Figure BDA0000889383450000301
或者,
Figure BDA0000889383450000302
其中,vuser为滑动信号的滑动速度,duser为界面内容中的预设内容从接触卷动线开始到到达预设位置处结束时用户手指的滑动距离,di为t时刻进入卷动区域的界面内容在用户界面所在平面上的投影距离。
第三种,按照预设初速度以及预设加速度以匀减速平移显示界面内容。
可选的,界面内容在卷动区域中的平移速度还可以为初始速度为预设初速度,且按照预设加速度匀减速的速度。
可选的,以预设初速度为滑动信号的滑动速度vuser,预设加速度可以为a来举例,则卷动速度vi为:
Figure BDA0000889383450000303
关于上述实施例中的装置,其中各个模块执行操作的具体方式已经在有关该方法的实施例中进行了详细描述,此处将不做详细阐述说明。
可选的,该装置还包括:停止平移模块940。
停止平移模块940,被配置为:
在滑动信号结束时,停止向卷动区域平移界面内容;
或者,
在界面内容中的预设内容移动至用户界面中的预设位置时,停止向卷动区域平移界面内容,预设内容为用户界面中滑动信号所对应的触发位置处的内容,或者,用户界面的界面内容中与卷动区域之间的距离最远的内容;
或者,
在界面内容按照减速滑动且滑动速度减为零时,停止向卷动区域平移界面内容。
停止平移模块940的实现方法与上述停止平移模块770类似,本实施例在此不再赘述。
需要补充说明的是,在界面显示装置显示用户界面时,若用户界面中的部分界面内容已经位于卷动区域,则界面显示装置显示用户界面的步骤可以包括:
在卷动区域中,按照卷动路径显示位于卷动区域中的界面内容。并且,在卷动区域之外的其他区域,则以平铺方式展示位于该其他区域中的界面内容。本实施例对此并不做限定。
综上所述,本公开实施例中提供的界面显示装置,通过在用户界面中隐藏显示的界面内容从屏幕外进入位于边缘的卷动区域时,将界面内容在卷动区域中进行卷动显示;解决了相关技术中界面内容刚进入屏幕内时,界面显示比较突兀的问题;达到了界面内容可以在卷动区域中卷动显示,进而平缓的进入用户界面,降低界面内容突然进入用户界面时带来的突兀感的效果。
通过在用户界面的卷动区域中按照卷动路径显示其中的界面内容,避免了采用平铺方式显示时,后续在卷动区域中卷动显示时,界面内容会发生变形的问题,提高了用户的用户体验。
本公开一示例性实施例提供了一种界面显示装置,能够实现本公开提供的界面显示方法,该界面显示装置包括:处理器、用于存储处理器可执行指令的存储器;
其中,处理器被配置为:
接收作用于用户界面中的第一滑动信号;
根据第一滑动信号将用户界面中的界面内容进行平移显示;
当界面内容平移至位于边缘的卷动区域时,将界面内容在卷动区域中进行卷动显示,卷动显示是将界面内容沿三维空间中的卷动路径卷动收起时在卷动区域所在平面上的投影显示。
图10是根据一示例性实施例示出的一种界面显示装置的框图。例如,装置1000可以是移动电话,计算机,数字广播终端,消息收发设备,游戏控制台,平板设备,医疗设备,健身设备,个人数字助理等。
参照图10,装置1000可以包括以下一个或多个组件:处理组件1002,存储器1004,电源组件1006,多媒体组件1008,音频组件1010,输入/输出(I/O)接口1012,传感器组件1014,以及通信组件1016。
处理组件1002通常控制装置1000的整体操作,诸如与显示,电话呼叫,数据通信,相机操作和记录操作相关联的操作。处理组件1002可以包括一个或多个处理器1018来执行指令,以完成上述的方法的全部或部分步骤。此外,处理组件1002可以包括一个或多个模块,便于处理组件1002和其他组件之间的交互。例如,处理组件1002可以包括多媒体模块,以方便多媒体组件1008和处理组件1002之间的交互。
存储器1004被配置为存储各种类型的数据以支持在装置1000的操作。这些数据的示例包括用于在装置1000上操作的任何应用程序或方法的指令,联系人数据,电话簿数据,消息,图片,视频等。存储器1004可以由任何类型的易失性或非易失性存储设备或者它们的组合实现,如静态随机存取存储器(SRAM),电可擦除可编程只读存储器(EEPROM),可擦除可编程只读存储器(EPROM),可编程只读存储器(PROM),只读存储器(ROM),磁存储器,快闪存储器,磁盘或光盘。
电源组件1006为装置1000的各种组件提供电力。电源组件1006可以包括电源管理系统,一个或多个电源,及其他与为装置1000生成、管理和分配电力相关联的组件。
多媒体组件1008包括在装置1000和用户之间的提供一个输出接口的屏幕。在一些实施例中,屏幕可以包括液晶显示器(LCD)和触摸面板(TP)。如果屏幕包括触摸面板,屏幕可以被实现为触摸屏,以接收来自用户的输入信号。触摸面板包括一个或多个触摸传感器以感测触摸、滑动和触摸面板上的手势。触摸传感器可以不仅感测触摸或滑动动作的边界,而且还检测与触摸或滑动操作相关的持续时间和压力。在一些实施例中,多媒体组件1008包括一个前置摄像头和/或后置摄像头。当装置1000处于操作模式,如拍摄模式或视频模式时,前置摄像头和/或后置摄像头可以接收外部的多媒体数据。每个前置摄像头和后置摄像头可以是一个固定的光学透镜系统或具有焦距和光学变焦能力。
音频组件1010被配置为输出和/或输入音频信号。例如,音频组件1010包括一个麦克风(MIC),当装置1000处于操作模式,如呼叫模式、记录模式和语音识别模式时,麦克风被配置为接收外部音频信号。所接收的音频信号可以被进一步存储在存储器1004或经由通信组件1016发送。在一些实施例中,音频组件1010还包括一个扬声器,用于输出音频信号。
I/O接口1012为处理组件1002和外围接口模块之间提供接口,上述外围接口模块可以是键盘,点击轮,按钮等。这些按钮可包括但不限于:主页按钮、音量按钮、启动按钮和锁定按钮。
传感器组件1014包括一个或多个传感器,用于为装置1000提供各个方面的状态评估。例如,传感器组件1014可以检测到装置1000的打开/关闭状态,组件的相对定位,例如组件为装置1000的显示器和小键盘,传感器组件1014还可以检测装置1000或装置1000一个组件的位置改变,用户与装置1000接触的存在或不存在,装置1000方位或加速/减速和装置1000的温度变化。传感器组件1014可以包括接近传感器,被配置用来在没有任何的物理接触时检测附近物体的存在。传感器组件1014还可以包括光传感器,如CMOS或CCD图像传感器,用于在成像应用中使用。在一些实施例中,该传感器组件614还可以包括加速度传感器,陀螺仪传感器,磁传感器,压力传感器或温度传感器。
通信组件1016被配置为便于装置1000和其他设备之间有线或无线方式的通信。装置1000可以接入基于通信标准的无线网络,如Wi-Fi,2G或3G,或它们的组合。在一个示例性实施例中,通信组件1016经由广播信道接收来自外部广播管理系统的广播信号或广播相关信息。在一个示例性实施例中,通信组件1016还包括近场通信(NFC)模块,以促进短程通信。例如,在NFC模块可基于射频识别(RFID)技术,红外数据协会(IrDA)技术,超宽带(UWB)技术,蓝牙(BT)技术和其他技术来实现。
在示例性实施例中,装置1000可以被一个或多个应用专用集成电路(ASIC)、数字信号处理器(DSP)、数字信号处理设备(DSPD)、可编程逻辑器件(PLD)、现场可编程门阵列(FPGA)、控制器、微控制器、微处理器或其他电子元件实现,用于执行上述界面显示方法。
在示例性实施例中,还提供了一种包括指令的非临时性计算机可读存储介质,例如包括指令的存储器1004,上述指令可由装置1000的处理器1018执行以完成上述界面显示方法。例如,非临时性计算机可读存储介质可以是ROM、随机存取存储器(RAM)、CD-ROM、磁带、软盘和光数据存储设备等。
本领域技术人员在考虑说明书及实践这里公开的发明后,将容易想到本公开的其它实施方案。本申请旨在涵盖本公开的任何变型、用途或者适应性变化,这些变型、用途或者适应性变化遵循本公开的一般性原理并包括本公开未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的,本公开的真正范围和精神由下面的权利要求指出。
应当理解的是,本公开并不局限于上面已经描述并在附图中示出的精确结构,并且可以在不脱离其范围进行各种修改和改变。本公开的范围仅由所附的权利要求来限制。

Claims (28)

1.一种界面显示方法,其特征在于,所述方法包括:
接收作用于用户界面中的第一滑动信号;
根据所述第一滑动信号将所述用户界面中的界面内容进行平移显示;
当所述界面内容平移至位于边缘的卷动区域时,将所述界面内容中平移至所述卷动区域内的内容进行卷动显示,其中,平移至所述卷动区域内的内容与尚未平移至所述卷动区域内的内容相互连接,所述卷动显示是将所述界面内容沿三维空间中的卷动路径卷动收起时在所述卷动区域所在平面上的投影显示;
在停止向所述卷动区域平移所述界面内容之后,将进入所述卷动区域的所述界面内容在所述卷动区域中进行反向卷动显示,所述反向卷动显示是将所述界面内容沿所述三维空间中的所述卷动路径反向卷出所述卷动区域时在所述卷动区域所在平面上的投影显示;
将所述用户界面中所述卷动区域之外的其他区域中的界面内容进行反向平移显示。
2.根据权利要求1所述的方法,其特征在于,所述卷动路径是曲线路径或折线路径;
所述曲线路径包括:螺旋线路径、扇形路径、椭圆扇形路径、双曲线段路径和抛物线段路径中的任意一种;
所述折线路径为:由三维空间中的始点、终点及其余n个任意点,按预先设定的连接顺序连接所形成的折线路径,n为大于等于0的整数。
3.根据权利要求1所述的方法,其特征在于,所述卷动区域是位于所述用户界面的卷动线和所述边缘之间的区域,所述卷动线是直线段、折线段和曲线段中的任意一种。
4.根据权利要求1所述的方法,其特征在于,所述将所述界面内容中平移至所述卷动区域内的内容进行卷动显示,包括:
按照所述第一滑动信号的滑动速度显示沿着所述卷动路径卷动的所述界面内容;
或,
按照第一速度显示沿着所述卷动路径卷动的所述界面内容;所述第一速度与卷动距离在所述卷动区域所在平面上的投影距离成负相关关系,所述卷动距离为所述界面内容沿着所述卷动路径卷动的距离;
或,
按照第一预设初速度以及第一预设加速度显示沿着所述卷动路径匀减速卷动的所述界面内容。
5.根据权利要求1所述的方法,其特征在于,所述方法,还包括:
接收第二滑动信号,所述第二滑动信号的滑动方向与所述第一滑动信号的滑动方向相反;
在接收到所述第二滑动信号之后,执行所述将进入所述卷动区域的所述界面内容在所述卷动区域中进行反向卷动显示的步骤。
6.根据权利要求1或5所述的方法,其特征在于,所述将进入所述卷动区域的所述界面内容在所述卷动区域中进行反向卷动显示,包括:
按照预设速度在所述卷动区域中显示沿着所述卷动路径反向卷出所述卷动区域的所述界面内容;
或,
按照第二预设初速度以及第二预设加速度显示沿着所述卷动路径反向匀加速卷出所述卷动区域的所述界面内容;
或,
按照第二速度显示沿着所述卷动路径反向卷出所述卷动区域的所述界面内容,所述第二速度根据预设三角函数的输出的变化而变化。
7.根据权利要求1至5任一所述的方法,其特征在于,所述方法,还包括:
在所述第一滑动信号结束时,停止向所述卷动区域平移所述界面内容;
或者,
在所述界面内容中的预设内容移动至所述用户界面中的预设位置时,停止向所述卷动区域平移所述界面内容,所述预设内容为所述用户界面中所述第一滑动信号所对应的触发位置处的内容,或者,所述用户界面的界面内容中与所述卷动区域之间的距离最远的内容;
或者,
在所述界面内容按照减速滑动且滑动速度减为零时,停止向所述卷动区域平移所述界面内容。
8.根据权利要求1至5任一所述的方法,其特征在于,所述方法,还包括:
在所述界面内容的移动过程中,若所述用户界面中与所述卷动区域相对的另一侧的边缘处出现空白区域,则在所述空白区域中填充显示预设填充内容。
9.一种界面显示方法,其特征在于,所述方法包括:
接收作用于用户界面中的滑动信号;
根据所述滑动信号将所述用户界面中的界面内容进行平移显示;
当所述用户界面中隐藏显示的界面内容从屏幕外进入位于边缘的卷动区域时,将所述用户界面中隐藏显示的界面内容在所述卷动区域中进行卷动显示,其中,平移至所述卷动区域内的内容与尚未平移至所述卷动区域内的内容相互连接,所述卷动显示是将所述界面内容沿三维空间中的卷动路径卷动收起时在所述卷动区域所在平面上的投影显示。
10.根据权利要求9所述的方法,其特征在于,所述卷动路径是曲线路径或折线路径;
所述曲线路径包括:螺旋线路径、扇形路径、椭圆扇形路径、双曲线段路径和抛物线段路径中的任意一种;
所述折线路径为:由三维空间中的始点、终点及其余n个任意点,按预先设定的连接顺序连接所形成的折线路径,n为大于等于0的整数。
11.根据权利要求9所述的方法,其特征在于,所述卷动区域是位于所述用户界面的卷动线和所述边缘之间的区域,所述卷动线是直线段、折线段和曲线段中的任意一种。
12.根据权利要求9所述的方法,其特征在于,所述将所述界面内容在所述卷动区域中进行卷动显示,包括:
按照所述滑动信号的滑动速度显示沿着所述卷动路径卷动的所述界面内容;
或,
按照目标速度显示沿着所述卷动路径卷动的所述界面内容;所述目标速度与卷动距离在所述卷动区域所在平面上的投影距离成负相关关系,所述卷动距离为所述界面内容沿着所述卷动路径卷动的距离;
或,
按照预设初速度以及预设加速度显示沿着所述卷动路径匀减速卷动的所述界面内容。
13.根据权利要求9至12任一所述的方法,其特征在于,所述方法,还包括:
在所述滑动信号结束时,停止向所述卷动区域平移所述界面内容;
或者,
在所述界面内容中的预设内容移动至所述用户界面中的预设位置时,停止向所述卷动区域平移所述界面内容,所述预设内容为所述用户界面中所述滑动信号所对应的触发位置处的内容,或者,所述用户界面的界面内容中与所述卷动区域之间的距离最远的内容;
或者,
在所述界面内容按照减速滑动且滑动速度减为零时,停止向所述卷动区域平移所述界面内容。
14.一种界面显示装置,其特征在于,所述装置包括:
第一接收模块,被配置为接收作用于用户界面中的第一滑动信号;
第一显示模块,被配置为根据所述第一接收模块接收到的所述第一滑动信号将所述用户界面中的界面内容进行平移显示;
第二显示模块,被配置为在所述界面内容平移至位于边缘的卷动区域时,将所述界面内容中平移至所述卷动区域内的内容进行卷动显示,其中,平移至所述卷动区域内的内容与尚未平移至所述卷动区域内的内容相互连接,所述卷动显示是将所述界面内容沿三维空间中的卷动路径卷动收起时在所述卷动区域所在平面上的投影显示;
第三显示模块,被配置为在停止向所述卷动区域平移所述界面内容之后,将进入所述卷动区域的所述界面内容在所述卷动区域中进行反向卷动显示,所述反向卷动显示是将所述界面内容沿所述三维空间中的所述卷动路径反向卷出所述卷动区域时在所述卷动区域所在平面上的投影显示;
第四显示模块,被配置为将所述用户界面中所述卷动区域之外的其他区域中的界面内容进行反向平移显示。
15.根据权利要求14所述的装置,其特征在于,所述卷动路径是曲线路径或折线路径;
所述曲线路径包括:螺旋线路径、扇形路径、椭圆扇形路径、双曲线段路径和抛物线段路径中的任意一种;
所述折线路径为:由三维空间中的始点、终点及其余n个任意点,按预先设定的连接顺序连接所形成的折线路径,n为大于等于0的整数。
16.根据权利要求14所述的装置,其特征在于,所述卷动区域是位于所述用户界面的卷动线和所述边缘之间的区域,所述卷动线是直线段、折线段和曲线段中的任意一种。
17.根据权利要求14所述的装置,其特征在于,所述第二显示模块,还被配置为:
按照所述第一滑动信号的滑动速度显示沿着所述卷动路径卷动的所述界面内容;
或,
按照第一速度显示沿着所述卷动路径卷动的所述界面内容;所述第一速度与卷动距离在所述卷动区域所在平面上的投影距离成负相关关系,所述卷动距离为所述界面内容沿着所述卷动路径卷动的距离;
或,
按照第一预设初速度以及第一预设加速度显示沿着所述卷动路径匀减速卷动的所述界面内容。
18.根据权利要求14所述的装置,其特征在于,所述装置,还包括:
第二接收模块,被配置为接收第二滑动信号,所述第二滑动信号的滑动方向与所述第一滑动信号的滑动方向相反;
所述第三显示模块,还被配置为在所述第二接收模块接收到所述第二滑动信号之后,执行所述将进入所述卷动区域的所述界面内容在所述卷动区域中进行反向卷动显示的步骤。
19.根据权利要求14或18所述的装置,其特征在于,所述第三显示模块,还被配置为:
按照预设速度在所述卷动区域中显示沿着所述卷动路径反向卷出所述卷动区域的所述界面内容;
或,
按照第二预设初速度以及第二预设加速度显示沿着所述卷动路径反向匀加速卷出所述卷动区域的所述界面内容;
或,
按照第二速度显示沿着所述卷动路径反向卷出所述卷动区域的所述界面内容,所述第二速度根据预设三角函数的输出的变化而变化。
20.根据权利要求14至18任一所述的装置,其特征在于,所述装置,还包括停止平移模块,所述停止平移模块被配置为:
在所述第一滑动信号结束时,停止向所述卷动区域平移所述界面内容;
或者,
在所述界面内容中的预设内容移动至所述用户界面中的预设位置时,停止向所述卷动区域平移所述界面内容,所述预设内容为所述用户界面中所述第一滑动信号所对应的触发位置处的内容,或者,所述用户界面的界面内容中与所述卷动区域之间的距离最远的内容;
或者,
在所述界面内容按照减速滑动且滑动速度减为零时,停止向所述卷动区域平移所述界面内容。
21.根据权利要求14至18任一所述的装置,其特征在于,所述装置,还包括:
内容填充模块,还被配置为在所述界面内容的移动过程中,若所述用户界面中与所述卷动区域相对的另一侧的边缘处出现空白区域,则在所述空白区域中填充显示预设填充内容。
22.一种界面显示装置,其特征在于,所述装置包括:
接收模块,被配置为接收作用于用户界面中的滑动信号;
第一显示模块,被配置为根据所述接收模块接收到的所述滑动信号将所述用户界面中的界面内容进行平移显示;
第二显示模块,被配置为在所述用户界面中隐藏显示的界面内容从屏幕外进入位于边缘的卷动区域时,将所述用户界面中隐藏显示的界面内容在所述卷动区域中进行卷动显示,其中,平移至所述卷动区域内的内容与尚未平移至所述卷动区域内的内容相互连接,所述卷动显示是将所述界面内容沿三维空间中的卷动路径卷动收起时在所述卷动区域所在平面上的投影显示。
23.根据权利要求22所述的装置,其特征在于,所述卷动路径是曲线路径或折线路径;
所述曲线路径包括:螺旋线路径、扇形路径、椭圆扇形路径、双曲线段路径和抛物线段路径中的任意一种;
所述折线路径为:由三维空间中的始点、终点及其余n个任意点,按预先设定的连接顺序连接所形成的折线路径,n为大于等于0的整数。
24.根据权利要求22所述的装置,其特征在于,所述卷动区域是位于所述用户界面的卷动线和所述边缘之间的区域,所述卷动线是直线段、折线段和曲线段中的任意一种。
25.根据权利要求22所述的装置,其特征在于,所述第二显示模块,被配置为:
按照所述滑动信号的滑动速度显示沿着所述卷动路径卷动的所述界面内容;
或,
按照目标速度显示沿着所述卷动路径卷动的所述界面内容;所述目标速度与卷动距离在所述卷动区域所在平面上的投影距离成负相关关系,所述卷动距离为所述界面内容沿着所述卷动路径卷动的距离;
或,
按照预设初速度以及预设加速度显示沿着所述卷动路径匀减速卷动的所述界面内容。
26.根据权利要求22至25任一所述的装置,其特征在于,所述装置,还包括:停止平移模块,所述停止平移模块,被配置为:
在所述滑动信号结束时,停止向所述卷动区域平移所述界面内容;
或者,
在所述界面内容中的预设内容移动至所述用户界面中的预设位置时,停止向所述卷动区域平移所述界面内容,所述预设内容为所述用户界面中所述滑动信号所对应的触发位置处的内容,或者,所述用户界面的界面内容中与所述卷动区域之间的距离最远的内容;
或者,
在所述界面内容按照减速滑动且滑动速度减为零时,停止向所述卷动区域平移所述界面内容。
27.一种界面显示装置,其特征在于,所述装置包括:
处理器;
用于存储所述处理器可执行指令的存储器;
其中,所述处理器被配置为:
接收作用于用户界面中的第一滑动信号;
根据所述第一滑动信号将所述用户界面中的界面内容进行平移显示;
当所述界面内容平移至位于边缘的卷动区域时,将所述界面内容中平移至所述卷动区域内的内容进行卷动显示,其中,平移至所述卷动区域内的内容与尚未平移至所述卷动区域内的内容相互连接,所述卷动显示是将所述界面内容沿三维空间中的卷动路径卷动收起时在所述卷动区域所在平面上的投影显示;
在停止向所述卷动区域平移所述界面内容之后,将进入所述卷动区域的所述界面内容在所述卷动区域中进行反向卷动显示,所述反向卷动显示是将所述界面内容沿所述三维空间中的所述卷动路径反向卷出所述卷动区域时在所述卷动区域所在平面上的投影显示;
将所述用户界面中所述卷动区域之外的其他区域中的界面内容进行反向平移显示。
28.一种包括指令的非临时性计算机可读存储介质,其特征在于,所述存储介质中包括指令,所述指令由处理器执行以实现如权利要求1至13任一所述的界面显示方法。
CN201510984779.XA 2015-12-24 2015-12-24 界面显示方法及装置 Active CN106919323B (zh)

Priority Applications (4)

Application Number Priority Date Filing Date Title
CN201510984779.XA CN106919323B (zh) 2015-12-24 2015-12-24 界面显示方法及装置
PCT/CN2016/101295 WO2017107617A1 (zh) 2015-12-24 2016-09-30 界面显示方法及装置
US15/362,829 US20170185257A1 (en) 2015-12-24 2016-11-29 Interface display method, apparatus, and storage medium
EP16203574.5A EP3185114A1 (en) 2015-12-24 2016-12-13 Interface display method and apparatus, computer program and recording medium

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201510984779.XA CN106919323B (zh) 2015-12-24 2015-12-24 界面显示方法及装置

Publications (2)

Publication Number Publication Date
CN106919323A CN106919323A (zh) 2017-07-04
CN106919323B true CN106919323B (zh) 2020-09-01

Family

ID=57680063

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201510984779.XA Active CN106919323B (zh) 2015-12-24 2015-12-24 界面显示方法及装置

Country Status (4)

Country Link
US (1) US20170185257A1 (zh)
EP (1) EP3185114A1 (zh)
CN (1) CN106919323B (zh)
WO (1) WO2017107617A1 (zh)

Families Citing this family (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111246012B (zh) * 2020-01-06 2022-09-16 北京小米移动软件有限公司 应用界面显示方法、装置及存储介质
CN111708506B (zh) * 2020-06-09 2022-11-22 上海卷视科技有限公司 卷轴式显示屏的显示方法、系统、电子设备及存储介质

Citations (17)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20060268020A1 (en) * 2005-05-25 2006-11-30 Samsung Electronics Co., Ltd. Scrolling method and apparatus using plurality of blocks into which items are classified
US20080066016A1 (en) * 2006-09-11 2008-03-13 Apple Computer, Inc. Media manager with integrated browsers
CN101169698A (zh) * 2006-10-27 2008-04-30 达方电子股份有限公司 画面卷动方法
CN201195468Y (zh) * 2008-01-24 2009-02-18 孟守山 带卷轴的连环画
CN101464744A (zh) * 2007-12-21 2009-06-24 义隆电子股份有限公司 在触控板上控制卷轴卷动的方法
CN101673184A (zh) * 2009-07-16 2010-03-17 苏州瀚瑞微电子有限公司 在触控板上控制卷轴卷动及卷动延长的方法
CN101930339A (zh) * 2010-08-11 2010-12-29 惠州Tcl移动通信有限公司 一种电子设备界面切换的方法及装置
US20110225545A1 (en) * 2010-03-09 2011-09-15 Horodezky Samuel J System and method of displaying graphical user interface objects
US20110320969A1 (en) * 2010-06-28 2011-12-29 Pantech Co., Ltd. Apparatus for processing an interactive three-dimensional object
US20120144342A1 (en) * 2010-12-07 2012-06-07 Samsung Electronics Co., Ltd. Method and apparatus for displaying lists
US20120151416A1 (en) * 2010-12-10 2012-06-14 International Business Machines Corporation Controlling three-dimensional views of selected portions of content
CN102637087A (zh) * 2011-02-14 2012-08-15 太瀚科技股份有限公司 边缘区域具有滚动卷轴功能的数字板
CN102890602A (zh) * 2012-09-17 2013-01-23 福建星网视易信息系统有限公司 对象突出显示的方法及显示装置
CN102945116A (zh) * 2012-10-19 2013-02-27 广东欧珀移动通信有限公司 一种界面切换显示方法、装置及移动终端
US20150007102A1 (en) * 2013-06-28 2015-01-01 Samsung Electronics Co., Ltd. Method of displaying page and electronic device implementing the same
CN104951179A (zh) * 2014-03-27 2015-09-30 腾讯科技(北京)有限公司 一种对页面进行刷新处理的方法和装置
CN105117114A (zh) * 2015-08-07 2015-12-02 魅族科技(中国)有限公司 一种页面显示的方法及终端

Family Cites Families (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102291696A (zh) * 2011-09-15 2011-12-21 中兴通讯股份有限公司 移动终端上展现业务信息的方法和装置
CN103593116B (zh) * 2012-08-15 2018-10-19 腾讯科技(深圳)有限公司 便携式终端工具栏的显示和控制方法、及其装置
US20140282146A1 (en) * 2013-03-15 2014-09-18 Samsung Electronics Co. Ltd. Use of perspective to improve visual information density
CN103677564B (zh) * 2013-11-20 2016-03-30 小米科技有限责任公司 滑动操作响应方法、装置及终端设备

Patent Citations (17)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20060268020A1 (en) * 2005-05-25 2006-11-30 Samsung Electronics Co., Ltd. Scrolling method and apparatus using plurality of blocks into which items are classified
US20080066016A1 (en) * 2006-09-11 2008-03-13 Apple Computer, Inc. Media manager with integrated browsers
CN101169698A (zh) * 2006-10-27 2008-04-30 达方电子股份有限公司 画面卷动方法
CN101464744A (zh) * 2007-12-21 2009-06-24 义隆电子股份有限公司 在触控板上控制卷轴卷动的方法
CN201195468Y (zh) * 2008-01-24 2009-02-18 孟守山 带卷轴的连环画
CN101673184A (zh) * 2009-07-16 2010-03-17 苏州瀚瑞微电子有限公司 在触控板上控制卷轴卷动及卷动延长的方法
US20110225545A1 (en) * 2010-03-09 2011-09-15 Horodezky Samuel J System and method of displaying graphical user interface objects
US20110320969A1 (en) * 2010-06-28 2011-12-29 Pantech Co., Ltd. Apparatus for processing an interactive three-dimensional object
CN101930339A (zh) * 2010-08-11 2010-12-29 惠州Tcl移动通信有限公司 一种电子设备界面切换的方法及装置
US20120144342A1 (en) * 2010-12-07 2012-06-07 Samsung Electronics Co., Ltd. Method and apparatus for displaying lists
US20120151416A1 (en) * 2010-12-10 2012-06-14 International Business Machines Corporation Controlling three-dimensional views of selected portions of content
CN102637087A (zh) * 2011-02-14 2012-08-15 太瀚科技股份有限公司 边缘区域具有滚动卷轴功能的数字板
CN102890602A (zh) * 2012-09-17 2013-01-23 福建星网视易信息系统有限公司 对象突出显示的方法及显示装置
CN102945116A (zh) * 2012-10-19 2013-02-27 广东欧珀移动通信有限公司 一种界面切换显示方法、装置及移动终端
US20150007102A1 (en) * 2013-06-28 2015-01-01 Samsung Electronics Co., Ltd. Method of displaying page and electronic device implementing the same
CN104951179A (zh) * 2014-03-27 2015-09-30 腾讯科技(北京)有限公司 一种对页面进行刷新处理的方法和装置
CN105117114A (zh) * 2015-08-07 2015-12-02 魅族科技(中国)有限公司 一种页面显示的方法及终端

Also Published As

Publication number Publication date
US20170185257A1 (en) 2017-06-29
EP3185114A1 (en) 2017-06-28
CN106919323A (zh) 2017-07-04
WO2017107617A1 (zh) 2017-06-29

Similar Documents

Publication Publication Date Title
CN107908351B (zh) 应用界面的显示方法、装置及存储介质
EP3260967A1 (en) Method and apparatus for text selection
CN112256169B (zh) 内容展示方法、装置、电子设备及存储介质
US20150113475A1 (en) Method and device for providing an image preview
CN106990891B (zh) 弹幕的显示控制方法及装置
WO2015188561A1 (zh) 图片切换方法和装置
EP2921969A1 (en) Method and apparatus for centering and zooming webpage and electronic device
US20210311622A1 (en) Method and apparatus for obtaining content
CN106775235B (zh) 屏幕壁纸展示方法和装置
CN108829475B (zh) Ui绘制方法、装置及存储介质
CN107656694B (zh) 用户界面的显示控制方法及装置
CN111552425A (zh) 一种控制小窗显示的方法、装置及存储介质
CN107566878B (zh) 直播中显示图片的方法及装置
CN106775210B (zh) 壁纸更换的方法和装置
CN106919323B (zh) 界面显示方法及装置
CN109783171B (zh) 桌面插件切换方法、装置及存储介质
CN106325712B (zh) 终端显示控制方法、装置及终端
CN112882784A (zh) 一种应用界面显示方法、装置、智能设备及介质
CN109165068A (zh) 即时通信应用中群成员列表的展示方法、装置及移动终端
CN105955637B (zh) 处理文本输入框的方法和装置
CN107832112B (zh) 壁纸设置方法及装置
CN105975188B (zh) 图片位置调整方法及装置
EP4020150A1 (en) Method for cursor control, electronic device and storage medium
CN109413232B (zh) 屏幕显示方法及装置
CN114116106A (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
GR01 Patent grant
GR01 Patent grant