CN103257798B - 一种窗口滑动方法及装置 - Google Patents

一种窗口滑动方法及装置 Download PDF

Info

Publication number
CN103257798B
CN103257798B CN201210037284.2A CN201210037284A CN103257798B CN 103257798 B CN103257798 B CN 103257798B CN 201210037284 A CN201210037284 A CN 201210037284A CN 103257798 B CN103257798 B CN 103257798B
Authority
CN
China
Prior art keywords
window
sliding
time
target location
slip
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
CN201210037284.2A
Other languages
English (en)
Other versions
CN103257798A (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.)
Alibaba Group Holding Ltd
Original Assignee
Alibaba Group Holding 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 Alibaba Group Holding Ltd filed Critical Alibaba Group Holding Ltd
Priority to CN201210037284.2A priority Critical patent/CN103257798B/zh
Publication of CN103257798A publication Critical patent/CN103257798A/zh
Application granted granted Critical
Publication of CN103257798B publication Critical patent/CN103257798B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Landscapes

  • User Interface Of Digital Computer (AREA)

Abstract

本申请提供了一种窗口滑动方法及装置,以解决瞬移方式产生的窗口数据停滞或数据变动明显的问题。所述方法包括:记录窗口滑动指示信息,所述窗口滑动指示信息包括窗口滑动的起始位置、目标位置、起始滑动时间和滑动总时间;计算在所述起始位置和目标位置之间滑动停留的时间间隔;按照所述时间间隔,在每个滑动停留的时间点,根据所述窗口滑动指示信息和当前时间计算当前时间点的滑动位置,并将窗口从上一时间点的滑动位置移动到所述当前时间点的滑动位置,直至到达目标位置。本申请在窗口滑动过程中会选取几个点进行停留,从而使窗口移动时在屏幕上产生人眼可识别的、形象的滑动效果。

Description

一种窗口滑动方法及装置
技术领域
本申请涉及数据处理技术,特别是涉及一种窗口滑动方法及装置。
背景技术
在即时通讯工具中,鼠标悬停在用户列表中某个人头像上,此时会弹出名片窗口;然后迅速将鼠标移动到另一个人的头像上,名片窗口会“滑动”到新的位置,同时名片窗口上的内容会被更改。在所述例子中,窗口滑动即指头像附近弹出的名片窗口的滑动。
此外,在其他互联网应用中也存在类似的窗口滑动事件。例如,参照图1所示,在电子商务网站或其他网站上会展示产品的缩略图,当鼠标移动到某个产品的缩略图上时会弹出相应的放大图。当鼠标快速地在两个缩略图之间移动时,也可以实现放大图窗口的滑动。
目前,实现各种窗口的滑动基本都采用瞬移的方式,即窗口从起始位置直接变到目标位置。换而言之,窗口在起始位置显示一次,在目标位置再显示一次,即完成滑动过程。
在上述瞬移方式中,以名片窗口为例,当鼠标移动到目标位置触发名片显示时,可以采取如下两种方案:
一种方案是,先发起网络请求获取数据(即目标位置的名片内容),等数据到位的时候,显示名片;
另一种方案是,先显示目标位置的名片(此时名片上显示空数据或者来自于缓存的旧数据),然后发起网络请求获取数据,等到数据到位的时候,如果数据有更新,则刷新名片窗口界面。
在上述第一种方案中,从触发到名片真正显示,中间在等待网络数据到达的过程中会产生一定的停滞,肉眼能够明显观察到。在第二种方案中,如果用户最新数据和缓存的旧数据不一致,那么刷新界面时用户也会明显看到变动的过程。但无论哪种方案,瞬移方式都无法避免由于网络延迟造成的停滞,从而影响窗口内容(如名片)的显示。
而且,这种瞬移方式虽然实现简单,对于短距离的位置移动能达到较好的用户体验。但是,对于较长距离的移动,不形成中间过程的视觉滞留,因此并不能让用户真正体验到“滑动”效果。
发明内容
本申请提供了一种窗口滑动方法及装置,以解决瞬移方式产生的窗口数据停滞或数据变动明显的问题。
为了解决上述问题,本申请公开了一种窗口滑动方法,包括:
记录窗口滑动指示信息,所述窗口滑动指示信息包括窗口滑动的起始位置、目标位置、起始滑动时间和滑动总时间;
计算在所述起始位置和目标位置之间滑动停留的时间间隔;
按照所述时间间隔,在每个滑动停留的时间点,根据所述窗口滑动指示信息和当前时间计算当前时间点的滑动位置,并将窗口从上一时间点的滑动位置移动到所述当前时间点的滑动位置,直至到达目标位置。
优选地,所述计算滑动停留的时间间隔,包括:根据所述起始位置和目标位置之间的距离计算滑动停留的时间间隔。
优选地,所述计算包括:计算所述起始位置和目标位置之间水平和垂直的最大距离;计算滑动停留的时间间隔f,f=预设系数/最大距离;如果时间间隔f小于预设的最小值,则将时间间隔f置为所述最小值;如果时间间隔f大于预设的最大值,则将时间间隔f置为所述最大值。
优选地,所述根据所述窗口滑动指示信息和当前时间计算当前时间点的滑动位置,包括:
采用匀速直线运动模型计算当前时间点的滑动位置(x,y),公式如下:
其中,(x1,y1)表示起始位置,(x2,y2)表示目标位置,t0表示起始滑动时间,T表示滑动总时间,T为预设值或者与起始位置和目标位置之间的距离相关,t表示根据起始滑动时间t0和时间间隔得出的当前时间。
优选地,所述根据所述窗口滑动指示信息和当前时间计算当前时间点的滑动位置,包括:
采用初速为0的匀加速直线运动模型计算当前时间点的滑动位置(x,y),公式如下:
其中,(x1,y1)表示起始位置,(x2,y2)表示目标位置,t0表示起始滑动时间,T表示滑动总时间,T为预设值或者与起始位置和目标位置之间的距离相关,t表示根据起始滑动时间t0和时间间隔得出的当前时间。
优选地,所述记录窗口滑动指示信息之后,还包括:确定窗口在目标位置要显示的内容是否与窗口在起始位置显示的内容相同,如果相同,则在所述窗口中继续显示起始位置的内容;如果不同,则从本地缓存读取目标位置要显示的内容,并在所述窗口中显示,然后发起网络请求获取网络数据;在窗口滑动的过程中,当获取到网络数据后,如果所述网络数据不同于当前窗口显示的内容,则更新窗口显示的内容。
优选地,所述在每个滑动停留的时间点,计算当前时间点的滑动位置之前,还包括:确定当前时间是否等于或超过滑动总时间,如果否,则计算当前时间点的滑动位置;如果是,则当前时间点的滑动位置为目标位置,将窗口从上一时间点的滑动位置移动到目标位置。
本申请还提供了一种窗口滑动装置,包括:
信息记录单元,用于记录窗口滑动指示信息,所述窗口滑动指示信息包括窗口滑动的起始位置、目标位置、起始滑动时间和滑动总时间;
时间间隔计算单元,用于计算在所述起始位置和目标位置之间滑动停留的时间间隔;
滑动位置计算单元,用于按照所述时间间隔,在每个滑动停留的时间点,根据所述窗口滑动指示信息和当前时间计算当前时间点的滑动位置;
窗口滑动单元,用于按照所述时间间隔,在每个滑动停留的时间点,将窗口从上一时间点的滑动位置移动到所述当前时间点的滑动位置,直至到达目标位置。
优选地,所述时间间隔计算单元根据所述起始位置和目标位置之间的距离计算滑动停留的时间间隔。
优选地,所述时间间隔计算单元包括:
第一计算子单元,用于计算所述起始位置和目标位置之间水平和垂直的最大距离;
第二计算子单元,用于计算滑动停留的时间间隔f,f=预设系数/最大距离;
范围限定子单元,用于如果时间间隔f小于预设的最小值,则将时间间隔f置为所述最小值;如果时间间隔f大于预设的最大值,则将时间间隔f置为所述最大值。
优选地,所述装置还包括:数据显示单元,用于确定窗口在目标位置要显示的内容是否与窗口在起始位置显示的内容相同,如果相同,则在所述窗口中继续显示起始位置的内容;如果不同,则从本地缓存读取目标位置要显示的内容,并在所述窗口中显示,然后发起网络请求获取网络数据;在窗口滑动的过程中,当获取到网络数据后,如果所述网络数据不同于当前窗口显示的内容,则更新窗口显示的内容。
与现有技术相比,本申请包括以下优点:
首先,本申请在窗口滑动过程中会选取几个点进行停留,从而使窗口移动时在屏幕上产生人眼可识别的、形象的滑动效果。而且,可以在滑动开始的时候发起网络请求,滑动结束的时候,网络数据差不多能够到位,这样,窗口移动到目标位置的时候,显示的就是最新的数据。由于窗口的滑动是从一个点到下一个点的渐变过程,因此在窗口滑动的过程中,滑动效果也达到吸引用户注意力的作用,一般情况下用户无法分辨出窗口中具体数据的变化,即数据的刷新不会产生明显的变动效果。
进一步地,即使由于网络延迟造成整个滑动过程结束后网络数据仍然没有到位,但停滞的时间也会比瞬移方式少很多。
其次,本申请还能够根据滑动距离决定取点数量。当滑动距离很短的时候,即使取了很多点,滑动效果增加不明显,这时候只取一两个点,甚至退化为瞬移方式,从而节省程序运行开销;而当滑动距离很大的时候,增加取点数量,保证滑动效果不被距离弱化。
再次,本申请在计算取点位置的时候选用匀速直线运动或初速为0的匀加速直线运动模型,能呈现较好的视觉效果,同时模型简单、通用,便于实现。
当然,实施本申请的任一产品不一定需要同时达到以上所述的所有优点。
附图说明
图1是现有技术中某网站的页面示意图;
图2是本申请实施例所述一种窗口滑动方法的流程图;
图3是本申请实施例中四种方案的滑动位置示意图;
图4是本申请另一实施例所述一种窗口滑动方法的流程图;
图5是本申请实施例所述一种窗口滑动装置的结构图;
图6是本申请另一实施例所述一种窗口滑动装置的结构图。
具体实施方式
为使本申请的上述目的、特征和优点能够更加明显易懂,下面结合附图和具体实施方式对本申请作进一步详细的说明。
本申请提供了一种窗口滑动方法和装置,能够在窗口滑动过程中选取几个点进行停留,从而使窗口移动时在屏幕上产生人眼可识别的、形象的滑动效果,并能减少网络延迟带来的停滞现象。
本申请适用于多种应用场景,例如,如前所述,在即时通讯工具中,鼠标悬停在用户列表中某个人头像上,此时会弹出名片窗口;然后迅速将鼠标移动到另一个人的头像上,名片窗口会平滑地滑动到新的位置,同时名片窗口上的内容会被更改。
再例如,鼠标从用户列表中某个人头像上迅速移动到聊天窗口中的头像上,或者从一个聊天窗口的头像上移动到另一个聊天窗口的头像上,都会产生名片窗口的平滑滑动。
再例如,参照图1所示,在电子商务网站或其他网站上会展示产品的缩略图,当鼠标移动到某个产品的缩略图上时会弹出相应的放大图。当鼠标快速地在两个缩略图之间移动时,也可以实现放大图窗口的平滑滑动。
此外,在其他互联网应用中也存在类似的窗口滑动事件,本申请在此不一一列举。
基于以上内容,下面通过实施例对本申请所述方法的实现流程进行详细说明。
参照图2所示,是本申请实施例所述一种窗口滑动方法的流程图。
以即时通讯工具为例:
步骤201,记录窗口滑动指示信息,所述窗口滑动指示信息包括窗口滑动的起始位置、目标位置、起始滑动时间和滑动总时间;
鼠标悬停在即时通讯主界面中某个人头像上,此时会弹出名片窗口;然后迅速将鼠标移动到另一个人的头像上,名片窗口会“滑动”到新的位置,同时名片窗口上的内容会被更改。
在上述过程中,当鼠标从一个用户头像迅速移动到另一个用户头像上时,相当于发出名片窗口的滑动指令,系统根据该滑动指令会记录窗口滑动指示信息。
所述窗口滑动指示信息可包括窗口滑动的起始位置、目标位置、起始滑动时间和滑动总时间,还可以包括滑动方向等其他信息。其中,滑动总时间是指窗口从起始位置滑动到目标位置总共需要的时间。所述滑动总时间可以是预设值,即预先设定一个固定的滑动总时间,不受滑动距离的限制。或者,滑动总时间也可以与起始位置和目标位置之间的滑动距离相关,即滑动距离越长,滑动总时间越大,滑动距离越短,滑动总时间越小。
此外,为了后续计算的简便,窗口滑动的起始滑动时间可以不必反映真实世界的时间,即无需表现为某年某月某日几时几分几秒,可以相对于某个时间点的时间间隔是准确的即可,如系统启动后到当前已经过去了多少毫秒。
步骤202,计算在所述起始位置和目标位置之间滑动停留的时间间隔;
在窗口从起始位置滑动到目标位置的过程中,一般会经过多个停留点。所述停留点是指滑动过程中窗口位置逐渐变化的时候,每一个供窗口停留并显示的位置。为了保证滑动效果,本申请实施例是按照滑动距离越长、停留点越多的原则,同时保证任意两个停留点之间的滑动时间在人的肉眼的视觉滞留时间(约40ms)以内。在滑动距离较短的情况下,如果停留点选得多,则浪费性能;而在滑动距离较长的情况下,如果停留点选得少,则滑动效果不够。因此,停留点数量的选取非常重要。
在已确定滑动距离的情况下,停留点的数量与滑动停留的时间间隔有关,时间间隔越小,停留点越多;相反,时间间隔越大,停留点越少。换而言之,可以根据窗口滑动的起始位置和目标位置之间的距离计算滑动停留的时间间隔。
下面给出一种计算时间间隔的示例,但本申请的保护范围不应限定于所述示例。
首先,计算窗口滑动的起始位置和目标位置之间水平和垂直的最大距离;
其次,计算滑动停留的时间间隔f,f=预设系数/最大距离;
再次,如果时间间隔f小于预设的最小值,则将时间间隔f置为所述最小值;如果时间间隔f大于预设的最大值,则将时间间隔f置为所述最大值。
例如,假设窗口滑动的起始位置的坐标为(x1,y1),目标位置的坐标为(x2,y2),计算时间间隔的过程如下:
首先计算起点和终点间水平和垂直的最大距离D=max(|x1-x2|,|y1-y2|);
然后计算时间间隔f=1000/D,其中1000是预设系数;
最后限定时间间隔f的范围:如果f<5(预设的最小值),则置f=5;如果f>50(预设的最大值),则置f=50。
经过以上过程,最后得到的这个f,是5到50范围内的一个值,而且与D成反比。
滑动停留的时间间隔确定出来后,就可以计算出有多少个滑动停留点。
假设滑动总时间是100ms;
如果最大距离D=200px(px表示像素),那么f=1000/200=5ms,也就是,每经过5毫秒,就会显示一次名片窗口,整个滑动过程总共有100/5=20个停留点;
如果最大距离D=20px,那么f=1000/20=50ms,那就是每经过50毫秒,就会显示一次名片窗口,整个滑动过程总共只有100/50=2个停留点点;
如果最大距离D=100px,那么f=1000/100=10ms,每经过10毫秒,就会显示一次名片窗口,整个滑动过程总共有100/10=10个停留点。
按照时间间隔f的限定范围,对于最大距离大于200px的,也只显示20个停留点;对于最大距离小于20px的,也只显示2个停留点,即起始点和目标点。
此外,需要说明的是,根据实际应用情况的需要,停留点的数量也可以设定为固定值,例如每次的滑动距离都固定的情况,则无需每次滑动都重新计算滑动距离。
步骤203,按照所述时间间隔,在每个滑动停留的时间点,根据所述窗口滑动指示信息和当前时间计算当前时间点的滑动位置,并将窗口从上一时间点的滑动位置移动到所述当前时间点的滑动位置,直到到达目标位置。
举例来说,从起始位置开始,每经过时间间隔f,就到达一个滑动停留的时间点,此时计算一次对应的停留点的具体滑动位置,然后将窗口从上一时间点的滑动位置移动到当前计算得出的滑动位置,也即从上一停留点移动到当前停留点的滑动位置,直至最后移动到目标位置。
实际应用中,可采用不同的运动模型来计算每一次停留的滑动位置,下面列举出三种运动模型来实现窗口滑动,分别如下:
第一种:固定点运动
固定点滑动选取固定点运动模型,该运动模型从几个固定比例的点上滑过,形成视觉滞留。例如,分6个相同的时间段,分别滑动到1/20处、2/20处、3/20处、4/20处、10/20处、20/20处。
在固定点运动模型下,在每个停留点计算具体的滑动位置时,只需要计算出当前时间,就可以找到对应的滑动位置。例如,假设滑动停留的时间间隔为10ms,则滑动从0ms开始计算,经过10ms对应的滑动位置为1/20处,经过20ms对应的滑动位置为2/20处,依此类推。
所述固定点运动能够在一定程度上实现“滑动”效果,也能有效解决由于网络延迟造成的停滞问题。但是,由于取点是固定的,无论起始位置和目标位置相距多少,都取同样数量的点(比如6个)。那么,当滑动距离很短的时候,6个点是过多的,浪费性能;当滑动距离很长的时候,6个点又过少,效果不足。而且,固定的那几个点需要由人工事先给出,并硬编码到程序里。并且,人工给出的那几个点,需要有较强的理论基础作为依据,否则很难保证视觉效果。即便视觉效果过得去,也很难给出对于运动模型的简洁明了的说明,文档记载不方便。
基于此,本申请实施例还给出了下面的另外两种滑动效果更优的运动模型,分别是匀速直线运动模型和匀加速直线运动模型。这两种运动模型相对简单,实现起来容易。而且,前者能很好的体现平滑性,后者则能体现运动的倾向性。下面分别详细说明。
首先,这两种运动模型的数学推导如下:
1、假设滑动效果的总时间为T(比如,T=100ms,或者可以设置T与滑动距离相关)。
2、假设滑动的起讫位置为(x1,y1)到(x2,y2)。
3、运动开始的时候,记录当前时间点t0。如前所述,此时间可以不必反映真实世界的时间,即无需表现为某年某月某日几时几分几秒,只需要相对于某个时间点的时间间隔是准确的即可。
下面推导当时间流逝到t(t0<=t<=t0+T)时,计算当前位置(x,y)的表达式。
第二种:匀速直线运动
根据匀速直线运动公式,有
其中,Vx、Vy分别表示匀速直线运动的速度;
当t=t0+T的时候,x=x2,y=y2,带入第一个式子可得
代入第一个式子,有
所以
第三种:匀加速直线运动
为了计算简便,本实施例选取初速为0的匀加速直线运动,计算如下:
根据初速为0的匀加速直线运动公式
其中,ax、ay分别表示匀加速直线运动的加速度;
当t=t0+T的时候,x=x2,y=y2,带入上式可得
代入第一个式子,有
所以
利用上述匀速直线运动模型和匀加速直线运动模型实现窗口的滑动,具体实现步骤如下:
1、滑动开始的时候,启动一个Timer或者具有类似效果的计时器。计时器的时钟周期(即上述的时间间隔)与滑动距离关联,滑动距离越大,时钟周期越短,停留点越多。同时,记录当前窗口位置和当前时间。
2、当时钟周期来临时,根据当前时间以及上文的公式重新计算位置,然后将窗口移动到新的位置。
3、当时间流逝已经到达或超过滑动总时间的时候,将窗口移动到目标位置,同时关闭Timer或计时器,滑动效果完成。
举例来说,假设从发起网络请求到成功获取数据,需要100毫秒。上面数学推导中,有x、y两维坐标,是因为需要支持屏幕平面上的任意位置,现在为简化计算,以在直线上作说明,可以省略掉y方向。同时,取起始滑动时间t0=0,起始位置x1=0,目标位置x2=360px(px表示像素)。理想情况,滑动总时间T应该大于等于网络延时,可以取T=120ms。
基于以上假设,公式简化为以下情况:
匀速直线运动:
匀加速直线运动:
固定点的位置可如前文所述,分别取1/20处、2/20处、3/20处、4/20处、10/20处、20/20处。为了方便与固定点运动和现有技术中的瞬移方案一起比较,下面都取6个时间点(或停留点)。下表是各个时间点滑动到的位置:
时间 t=0 t=20ms t=40ms t=60ms t=80ms t=100ms t=120ms
瞬移 0 360px 360px 360px 360px 360px 360px
固定点 0 18px 36px 54px 72px 180px 360px
匀速 0 60px 120px 180px 240px 300px 360px
匀加速 0 10px 40px 90px 160px 250px 360px
表1
上述四种包含现有技术的方案中,起始点加上这六个时间点,滑动位置示意图如图3所示。
当然,如果固定点方案选点选得好,同样可以达到匀速或者匀加速的效果,但是如前所述,由于是硬编码方式,如果增加点数,所有的位置都需要重新手工计算过并且编译到程序代码中,更无法根据距离变化而增减取点的数目。因此,相比较而言,匀速直线运动和匀加速直线运动这两种方案实现起来更加灵活。
基于以上内容,为了使本领域技术人员更加了解本申请的内容,下面通过另一个更详细的例子进行说明。
参照图4所示,是本申请另一实施例所述一种名片窗口的滑动处理流程图。
具体步骤如下:
S10,名片显示开始,判断起始位置的名片窗口是否已显示;
如果未显示,则进入S21~S51的流程,启动显示名片的过程;如果已显示,则进入S20~S113的流程,开始窗口滑动的过程。
实际应用中,从鼠标悬停在某个人头像上到弹出名片窗口的过程,就是S10到S21的过程。此外,名片窗口是会关闭的。例如,当鼠标停留在名片激活区域(比如用户头像)外,并且不位于名片窗口上,持续时间超过显示1秒,名片窗口就会自动关闭。另外,如果用户在名片窗口之外按鼠标按钮,名片也会关闭。
因此,在名片窗口未显示(从未显示过,或者曾经显示过但是关闭了)的情况下:
用户将鼠标移动到用户头像A上,此时进入S21及其后续流程,弹出名片窗口;
然后用户迅速将鼠标移动到用户头像B上,进入S20及其后续流程,名片窗口滑动。
除了以上列举的情况外,还有一种特殊情况:
如果鼠标所在的头像还没有显示出名片窗口,用户就将鼠标从该头像迅速移动到了另一个头像上,此时名片窗口就没有显示,进入S21~S51的流程。这是一种特殊情况,需要用户在极短的时间内快速移动鼠标。
但是通常情况下,当用户把鼠标放到某个头像上时,对应的名片窗口会在短时间内显示出来,除非用户的动作非常快。因此在大多数情况下,起始位置的名片窗口已显示,并进入S20~S113的流程。
S21~S51的流程如下:
S21,在起始位置创建并显示名片窗口;
S31,读取并显示缓存数据;
所述缓存数据是起始位置的窗口中要显示的名片内容,存储在本地缓存中。
S41,发起网络请求获取数据;
即从网络端获取起始位置的名片内容。
S51,若网络数据到达,则更新名片界面显示,名片显示结束。
当然,如果网络数据与缓存数据相同,则无需更新名片界面显示。
S20~S113的流程如下:
S20,判断要显示的用户ID是否与当前的相同;
即确定窗口在目标位置要显示的内容是否与窗口在起始位置显示的内容相同,如果相同,则在所述窗口中继续显示起始位置的内容;
如果不同,则从本地缓存读取目标位置要显示的内容,并在所述窗口中显示,然后发起网络请求获取网络数据。
其中,通过用户ID可以判断出名片内容是否相同。上述要显示的用户ID对应目标位置要显示的内容,当前的用户ID对应起始位置显示的内容。
S20进行判断的原因是,实际应用中,可能存在以下两种情况:
一种情况是,鼠标仅在即时通讯工具的用户列表中移动,即从用户列表中的一个头像移动到另一个头像上,此时这两个头像对应着两个不同的用户ID;
另一种情况是,鼠标从用户列表的一个头像上移动到某个即时通讯窗口(如聊天窗口)中的头像上,此时这两个头像可能对应着同一用户ID,也可能对应不同的用户ID。还有,在两个即时通讯窗口的头像上移动时,也对应着两个不同的用户ID。
因此,S20通过判断来确定用户ID是否发生变更。如果相同未变更,则直接进入S50;如果不同已变更,则进入S30~S40,然后再进入S50。
S30,读取并显示缓存数据;
即从本地缓存读取目标位置要显示的名片内容,并在所述窗口中替换起始位置的名片内容进行显示。
S40,发起网络请求获取数据;
即从网络端获取目标位置的名片内容。
S50,读取起始位置、目标位置和起始滑动时间;
S60,根据滑动距离计算时钟周期;
所述时钟周期即上述滑动停留的时间间隔,具体的计算方法可参照图2的实施例。
S70,设置定时器,滑动开始;
所述定时器从滑动总时间的起点开始计时,并每隔一个时钟周期调用一次S80。例如,滑动总时间是100ms,时钟周期是10ms,则定时器每过10ms调用一次S80。
S80,判断当前时间是否大于等于滑动总时间;
如果是,则进入S91;如果否,进入S90;
实际应用中,当S80最后一次被调用时,通常当前时间等于滑动总时间,但是在某些情况下,当前时间要大于滑动总时间。例如,假设滑动距离为30px,滑动总时间为100ms,由于取整的原因,时钟周期=1000/30=33ms,会产生100/33=3个停留点,但是三个周期过去后,总时间只有99ms,所以会继续进行下一个周期,此时总时间=132ms,就超过了预定的滑动总时间100ms。
S90,根据当前时间和公式计算滑动位置;
所述公式可选择匀速直线运动或匀加速直线运动的计算公式,然后进入S100。
S100,将名片窗口移到计算出的位置;
S91,将名片窗口移到目标位置;
即当前时间点的滑动位置为目标位置,将窗口从上一时间点的滑动位置移动到目标位置,然后进入S101。
S101,关闭定时器,名片显示结束。
关闭定时器后,定时器的计时进入终点。
此外,需要说明的是,上述图4流程中,S40之后的网络数据到达,并进入S51更新名片界面显示,表示的含义是:如果起始位置的用户ID和目标位置的用户ID不同,那么在整个窗口滑动的过程中,窗口从一个停留点滑动到下一个停留点,在此过程中,当获取到网络数据后,如果所述网络数据不同于当前窗口显示的内容,则在最近的停留点更新窗口显示的内容。换而言之,名片内容在哪个停留点变换取决于网络延迟。当然,如果网络数据与缓存数据相同,则无需更新名片界面显示。
综上所述,本申请实施例提供的窗口滑动方法可以使窗口移动时在屏幕上产生人眼可识别的、形象的滑动效果。而且,还可以在滑动开始的时候发起网络请求,滑动结束的时候,网络数据差不多能够到位,这样,窗口移动到目标位置的时候,显示的就是最新的数据。由于窗口的滑动是从一个点到下一个点的渐变过程,因此在窗口滑动的过程中,滑动效果也达到吸引用户注意力的作用,一般情况下用户无法分辨出窗口中具体数据的变化,即数据的刷新不会产生明显的变动效果。
进一步地,即使由于网络延迟造成整个滑动过程结束后网络数据仍然没有到位,但停滞的时间也会比瞬移方式少很多。
其次,本申请还能够根据滑动距离决定取点数量。当滑动距离很短的时候,即使取了很多点,滑动效果增加不明显,这时候只取一两个点,甚至退化为瞬移方式,从而节省程序运行开销;而当滑动距离很大的时候,增加取点数量,保证滑动效果不被距离弱化。
再次,本申请在计算取点位置的时候选用匀速直线运动或初速为0的匀加速直线运动模型,能呈现较好的视觉效果,同时模型简单、通用,便于实现。
上述实施例均是以名片窗口为例进行说明,但具体应用中也可以应用到产品放大图的滑动显示等其他领域中,其实施原理与上述实施例相似,故不再赘述。
需要说明的是,对于前述的方法实施例,为了简单描述,故将其都表述为一系列的动作组合,但是本领域技术人员应该知悉,本申请并不受所描述的动作顺序的限制,因为依据本申请,某些步骤可以采用其他顺序或者同时进行。其次,本领域技术人员也应该知悉,说明书中所描述的实施例均属于优选实施例,所涉及的动作并不一定是本申请所必需的。
基于上述方法实施例的说明,本申请还提供了相应的窗口滑动装置实施例。
参照图5,是本申请实施例所述一种窗口滑动装置的结构图。
所述窗口滑动装置可以包括以下单元:
信息记录单元10,用于记录窗口滑动指示信息,所述窗口滑动指示信息包括窗口滑动的起始位置、目标位置、起始滑动时间和滑动总时间;
时间间隔计算单元20,用于计算在所述起始位置和目标位置之间滑动停留的时间间隔;
滑动位置计算单元30,用于按照所述时间间隔,在每个滑动停留的时间点,根据所述窗口滑动指示信息和当前时间计算当前时间点的滑动位置;
窗口滑动单元40,用于按照所述时间间隔,在每个滑动停留的时间点,将窗口从上一时间点的滑动位置移动到所述当前时间点的滑动位置,直至到达目标位置。
在另一优选实施例中,所述时间间隔计算单元20可以根据所述起始位置和目标位置之间的距离计算滑动停留的时间间隔。
具体地,所述时间间隔计算单元20可以包括以下子单元:
第一计算子单元,用于计算所述起始位置和目标位置之间水平和垂直的最大距离;
第二计算子单元,用于计算滑动停留的时间间隔f,f=预设系数/最大距离;
范围限定子单元,用于如果时间间隔f小于预设的最小值,则将时间间隔f置为所述最小值;如果时间间隔f大于预设的最大值,则将时间间隔f置为所述最大值。
在另一优选实施例中,所述滑动位置计算单元30可以采用匀速直线运动模型计算当前时间点的滑动位置(x,y),公式如下:
其中,(x1,y1)表示起始位置,(x2,y2)表示目标位置,t0表示起始滑动时间,T表示滑动总时间,T为预设值或者与起始位置和目标位置之间的距离相关,t表示根据起始滑动时间t0和时间间隔得出的当前时间。
在另一优选实施例中,所述滑动位置计算单元30还可以采用初速为0的匀加速直线运动模型计算当前时间点的滑动位置(x,y),公式如下:
其中,(x1,y1)表示起始位置,(x2,y2)表示目标位置,t0表示起始滑动时间,T表示滑动总时间,T为预设值或者与起始位置和目标位置之间的距离相关,t表示根据起始滑动时间t0和时间间隔得出的当前时间。
此外,所述滑动位置计算单元30还可以采用固定点方式计算滑动位置。
在另一优选实施例中,参照图6所示,所述窗口滑动装置还可以包括:
数据显示单50,用于确定窗口在目标位置要显示的内容是否与窗口在起始位置显示的内容相同,如果相同,则在所述窗口中继续显示起始位置的内容;如果不同,则从本地缓存读取目标位置要显示的内容,并在所述窗口中显示,然后发起网络请求获取网络数据;在窗口滑动的过程中,当获取到网络数据后,如果所述网络数据不同于当前窗口显示的内容,则更新窗口显示的内容。
在另一优选实施例中,所述窗口滑动单元40还可用于确定当前时间是否等于或超过滑动总时间,如果否,则计算当前时间点的滑动位置;如果是,则当前时间点的滑动位置为目标位置,将窗口从上一时间点的滑动位置移动到目标位置。
对于上述窗口滑动装置实施例而言,由于其与方法实施例基本相似,所以描述的比较简单,相关之处参见图2和图4所示方法实施例的部分说明即可。
本说明书中的各个实施例均采用递进的方式描述,每个实施例重点说明的都是与其他实施例的不同之处,各个实施例之间相同相似的部分互相参见即可。
本申请可用于众多通用或专用的计算系统环境或配置中。例如:个人计算机、服务器计算机、手持设备或便携式设备、平板型设备、多处理器系统、基于微处理器的系统、置顶盒、可编程的消费电子设备、网络PC、小型计算机、大型计算机、包括以上任何系统或设备的分布式计算环境等等。
本申请可以在由计算机执行的计算机可执行指令的一般上下文中描述,例如程序模块。在本申请中,“装置”指应用于计算机的相关实体,如硬件、硬件和软件的组合、软件或执行中的软件等。
最后,还需要说明的是,在本文中,诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来,而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。
以上对本申请所提供的一种窗口滑动方法和装置,进行了详细介绍,本文中应用了具体个例对本申请的原理及实施方式进行了阐述,以上实施例的说明只是用于帮助理解本申请的方法及其核心思想;同时,对于本领域的一般技术人员,依据本申请的思想,在具体实施方式及应用范围上均会有改变之处,综上所述,本说明书内容不应理解为对本申请的限制。

Claims (9)

1.一种窗口滑动方法,其特征在于,包括:
记录窗口滑动指示信息,所述窗口滑动指示信息包括窗口滑动的起始位置、目标位置、起始滑动时间和滑动总时间;
计算在所述窗口滑动的起始位置和目标位置之间滑动停留的时间间隔;
按照所述时间间隔,在每个滑动停留的时间点,根据所述窗口滑动指示信息和当前时间计算当前时间点的滑动位置,并将窗口从上一时间点的滑动位置移动到所述当前时间点的滑动位置,直至到达目标位置;
所述计算滑动停留的时间间隔,包括:根据所述起始位置和目标位置之间的距离计算滑动停留的时间间隔。
2.根据权利要求1所述的方法,其特征在于,所述计算包括:
计算所述起始位置和目标位置之间水平和垂直的最大距离;
计算滑动停留的时间间隔f,f=预设系数/最大距离;
如果时间间隔f小于预设的最小值,则将时间间隔f置为所述最小值;
如果时间间隔f大于预设的最大值,则将时间间隔f置为所述最大值。
3.根据权利要求1所述的方法,其特征在于,所述根据所述窗口滑动指示信息和当前时间计算当前时间点的滑动位置,包括:
采用匀速直线运动模型计算当前时间点的滑动位置(x,y),公式如下:
x = x 1 + ( x 2 - x 1 ) ( t - t 0 T ) y = y 1 + ( y 2 - y 1 ) ( t - t 0 T )
其中,(x1,y1)表示起始位置,(x2,y2)表示目标位置,t0表示起始滑动时间,T表示滑动总时间,T为预设值或者与起始位置和目标位置之间的距离相关,t表示根据起始滑动时间t0和时间间隔得出的当前时间。
4.根据权利要求1所述的方法,其特征在于,所述根据所述窗口滑动指示信息和当前时间计算当前时间点的滑动位置,包括:
采用初速为0的匀加速直线运动模型计算当前时间点的滑动位置(x,y),公式如下:
x = x 1 + ( x 2 - x 1 ) ( t - t 0 T ) 2 y = y 1 + ( y 2 - y 1 ) ( t - t 0 T ) 2
其中,(x1,y1)表示起始位置,(x2,y2)表示目标位置,t0表示起始滑动时间,T表示滑动总时间,T为预设值或者与起始位置和目标位置之间的距离相关,t表示根据起始滑动时间t0和时间间隔得出的当前时间。
5.根据权利要求1至4任一所述的方法,其特征在于,所述记录窗口滑动指示信息之后,还包括:
确定窗口在目标位置要显示的内容是否与窗口在起始位置显示的内容相同,如果相同,则在所述窗口中继续显示起始位置的内容;
如果不同,则从本地缓存读取目标位置要显示的内容,并在所述窗口中显示,然后发起网络请求获取网络数据;
在窗口滑动的过程中,当获取到网络数据后,如果所述网络数据不同于当前窗口显示的内容,则更新窗口显示的内容。
6.根据权利要求1至4任一所述的方法,其特征在于,所述在每个滑动停留的时间点,计算当前时间点的滑动位置之前,还包括:
确定当前时间是否等于或超过滑动总时间,如果否,则计算当前时间点的滑动位置;
如果是,则当前时间点的滑动位置为目标位置,将窗口从上一时间点的滑动位置移动到目标位置。
7.一种窗口滑动装置,其特征在于,包括:
信息记录单元,用于记录窗口滑动指示信息,所述窗口滑动指示信息包括窗口滑动的起始位置、目标位置、起始滑动时间和滑动总时间;
时间间隔计算单元,用于计算在所述窗口滑动的起始位置和目标位置之间滑动停留的时间间隔;
滑动位置计算单元,用于按照所述时间间隔,在每个滑动停留的时间点,根据所述窗口滑动指示信息和当前时间计算当前时间点的滑动位置;
窗口滑动单元,用于按照所述时间间隔,在每个滑动停留的时间点,将窗口从上一时间点的滑动位置移动到所述当前时间点的滑动位置,直至到达目标位置;
所述时间间隔计算单元根据所述起始位置和目标位置之间的距离计算滑动停留的时间间隔。
8.根据权利要求7所述的装置,其特征在于,所述时间间隔计算单元包括:
第一计算子单元,用于计算所述起始位置和目标位置之间水平和垂直的最大距离;
第二计算子单元,用于计算滑动停留的时间间隔f,f=预设系数/最大距离;
范围限定子单元,用于如果时间间隔f小于预设的最小值,则将时间间隔f置为所述最小值;如果时间间隔f大于预设的最大值,则将时间间隔f置为所述最大值。
9.根据权利要求7至8任一所述的装置,其特征在于,还包括:
数据显示单元,用于确定窗口在目标位置要显示的内容是否与窗口在起始位置显示的内容相同,如果相同,则在所述窗口中继续显示起始位置的内容;如果不同,则从本地缓存读取目标位置要显示的内容,并在所述窗口中显示,然后发起网络请求获取网络数据;在窗口滑动的过程中,当获取到网络数据后,如果所述网络数据不同于当前窗口显示的内容,则更新窗口显示的内容。
CN201210037284.2A 2012-02-17 2012-02-17 一种窗口滑动方法及装置 Active CN103257798B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201210037284.2A CN103257798B (zh) 2012-02-17 2012-02-17 一种窗口滑动方法及装置

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201210037284.2A CN103257798B (zh) 2012-02-17 2012-02-17 一种窗口滑动方法及装置

Publications (2)

Publication Number Publication Date
CN103257798A CN103257798A (zh) 2013-08-21
CN103257798B true CN103257798B (zh) 2017-05-10

Family

ID=48961746

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201210037284.2A Active CN103257798B (zh) 2012-02-17 2012-02-17 一种窗口滑动方法及装置

Country Status (1)

Country Link
CN (1) CN103257798B (zh)

Families Citing this family (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106534733B (zh) * 2015-09-09 2019-09-17 杭州海康威视数字技术股份有限公司 视频窗口的显示方法和装置
CN110276082B (zh) * 2019-06-06 2023-06-30 百度在线网络技术(北京)有限公司 基于动态窗口的翻译处理方法和装置
CN115086734A (zh) * 2021-03-12 2022-09-20 北京字节跳动网络技术有限公司 一种基于视频的信息展示方法、装置、设备及介质

Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102147694A (zh) * 2010-02-09 2011-08-10 康佳集团股份有限公司 一种窗口滑动的方法、系统及嵌入式设备
CN102169404A (zh) * 2010-02-26 2011-08-31 易搜比控股公司 电子装置屏幕上物件位移的显示方法

Family Cites Families (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20110173569A1 (en) * 2010-01-13 2011-07-14 Rockmelt, Inc. Preview Functionality for Increased Browsing Speed

Patent Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102147694A (zh) * 2010-02-09 2011-08-10 康佳集团股份有限公司 一种窗口滑动的方法、系统及嵌入式设备
CN102169404A (zh) * 2010-02-26 2011-08-31 易搜比控股公司 电子装置屏幕上物件位移的显示方法

Also Published As

Publication number Publication date
CN103257798A (zh) 2013-08-21

Similar Documents

Publication Publication Date Title
US11635872B2 (en) Smart carousel of image modifiers
USRE46758E1 (en) Animation of graphical objects
CN104166553B (zh) 一种显示方法及电子设备
CN106547420A (zh) 一种页面处理方法和装置
US11004249B2 (en) Hand drawn animation motion paths
US20140223271A1 (en) Systems and methods of creating an animated content item
US10055896B1 (en) Interactive vertex manipulation system and methods for geometry repair
CN103257798B (zh) 一种窗口滑动方法及装置
US11475617B2 (en) Path-constrained drawing with visual properties based on drawing tool
EP3803563A1 (en) Framework providing application programming interface for user interfaces and animation
KR101562658B1 (ko) 3차원 객체 모델링 방법 및 이를 이용한 컴퓨터 프로그램이 기록된 매체
CN111443914B (zh) 动画展示方法以及装置
EP4047456A1 (en) Method and device for predicting drawing point of stylus pen
CN103135909A (zh) 页面的显示方法、装置和终端
CN109621418B (zh) 一种游戏中虚拟角色的表情调整及制作方法、装置
EP3015970A1 (en) Method for simulating digital watercolor image and electronic device using the same
CN106339149A (zh) 一种显示控制方法、装置及电子设备
CN114581565A (zh) 动画路径可视化编辑方法、装置、计算机设备、存储介质
CN104881221B (zh) 一种滑动控制方法及触控终端
CN103460174B (zh) 增加用户界面元素
CN104049867B (zh) 一种信息处理方法及电子设备
CN106940615A (zh) 一种表格处理方法及装置、用户设备
JP5751898B2 (ja) 情報処理装置、情報処理方法、プログラム及び記憶媒体
CN114911406B (zh) 一种动效生成方法、装置、介质及设备
CN116304415A (zh) 一种基于web的数据渲染优化方法及装置

Legal Events

Date Code Title Description
C06 Publication
PB01 Publication
C10 Entry into substantive examination
SE01 Entry into force of request for substantive examination
REG Reference to a national code

Ref country code: HK

Ref legal event code: DE

Ref document number: 1184573

Country of ref document: HK

GR01 Patent grant
GR01 Patent grant
REG Reference to a national code

Ref country code: HK

Ref legal event code: GR

Ref document number: 1184573

Country of ref document: HK