一种实现图标仿车轮滚动效果的方法和装置与流程

文档序号:15736379发布日期:2018-10-23 21:33阅读:195来源:国知局

本发明涉及计算机技术领域,尤其涉及一种实现图标仿车轮滚动效果的方法和装置。



背景技术:

随着手机、平板电脑等便携式设备日益发展,涌现了越来越多的终端应用(Application)。通常使用诸如手指、触摸笔等的指示体在便携式设备的屏幕上进行切换,以寻找相应的应用。

在实现本发明过程中,发明人发现现有技术中至少存在如下问题:在屏幕的切换中,炫丽的动画效果无疑会更加吸引人,且能够为用户带来直观感受。



技术实现要素:

有鉴于此,本发明实施例提供一种实现图标仿车轮滚动效果的方法和装置,能够通过在设备的屏幕切换过程中使图标聚拢成圆形,并使该圆形以车轮状滚动前进,有助于增强显示界面的动画效果,给用户带来屏幕切换的直观感受,提高了用户体验。此外,通过圆的参数方程迅速定位各图标待显示的位置,减少了图标聚拢成圆时大量复杂的计算,从而避免了影响设备性能。

为实现上述目的,根据本发明实施例的一个方面,提供了一种实现图标仿车轮滚动效果的方法。

本发明的一种实现图标仿车轮滚动效果的方法,其特征在于,包括:当指示体按下屏幕并且未在所述屏幕上滑动时,所述图标保持在所述屏幕上的初始位置;所述图标随着所述指示体在所述屏幕上的滑动而逐步聚拢成圆形,并且由所述图标聚拢成的所述圆形随着所述指示体在所述屏幕上的继续滑动而滚动,以实现图标仿车轮滚动效果。

可选地,还包括:为待被聚拢成的圆形的圆心位置以及半径设定预定义值,将待被聚拢成的圆形的圆心的横坐标记为第一圆心横坐标,将待被聚拢成的圆形的圆心的纵坐标记为第一圆心纵坐标;当所述图标随着所述指示体在所述屏幕上的滑动而逐步聚拢成圆形时,所述圆形的圆心随着所述指示体的滑动而移动。

可选地,还包括:当所述指示体的滑动距离小于阈值距离时,所述图标并未聚拢成所述圆形;当所述指示体的滑动距离等于所述阈值距离时,所述图标聚拢成所述圆形;当所述指示体的滑动距离大于所述阈值距离时,由所述图标聚拢成的所述圆形随着所述指示体的滑动而滚动。

可选地,还包括:当所述指示体的滑动距离等于所述阈值距离时,所述图标聚拢成所述圆形,根据所述图标的数目计算所述图标在所述圆形中的旋转角度,以及横坐标与纵坐标,其中,将所述图标聚拢成所述圆形时所述图标在所述圆形中的旋转角度记为第一图标旋转角度,将所述图标聚拢成所述圆形时所述图标的横坐标记为第一图标横坐标,将所述图标聚拢成所述圆形时所述图标的纵坐标记为第一图标纵坐标,所述第一图标旋转角度被设计为使所述图标在所述圆形中按相等的角度相隔;所述第一图标横坐标为所述半径与所述图标在所述圆形中的旋转角度的余弦的乘积加上所述第一圆心横坐标;所述第一图标纵坐标为所述半径与所述图标在所述圆形中的旋转角度的正弦的乘积加上所述第一圆心纵坐标。

可选地,还包括:当所述指示体的滑动距离小于阈值距离时,所述图标并未聚拢成所述圆形,根据所述图标处于所述初始位置时的横坐标和纵坐标、所述第一图标横坐标、所述第一图标纵坐标、所述第一图标旋转角度、所述滑动距离以及所述阈值距离来计算在聚拢成所述圆形的过程中所述图标的旋转角度,以及横坐标与纵坐标,其中,将在所述图标聚拢成所述圆形的过程中所述图标的旋转角度记为第二图标旋转角度,将在所述图标聚拢成所述圆形的过程中所述图标的横坐标记为第二图标横坐标,将在所述图标聚拢成所述圆形的过程中所述图标的纵坐标记为第二图标纵坐标。

可选地,还包括:按如下步骤计算所述第二图标旋转角度、所述第二图标横坐标以及所述第二图标纵坐标,以使得所述图标沿直线进行移动并逐步聚拢成所述圆形,将所述滑动距离除以所述阈值距离记为滑动比例;将所述第一图标横坐标与所述图标处于所述初始位置时的横坐标之差记为第一差,以及将所述第一图标纵坐标与所述图标处于所述初始位置时的纵坐标之差记为第二差;将所述第一差与所述滑动比例的乘积记为第一乘积,以及将所述第二差与所述滑动比例的乘积记为第二乘积;所述第二图标横坐标为所述第一乘积与所述图标处于所述初始位置时的横坐标之和,以及所述第二图标纵坐标为所述第二乘积与所述图标处于所述初始位置时的纵坐标之和;所述第二图标旋转角度为所述滑动比例与所述第一图标旋转角度的乘积。

可选地,还包括:使得所述图标沿弧或贝塞尔曲线进行移动并逐步聚拢成所述圆形。

可选地,还包括:当所述指示体的滑动距离大于所述阈值距离时,由所述图标聚拢成的所述圆形随着所述指示体的滑动而滚动,根据所述圆形的每单位滑动距离的滚动角度、所述滑动距离、所述阈值距离、所述第一图标旋转角度以及所述第一圆心横坐标和所述第一圆心纵坐标,计算所述圆心在所述圆形的滚动的过程中的横坐标和纵坐标,以及所述图标在所述圆形的滚动的过程中在所述圆形中的在所述圆形中的旋转角度以及横坐标和纵坐标,其中,将在所述圆形的滚动的过程中所述圆心的横坐标记为第二圆心横坐标,将在所述圆形的滚动的过程中所述圆心的纵坐标记为第二圆心纵坐标,将在所述圆形的滚动的过程中所述图标在所述圆形中的旋转角度记为第三图标旋转角度,将在所述圆形的滚动的过程中所述图标的横坐标记为第三图标横坐标,将在所述圆形的滚动的过程中所述图标的纵坐标记为第三图标纵坐标:所述第二圆心横坐标为所述第一圆心横坐标加上所述滑动距离与所述阈值距离之差,以及所述第二圆心纵坐标为所述第一圆心纵坐标;所述第三图标旋转角度为所述滑动距离与所述阈值距离之差与所述圆形的每单位滑动距离的滚动角度的乘积加上所述第一图标旋转角度;所述第三图横坐标为所述半径与所述第三图标旋转角度的余弦的乘积加上所述第二圆心横坐标;所述第三图纵坐标为所述半径与所述第三图标旋转角度的正弦的乘积加上所述第二圆心纵坐标。

可选地,还包括:当所述指示体抬离所述屏幕时,所述图标恢复至所述初始位置。

为实现上述目的,根据本发明实施例的另一方面,提供了一种实现图标仿车轮滚动效果的装置。

本发明的一种实现图标仿车轮滚动效果的装置,包括显示模块、图标模块以及计算模块,其特征在于:当所述显示模块检测到指示体按下屏幕并且未在所述屏幕上滑动时,所述计算模块通过所述显示模块通知所述图标模块所述图标保持在所述屏幕上的初始位置;所述计算模块根据所述显示模块传递的所述指示体在所述屏幕上的滑动,通过所述显示模块通知所述图标模块所述图标随着所述指示体在所述屏幕上的滑动而逐步聚拢成圆形,并且由所述图标聚拢成的所述圆形随着所述指示体在所述屏幕上的继续滑动而滚动,以实现图标仿车轮滚动效果。

可选地,还包括:为待被聚拢成的圆形的圆心位置以及半径设定预定义值,将待被聚拢成的圆形的圆心的横坐标记为第一圆心横坐标,将待被聚拢成的圆形的圆心的纵坐标记为第一圆心纵坐标;当所述图标随着所述指示体在所述屏幕上的滑动而逐步聚拢成圆形时,所述计算模块确定所述圆形的圆心随着所述指示体的滑动而移动。

可选地,还包括:当所述指示体的滑动距离小于阈值距离时,所述计算模块确定所述图标并未聚拢成所述圆形;当所述指示体的滑动距离等于所述阈值距离时,所述计算模块确定所述图标聚拢成所述圆形;当所述指示体的滑动距离大于所述阈值距离时,所述计算模块确定由所述图标聚拢成的所述圆形随着所述指示体的滑动而滚动。

可选地,还包括:当所述指示体的滑动距离等于所述阈值距离时,所述计算模块确定所述图标聚拢成所述圆形,所述计算模块根据所述图标的数目计算所述图标在所述圆形中的旋转角度,以及横坐标与纵坐标,其中,将所述图标聚拢成所述圆形时所述图标在所述圆形中的旋转角度记为第一图标旋转角度,将所述图标聚拢成所述圆形时所述图标的横坐标记为第一图标横坐标,将所述图标聚拢成所述圆形时所述图标的纵坐标记为第一图标纵坐标,所述第一图标旋转角度被设计为使所述图标在所述圆形中按相等的角度相隔;所述第一图标横坐标为所述半径与所述图标在所述圆形中的旋转角度的余弦的乘积加上所述第一圆心横坐标;所述第一图标纵坐标为所述半径与所述图标在所述圆形中的旋转角度的正弦的乘积加上所述第一圆心纵坐标。

可选地,还包括:当所述指示体的滑动距离小于阈值距离时,所述计算模块确定所述图标并未聚拢成所述圆形,所述计算模块根据所述图标处于所述初始位置时的横坐标和纵坐标、所述第一图标横坐标、所述第一图标纵坐标、所述第一图标旋转角度、所述滑动距离以及所述阈值距离来计算在聚拢成所述圆形的过程中所述图标的旋转角度,以及横坐标与纵坐标,其中,将在所述图标聚拢成所述圆形的过程中所述图标的旋转角度记为第二图标旋转角度,将在所述图标聚拢成所述圆形的过程中所述图标的横坐标记为第二图标横坐标,将在所述图标聚拢成所述圆形的过程中所述图标的纵坐标记为第二图标纵坐标。

可选地,还包括:所述计算模块按如下步骤计算所述第二图标旋转角度、所述第二图标横坐标以及所述第二图标纵坐标,以使得所述图标沿直线进行移动并逐步聚拢成所述圆形,将所述滑动距离除以所述阈值距离记为滑动比例;将所述第一图标横坐标与所述图标处于所述初始位置时的横坐标之差记为第一差,以及将所述第一图标纵坐标与所述图标处于所述初始位置时的纵坐标之差记为第二差;将所述第一差与所述滑动比例的乘积记为第一乘积,以及将所述第二差与所述滑动比例的乘积记为第二乘积;所述第二图标横坐标为所述第一乘积与所述图标处于所述初始位置时的横坐标之和,以及所述第二图标纵坐标为所述第二乘积与所述图标处于所述初始位置时的纵坐标之和;所述第二图标旋转角度为所述滑动比例与所述第一图标旋转角度的乘积。

可选地,还包括:所述计算模块使得所述图标沿弧或贝塞尔曲线进行移动并逐步聚拢成所述圆形。

可选地,还包括:当所述指示体的滑动距离大于所述阈值距离时,所述计算模块确定由所述图标聚拢成的所述圆形随着所述指示体的滑动而滚动,所述计算模块根据所述圆形的每单位滑动距离的滚动角度、所述滑动距离、所述阈值距离、所述第一图标旋转角度以及所述第一圆心横坐标和所述第一圆心纵坐标,计算所述圆心在所述圆形的滚动的过程中的横坐标和纵坐标,以及所述图标在所述圆形的滚动的过程中在所述圆形中的旋转角度以及横坐标和纵坐标,其中,将在所述圆形的滚动的过程中所述圆心的横坐标记为第二圆心横坐标,将在所述圆形的滚动的过程中所述圆心的纵坐标记为第二圆心纵坐标,将在所述圆形的滚动的过程中所述图标在所述圆形中的旋转角度记为第三图标旋转角度,将在所述圆形的滚动的过程中所述图标的横坐标记为第三图标横坐标,将在所述圆形的滚动的过程中所述图标的纵坐标记为第三图标纵坐标:所述第二圆心横坐标为所述第一圆心横坐标加上所述滑动距离与所述阈值距离之差,以及所述第二圆心纵坐标为所述第一圆心纵坐标;所述第三图标旋转角度为所述滑动距离与所述阈值距离之差与所述圆形的每单位滑动距离的滚动角度的乘积加上所述第一图标旋转角度;所述第三图横坐标为所述半径与所述第三图标旋转角度的余弦的乘积加上所述第二圆心横坐标;所述第三图纵坐标为所述半径与所述第三图标旋转角度的正弦的乘积加上所述第二圆心纵坐标。

可选地,还包括:当所述显示模块检测到所述指示体抬离所述屏幕时,所述计算模块通过所述显示模块通知所述图标模块所述图标恢复至所述初始位置。

根据本发明实施例的又一方面,提供了一种电子设备。

本发明的一种电子设备包括:一个或多个处理器;存储装置,用于存储一个或多个程序,当所述一个或多个程序被所述一个或多个处理器执行,使得所述一个或多个处理器能够执行实现本发明所提供的实现图标仿车轮滚动效果的方法。

根据本发明实施例的再一方面,提供了一种计算机可读介质。

本发明的一种计算机可读介质存储有计算机程序,其特征在于,所述程序被处理器执行时执行本发明所提供的实现图标仿车轮滚动效果的方法。

上述发明中的一个实施例具有如下优点或有益效果:因为采用在设备的屏幕切换过程中使图标聚拢成圆形并使该圆形以车轮状滚动前进的技术手段,所以克服了显示界面呆板的技术问题,进而达到增强显示界面的动画效果并提高用户体验的技术效果。此外,通过圆的参数方程迅速定位各图标待显示的位置,减少了图标聚拢成圆时大量复杂的计算,从而避免了影响设备性能。

附图说明

附图用于更好地理解本发明,不构成对本发明的不当限定。其中:

图1是根据本发明实施例的随着指示体的滑动图标聚拢成圆形并且圆形滚动的流程图;

图2是根据本发明实施例的由图标聚拢成的圆形的坐标图;

图3是根据本发明实施例的由图标聚拢成的圆形发生滚动的坐标图;

图4是根据本发明实施例的图标处于初始位置的示意图;

图5是根据本发明实施例的图标随着指示体滑动而逐步聚拢成圆形的示意图;

图6是根据本发明实施例的由图标聚拢成的圆形的示意图;

图7是根据本发明实施例的由图标聚拢成的圆形发生滚动的示意图;

图8是根据本发明实施例的实现图标仿车轮滚动效果的装置的示意图;

图9是适于用来实现本申请实施例的终端设备或服务器的计算机系统的结构示意图。

具体实施方式

以下结合附图对本发明的示范性实施例做出说明,其中包括本发明实施例的各种细节以助于理解,应当将它们认为仅仅是示范性的。因此,本领域普通技术人员应当认识到,可以对这里描述的实施例做出各种改变和修改,而不会背离本发明的范围和精神。同样,为了清楚和简明,以下的描述中省略了对公知功能和结构的描述。

图1是根据本发明实施例的随着指示体的滑动图标聚拢成圆形并且圆形滚动的流程图。如图1所示,在本实施例中,用户操作分为三种类型:按下(诸如用户手指的指示体刚刚触摸屏幕),滑动(诸如用户手指的指示体在屏幕上进行滑动),抬离(诸如用户手指的指示体离开屏幕)。三种类型对应于图1中的不同的处理逻辑。

在本实施例中,当诸如手指等的指示体按下屏幕但未滑动时,屏幕上的图标依然保持在初始位置,例如保持在常规的横排布置中。当诸如手指等的指示体在屏幕上进行滑动时,屏幕上的图标将随着指示体在屏幕上的滑动而逐步聚拢成圆形。具体地,当滑动距离小于图标聚拢成圆形所需滑动的阈值距离时,将计算各图标的旋转角度以及作为坐标位置的横坐标和纵坐标,并使图标按照所计算的结果进行移动;直至当滑动距离等于该阈值距离时,图标聚拢成圆形;当滑动距离大于该阈值距离时,即图标聚拢成圆形后,将计算该圆形的圆心的新坐标位置以及相应各图标的旋转角度和新坐标位置,并使该圆形按照所计算的结果进行滚动。当诸如手指等的指示体从屏幕上抬离时,在本实施例中,各图标恢复至初始位置,例如恢复成在常规的横排布置中。

在本实施例中,当滑动距离等于该阈值距离时,由各个图标聚拢成的圆形的圆心位置以及半径在屏幕上为预定义值,因而所聚拢成的圆形是固定的,而圆形上各图标的旋转角度和坐标位置与图标的数目有关。将根据公式1,确定各图标的坐标位置:

x1=x0+r×cos(θ1)

y1=y0+r×sin(θ1)

公式1

其中,x0是圆心的横坐标,y0是圆心的纵坐标,本文中,为简洁起见,也将其分别称为第一圆心横坐标和第一圆心纵坐标。x1是图标聚拢成圆形时相应图标的横坐标,y1是图标聚拢成圆形时相应图标的纵坐标,本文中,为简洁起见,也将其分别称为第一图标横坐标和第一图标纵坐标。θ1表示形成圆形时各图标在圆形中的旋转角度,该旋转角度以水平向右为起始边、逆时针为正角度,本文中,为简洁起见,也将其称为第一图标旋转角度。r为待被聚拢成的圆形的半径。如上所述,在本实施例中,圆形半径、第一圆心横坐标和第一圆心纵坐标在所述屏幕上为预定义值。

将根据公式1,确定各图标的第一图标旋转角度。假设当前屏幕上共有N个图标,在本实施例中,为使各图标在待被聚拢成的圆形中按相等的角度相隔,则各图标的第一图标旋转角度如公式2所示:

公式2

即将圆形平均分成N等份,每份的角度,即第一图标旋转角度θ1取上述N个值。

以上,根据公式1和公式2,可计算出各图标聚拢成圆形时的坐标位置以及在圆形中旋转角度。

具体地,如果用户操作是在S110中用户通过指示体按下屏幕但并未进行滑动,则在S111中,图标保持在初始位置,例如保持在常规的横排布置中。

在S120中,用户通过指示体在屏幕上进行滑动。

在S121中,根据滑动距离是否小于图标聚拢成圆形所需滑动的阈值距离来判断图标是否聚拢成圆形。当滑动距离小于阈值距离时,在S122中,图标开始移动,但尚未聚拢成圆形。根据公式3计算在图标聚拢成圆形的过程在图标的坐标位置:

x2=(x1-xs)×currD/d+xs

y2=(y1-ys)×currD/d+ys

公式3

其中,x1为图标聚拢成圆形时的横坐标,即为第一图标横坐标,y1为图标聚拢成圆形时的纵坐标,即为第一图标纵坐标;xs为图标处于初始位置时的横坐标,ys为图标处于初始位置时的纵坐标;currD为当前指示体的滑动距离,d为图标聚拢成圆形所需滑动的阈值距离,在S122的场景中,currD<d;x2为在图标聚拢成圆形的过程中图标的横坐标,y2为在图标聚拢成圆形的过程中图标的纵坐标,本文中,为简洁起见,也将其分别称为第二图标横坐标和第二图标纵坐标。

根据公式4计算在图标聚拢成圆形的过程在图标的旋转角度:

θ2=currD/d×θ1

公式4

其中,如上所述,currD为当前指示体的滑动距离,d为图标聚拢成圆形所需滑动的阈值距离,在S122的场景中,currD<d;θ1为图标聚拢成圆形时在圆形中的旋转角度,即为第一图标旋转角度;θ2为在图标聚拢成圆形的过程中图标的旋转角度,本文中,为简洁起见,将其称为第二图标旋转角度。

可见,在S122中,根据滑动比例计算各图标的旋转角度和坐标位置,并使图标按计算结果移动。此外,在本实施例中,各图标沿直线进行移动并聚拢成圆形,但本发明不限于此,也可以使各图标模块沿弧、贝塞尔曲线等进行移动并聚拢成圆形。

在S124中,即在S121和S123中均为“是”的分支,当滑动距离等于阈值距离时,图标聚拢成圆形。即,在S124的场景中,currD=d,此时根据公式3和公式4,x2=x1,y2=y1,θ2=θ1。根据公式2和公式1分别计算图标在聚拢成的圆形时在圆形中的旋转角度,以及横坐标与纵坐标。在本实施中,可选地,可以在用户按下屏幕时,即在S111中,便计算待聚拢成圆时各图标的旋转角度,以及横坐标与纵坐标。

图2是根据本发明实施例的由图标聚拢成的圆形的坐标图。如图2所示,F点代表处于初始位置的图标,F点代表聚拢成圆形时该图标的位置。可见,图标以固定点为圆心,绕固定半径分布于该圆形的圆周上。为简洁起见,将每一个图标假设成一个点,但具体的技术构思并不会因为将图标转变为点而有所不同,也不会导致结果的不正确。

在S125中,即在S121中为是在S123中为“否”的分支,当滑动距离大于阈值距离时,此时需计算圆心的新坐标位置以及图标的旋转角度和坐标位置,以使该圆形按计算结果滚动。根据公式5计算圆心在圆形滚动的过程中的坐标位置:

x′0=x0+currD-d

y′0=y0

公式5

其中,x0为第一圆心横坐标,y0为第一圆心纵坐标;x′0为圆心滚动过程中圆心的横坐标,y′0为圆心滚动过程中圆心的纵坐标,本文中,为简洁起见,也将其分别称为第二圆心横坐标和第二圆心纵坐标;currD为当前指示体的滑动距离,d为图标聚拢成圆形所需滑动的阈值距离,在S125的场景中,currD>d。根据公式5,可以看出圆心按直线平移。

根据公式6计算图标在滚动的圆形中的旋转角度:

公式6

其中,θ1是第一图标旋转角度;θ3是在圆形的滚动的过程中图标在该圆形中的旋转角度,本文中,为简洁起见,也将其称为第三图标旋转角度;currD为当前指示体的滑动距离,d为图标聚拢成圆形所需滑动的阈值距离,在S125的场景中,currD>d;为圆形的每单位滑动距离的滚动角度,例如为指示体每平移1像素时圆形的相应滚动角度,相应地,此时currD与d的单位也为像素。

可根据公式1计算在圆形的滚动的过程中图标的横坐标和纵坐标,但此时应采用(x′0,y′0)作为圆心坐标,并且应采用θ3作为图标在圆形中的旋转角度。即,将公式1改写为如下的公式7:

x3=x′0+r×cos(θ3)

y3=y′0+r×sin(θ3)

公式7

其中,x′0为第二圆心横坐标,y′0为第二圆心纵坐标,θ3为第三图标旋转角度,x3为圆形的滚动的过程中图标的横坐标,y3为圆形的滚动的过程中图标的纵坐标,本文中,为简洁起见,也将其分别称为第三图标横坐标和第三图标纵坐标。

图3是根据本发明实施例的由图标聚拢成的圆形发生滚动的坐标图。其中实线圆表示尚未进行滚动的由图标初始聚拢成的圆形,而虚线则表示随着指示体水平向左滑动而滚动的圆形。如图3所示,B点代表聚拢成圆形时图标的位置,E点代表该圆形滚动时该图标的位置。为简洁起见,将每一个图标假设成一个点,但具体的技术构思并不会因为将图标转变为点而有所不同,也不会导致结果的不正确。如图3所示,随着指示体的滑动距离增大,代表圆心的A点逐渐沿x轴负方向平移到C点,而代表图标的B点移动到E点——但此时不是沿直线移动。根据图1的步骤S125所述,当指示体的滑动距离为currD(currD>d)时,A点的坐标是(x0,y0),C点的坐标是(x′0,y′0),射线AB沿顺时针方向与x轴正方向夹角为θ1,射线CE沿顺时针方向与x轴正方向夹角为θ3。

在S126中,诸如手指的指示体从屏幕上抬离。

在S127中,图标恢复至初始位置,例如,恢复至常规的横排布置中。在本实施例中,指示体从屏幕上抬离时,将图标的旋转角度设为0度,将横轴(x轴)和纵轴(y轴)的平移距离也设置为0,并通过动画完成此过程。

图4至图7是根据本发明实施例的根据不同的用户操作图标处于不同位置的示意图。

图4是根据本发明实施例的图标处于初始位置的示意图,即指示体刚刚按下屏幕并且尚未滑动时以及指示体从屏幕上抬离时的示意图。在本实施例中,图标的初始位置为横排布置。

图5是根据本发明实施例的图标随着指示体滑动而逐步聚拢成圆形的示意图。随着指示体的滑动,在滑动距离小于阈值距离时,各图标根据滑动比例逐步移动到聚拢成圆的位置。

图6是根据本发明实施例的由图标聚拢成的圆形的示意图。当指示体的滑动距离等于阈值距离时,图标聚拢成圆。

图7是根据本发明实施例的由图标聚拢成的圆形发生滚动的示意图。当指示体的滑动距离大于阈值距离时,由图标聚拢成的圆随着指示体的滑动而滚动,各图标也随之一起旋转。

图8是根据本发明实施例的实现图标仿车轮滚动效果的装置的示意图。实现图标仿车轮滚动效果的装置包括计算模块、显示模块以及图标模块。

显示模块可被认为是供外界使用的控件,对外界传入的图标进行显示,以及响应于诸如用户触摸事件的用户操作,包括按下屏幕、滑动屏幕、从屏幕抬离等。并根据计算模块所计算的图标的坐标位置及旋转角度来向用户提供整体屏幕显示。

计算模块的主要作用有:由显示模块调用,计算出当滑动距离等于阈值距离时各图标聚拢成圆形时的旋转角度以及作为坐标位置的横坐标和纵坐标;在聚拢成圆的过程中,即滑动距离小于阈值距离时,根据当前滑动距离的比例,计算各图标的旋转角度与坐标位置;在聚拢成圆后,即滑动距离大于阈值距离时,随着滑动距离的增大,不断修正各图标的旋转角度与坐标位置,以及圆心的坐标位置。

在上述场境中,计算模块将上述值传递给显示模块,再由显示模块传递给图标模块,以进行图标位置调整。图标模块根据显示模块传入的图标的旋转角度和坐标位置,使图标相应移动。

具体地,当显示模块检测到指示体按下屏幕并且未在屏幕上滑动时,计算模块通过显示模块通知图标模块将图标保持在初始位置;计算模块根据显示模块传递的指示体在屏幕上的滑动,通过显示模块通知图标模块图标应随着指示体在屏幕上的滑动而逐步聚拢成圆形,并且由图标聚拢成的圆形应随着指示体在屏幕上的继续滑动而滚动,以实现图标仿车轮滚动效果;当显示模块检测到指示体抬离屏幕时,计算模块通过显示模块通知图标模块将图标恢复至初始位置。

下面参考图9,其示出了适于用来实现本申请实施例的终端设备的计算机系统900的结构示意图。图9示出的终端设备仅仅是一个示例,不应对本申请实施例的功能和使用范围带来任何限制。

如图9所示,计算机系统900包括中央处理单元(CPU)901,其可以根据存储在只读存储器(ROM)902中的程序或者从存储部分908加载到随机访问存储器(RAM)903中的程序而执行各种适当的动作和处理。在RAM 903中,还存储有系统900操作所需的各种程序和数据。CPU 901、ROM 902以及RAM 903通过总线904彼此相连。输入/输出(I/O)接口905也连接至总线904。

以下部件连接至I/O接口905:包括键盘、鼠标等的输入部分906;包括诸如阴极射线管(CRT)、液晶显示器(LCD)等以及扬声器等的输出部分907;包括硬盘等的存储部分908;以及包括诸如LAN卡、调制解调器等的网络接口卡的通信部分909。通信部分909经由诸如因特网的网络执行通信处理。驱动器910也根据需要连接至I/O接口905。可拆卸介质911,诸如磁盘、光盘、磁光盘、半导体存储器等等,根据需要安装在驱动器910上,以便于从其上读出的计算机程序根据需要被安装入存储部分908。

特别地,根据本发明公开的实施例,上文参考流程图描述的过程可以被实现为计算机软件程序。例如,本发明公开的实施例包括一种计算机程序产品,其包括承载在计算机可读介质上的计算机程序,该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中,该计算机程序可以通过通信部分909从网络上被下载和安装,和/或从可拆卸介质911被安装。在该计算机程序被中央处理单元(CPU)901执行时,执行本申请的系统中限定的上述功能。

需要说明的是,本申请所示的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件,或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于:具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本申请中,计算机可读存储介质可以是任何包含或存储程序的有形介质,该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本申请中,计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号,其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式,包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质,该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输,包括但不限于:无线、电线、光缆、RF等等,或者上述的任意合适的组合。

附图中的流程图和框图,图示了按照本申请各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上,流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分,上述模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意,在有些作为替换的实现中,方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如,两个接连地表示的方框实际上可以基本并行地执行,它们有时也可以按相反的顺序执行,这依所涉及的功能而定。也要注意的是,框图或流程图中的每个方框、以及框图或流程图中的方框的组合,可以用执行规定的功能或操作的专用的基于硬件的系统来实现,或者可以用专用硬件与计算机指令的组合来实现。

描述于本申请实施例中所涉及到的模块可以通过软件的方式实现,也可以通过硬件的方式来实现。所描述的模块也可以设置在处理器中,例如,可以描述为:一种处理器包括显示模块、图标模块和计算模块。其中,这些模块的名称在某种情况下并不构成对该模块本身的限定,例如,显示模块还可以被描述为“供外界使用以对外界传入的图标进行显示的模块”。

作为另一方面,本申请还提供了一种计算机可读介质,该计算机可读介质可以是上述实施例中描述的设备中所包含的;也可以是单独存在,而未装配入该设备中。上述计算机可读介质承载有一个或者多个程序,当上述一个或者多个程序被一个该设备执行时,使得该设备包括:当指示体按下屏幕并且未在屏幕上滑动时,图标保持在屏幕上的初始位置;图标随着指示体在屏幕上的滑动而逐步聚拢成圆形,并且由图标聚拢成的圆形随着指示体在屏幕上的继续滑动而滚动,以实现图标仿车轮滚动效果。

根据本发明实施例的技术方案,因为采用在设备的屏幕切换过程中使图标聚拢成圆形并使该圆形以车轮状滚动前进的技术手段,所以克服了显示界面呆板的技术问题,进而达到增强显示界面的动画效果并提高用户体验的技术效果。此外,通过圆的参数方程迅速定位各图标待显示的位置,减少了图标聚拢成圆时大量复杂的计算,从而避免了影响设备性能。

上述具体实施方式,并不构成对本发明保护范围的限制。本领域技术人员应该明白的是,取决于设计要求和其他因素,可以发生各种各样的修改、组合、子组合和替代。任何在本发明的精神和原则之内所作的修改、等同替换和改进等,均应包含在本发明保护范围之内。

当前第1页1 2 3 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1