CN106598439A - 条目滚动过程中的显示方法及装置 - Google Patents

条目滚动过程中的显示方法及装置 Download PDF

Info

Publication number
CN106598439A
CN106598439A CN201611142950.3A CN201611142950A CN106598439A CN 106598439 A CN106598439 A CN 106598439A CN 201611142950 A CN201611142950 A CN 201611142950A CN 106598439 A CN106598439 A CN 106598439A
Authority
CN
China
Prior art keywords
entry
animation frame
displacement
time period
animation
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.)
Granted
Application number
CN201611142950.3A
Other languages
English (en)
Other versions
CN106598439B (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.)
Shenzhen TCL New Technology Co Ltd
Shenzhen TCL Digital Technology Co Ltd
Original Assignee
Shenzhen TCL New 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 Shenzhen TCL New Technology Co Ltd filed Critical Shenzhen TCL New Technology Co Ltd
Priority to CN201611142950.3A priority Critical patent/CN106598439B/zh
Publication of CN106598439A publication Critical patent/CN106598439A/zh
Application granted granted Critical
Publication of CN106598439B publication Critical patent/CN106598439B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

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/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
    • G06F3/04855Interaction with scrollbars
    • 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/04847Interaction techniques to control parameter settings, e.g. interaction with sliders or dials

Abstract

本发明公开了一种条目滚动过程中的显示方法及装置,该方法包括:在接收到预设触发操作时,确定条目本次滚动对应的总移动位移以及本次滚动过程中所需播放的动画帧的数量;分别确定每一动画帧中所需显示的各个条目的显示位置,并根据确定的各个显示位置排布每一动画帧中所需显示的各个条目,以生成各个动画帧;依次播放生成的各个动画帧;其中,最后播放的动画帧中的每一条目的位置相对于该条目在滚动前的初始位置的位移均为总移动位移。由于在同一动画帧中的各个条目对应的显示位置是分别计算的,从而能够在条目滚动的过程中,实现各个条目之间独立滚动,进而实现条目滚动的动画效果,本发明条目滚动方式更加灵活,提高了用户体验效果。

Description

条目滚动过程中的显示方法及装置
技术领域
本发明涉及计算机技术领域,尤其涉及一种条目滚动过程中的显示方法及装置。
背景技术
目前,在电子设备中通常会有大量的场景需要显示若干个条目,例如,电视机上需要显示电视机列表条目,手机上的通话应用中需要显示联系人条目,手机上的微信应用中需要显示通讯录联系人条目等等。而由于电子设备的屏幕大小有限,无法同时显示所有条目,只能显示部分条目,用户可以通过触发遥控按键或者滑动触摸屏幕的方式使得条目滚动,实现对条目的翻页功能。现有技术中,在条目滚动的过程中,一般在用户触发后则各个条目立即整体平行向上或向下滚动,滚动方式较为单一,用户体验效果较差。
发明内容
本发明的主要目的在于提供一种条目滚动过程中的显示方法及装置,旨在使得条目滚动方式更加灵活,提高用户体验效果。
本发明提供的条目滚动过程中的显示方法包括:
在接收到预设触发操作时,确定条目本次滚动对应的总移动位移以及本次滚动过程中所需播放的动画帧的数量;
分别确定每一所述动画帧中所需显示的各个条目的显示位置,并根据确定的各个显示位置排布每一所述动画帧中所需显示的各个条目,以生成各个所述动画帧;
依次播放生成的各个所述动画帧;
其中,最后播放的动画帧中的每一条目的位置相对于该条目在滚动前的初始位置的位移均为所述总移动位移。
可选的,所述分别确定每一所述动画帧中所需显示的各个条目的显示位置的步骤包括:
在确定第一个播放的动画帧时,依次遍历在滚动前的显示区域内显示的各个条目以及即将进入所述显示区域的各个条目;或者,在确定第二个及之后播放的各个动画帧时,依次遍历在前一动画帧对应的显示区域内显示的各个条目以及即将进入所述显示区域的各个条目;
利用预设的插值算法依次计算遍历的各个条目在当前确定的动画帧中的显示位置。
可选的,所述预设的插值算法为:mx=S×(x-A)/F,其中,mx为第x个动画帧中的各个条目相对于其滚动前的初始位置的位移;S为所述总移动位移;A为常数;F与A之和为所述动画帧的数量;
其中,在A<0时,F>-A;
在x-A≤0时,mx=0。
可选的,所述利用预设的插值算法依次计算遍历的各个条目在当前确定的动画帧中的显示位置的步骤包括:
在遍历的各个条目中选取焦点条目;
计算所述焦点条目和非焦点条目在当前确定的动画帧中的显示位置;
其中,将播放动画帧的时间段划分为第一时间段和第二时间段,在所述第一时间段播放的各个动画帧中,所述焦点条目的位移大于其预设周边范围内的各个非焦点条目的位移;在所述第二时间段播放的各个动画帧中,所述焦点条目的位移小于其周边范围内的各个非焦点条目的位移。
可选的,所述利用预设的插值算法依次计算遍历的各个条目在当前确定的动画帧中的显示位置的步骤包括:
在遍历的各个条目中确定位于奇数行的条目和位于偶数行的条目;
计算所述位于奇数行的条目和位于偶数行的条目在当前确定的动画帧中的显示位置;
其中,将播放动画帧的时间段划分为第三时间段和第四时间段,在所述第三时间段播放的各个动画帧中,所述位于奇数行的条目的位移大于所述位于偶数行的条目的位移;在所述第四时间段播放的各个动画帧中,所述位于奇数行的条目的位移小于所述位于偶数行的条目的位移。
此外,本发明进一步提供的条目滚动过程中的显示装置包括:
确定模块,用于在接收到预设触发操作时,确定条目本次滚动对应的总移动位移以及本次滚动过程中所需播放的动画帧的数量;
生成模块,用于分别确定每一所述动画帧中所需显示的各个条目的显示位置,并根据确定的各个显示位置排布每一所述动画帧中所需显示的各个条目,以生成各个所述动画帧;
播放模块,用于依次播放生成的各个所述动画帧;
其中,最后播放的动画帧中的每一条目的位置相对于该条目在滚动前的初始位置的位移均为所述总移动位移。
可选的,所述生成模块包括:
遍历单元,用于在确定第一个播放的动画帧时,依次遍历在滚动前的显示区域内显示的各个条目以及即将进入所述显示区域的各个条目;或者,在确定第二个及之后播放的各个动画帧时,依次遍历在前一动画帧对应的显示区域内显示的各个条目以及即将进入所述显示区域的各个条目;
位置计算单元,用于利用预设的插值算法依次计算遍历的各个条目在当前确定的动画帧中的显示位置。
可选的,所述预设的插值算法为:mx=S×(x-A)/F,其中,mx为第x个动画帧中的各个条目相对于其滚动前的初始位置的位移;S为所述总移动位移;A为常数;F与A之和为所述动画帧的数量;
其中,在A<0时,F>-A;
在x-A≤0时,mx=0。
可选的,所述位置计算单元包括:
选取子单元,用于在遍历的各个条目中选取焦点条目;
第一计算子单元,用于计算所述焦点条目和非焦点条目在当前确定的动画帧中的显示位置;
其中,将播放动画帧的时间段划分为第一时间段和第二时间段,在所述第一时间段播放的各个动画帧中,所述焦点条目的位移大于其预设周边范围内的各个非焦点条目的位移;在所述第二时间段播放的各个动画帧中,所述焦点条目的位移小于其周边范围内的各个非焦点条目的位移。
可选的,所述位置计算单元包括:
确定子单元,用于在遍历的各个条目中确定位于奇数行的条目和位于偶数行的条目;
第二计算子单元,用于计算所述位于奇数行的条目和位于偶数行的条目在当前确定的动画帧中的显示位置;
其中,将播放动画帧的时间段划分为第三时间段和第四时间段,在所述第三时间段播放的各个动画帧中,所述位于奇数行的条目的位移大于所述位于偶数行的条目的位移;在所述第四时间段播放的各个动画帧中,所述位于奇数行的条目的位移小于所述位于偶数行的条目的位移。
本发明提供的条目滚动过程中的显示方法及装置,通过在接收到预设触发操作时,确定条目本次滚动对应的总移动位移以及本次滚动过程中所需播放的动画帧的数量,并分别确定每一所述动画帧中所需显示的各个条目的显示位置,并根据确定的各个显示位置排布每一所述动画帧中所需显示的各个条目,以生成各个所述动画帧,最后依次播放生成的各个所述动画帧。由于在同一动画帧中的各个条目对应的显示位置是分别计算的,从而能够在条目滚动的过程中,实现各个条目之间独立滚动,进而实现条目滚动的动画效果,本发明条目滚动方式更加灵活,提高了用户体验效果。
附图说明
图1为本发明条目滚动过程中的显示方法第一实施例的流程示意图;
图2为本发明条目滚动过程中的显示装置第一实施例的功能模块示意图;
图3为本发明条目滚动过程中的显示装置第二实施例中生成模块的细化功能模块示意图;
图4为本发明条目滚动过程中的显示装置第二实施例中位置计算单元的第一细化功能模块示意图;
图5为本发明条目滚动过程中的显示装置第二实施例中位置计算单元的第二细化功能模块示意图。
本发明目的的实现、功能特点及优点将结合实施例,参照附图做进一步说明。
具体实施方式
应当理解,此处所描述的具体实施例仅仅用以解释本发明,并不用于限定本发明。
本发明提供一种条目滚动过程中的显示方法,该方法可以应用于电视机、手机、平板电脑等终端。参照图1,图1为本发明条目滚动过程中的显示方法第一实施例的流程示意图,本发明提出的条目滚动过程中的显示方法包括:
步骤S10,在接收到预设触发操作时,确定条目本次滚动对应的总移动位移以及本次滚动过程中所需播放的动画帧的数量;
在本实施例中,预设触发操作可以为用户按下了预设的按键或控件。例如,用户按下了向下键或向上键。预设触发操作还可以为用户对触摸屏幕输入了预设的滑动触摸操作,例如,滑动触摸方式为向下滑动或向上滑动。
可选的,可以预设有触发操作与总移动位移的映射关系。
例如,用户每按一次向下键,则对应的总移动位移为S。用户每按一次向上键,则对应的总移动位移为-S。可以理解的是,S为位移,具有方向性,显示于屏幕上的方式例如可以为:S对应的移动方向为向下移动,-S对应的移动方向为向上移动。
例如,映射关系还可以为,用户每向下滑动一次,则对应的总移动位移为S。用户每向上滑动一次,则对应的总移动位移为-S。可以理解的是,S为位移,具有方向性,显示于屏幕上的方式例如可以为:S对应的移动方向为向下移动,-S对应的移动方向为向上移动。
本次滚动过程中所需播放的动画帧的数量可以成为动画帧率。可选的,还可以确定动画时长T,即,动画播放的总时长为T。此处的动画帧率不同于刷新帧率。刷新帧率跟系统性能有关,比如常见的每秒60帧。而本实施例的动画帧率,是跟动画的显示速度相关。如在时长T内,显示的动画帧的数量即为动画帧率。
步骤S20,分别确定每一所述动画帧中所需显示的各个条目的显示位置,并根据确定的各个显示位置排布每一所述动画帧中所需显示的各个条目,以生成各个所述动画帧;
在本实施例中,在同一动画帧中的各个条目对应的显示位置是分别计算的,可以使得除最后播放的动画帧以外的其他各个动画帧中,位于同一动画帧中的各个条目的位移不同。
可以理解的是,在本实施例及以下各个实施例中,条目在某一动画帧中的位移均指该条目在该动画帧中的相对于该条目在滚动前的初始位置的位移,即,条目的位移均以条目在滚动前的初始位置为参考点。
步骤S30,依次播放生成的各个所述动画帧;
其中,最后播放的动画帧中的每一条目的位置相对于该条目在滚动前的初始位置的位移均为所述总移动位移。
在本实施例中,在播放动画帧完成后,各个条目相对于各自的初始位置的位移均为总移动位移,从而保证了在滚动完成后各个条目之间的相对位置不发生变化,进而完成了条目的滚动。
本发明提供的条目滚动过程中的显示方法,通过在接收到预设触发操作时,确定条目本次滚动对应的总移动位移以及本次滚动过程中所需播放的动画帧的数量,并分别确定每一所述动画帧中所需显示的各个条目的显示位置,并根据确定的各个显示位置排布每一所述动画帧中所需显示的各个条目,以生成各个所述动画帧,最后依次播放生成的各个所述动画帧。由于在同一动画帧中的各个条目对应的显示位置是分别计算的,从而能够在条目滚动的过程中,实现各个条目之间独立滚动,进而实现条目滚动的动画效果,本发明条目滚动方式更加灵活,提高了用户体验效果。
进一步地,基于本发明条目滚动过程中的显示方法的第一实施例,本发明还提出了条目滚动过程中的显示方法的第二实施例,所述分别确定每一所述动画帧中所需显示的各个条目的显示位置的步骤包括:
在确定第一个播放的动画帧时,依次遍历在滚动前的显示区域内显示的各个条目以及即将进入所述显示区域的各个条目;或者,在确定第二个及之后播放的各个动画帧时,依次遍历在前一动画帧对应的显示区域内显示的各个条目以及即将进入所述显示区域的各个条目;
利用预设的插值算法依次计算遍历的各个条目在当前确定的动画帧中的显示位置。
在本实施例中,在确定第一个播放的动画帧时,根据滚动方向确定即将进入显示区域内的各个条目。例如,若条目需要向上滚动,则即将进入显示区域内的条目即为位于在滚动前的显示区域下方的条目;若条目需要向下滚动,则即将进入显示区域内的条目即为位于在滚动前的显示区域上方的条目。
在确定第二个及之后播放的各个动画帧时,根据滚动方向确定即将进入显示区域内的各个条目。例如,若条目需要向上滚动,则即将进入显示区域内的条目即为位于前一动画帧对应的显示区域下方的条目;若条目需要向下滚动,则即将进入显示区域内的条目即为位于前一动画帧对应的显示区域上方的条目。
可选的,所述即将进入所述显示区域的各个条目的数量可以根据实际需要进行确定。例如,可以为预设值,也可以根据滚动速度确定。
预设的插值算法可以根据实际需要进行设置。不同的插值算法可以使得滚动过程中显示不同的动画效果,使得条目的滚动方式更加灵活,提高用户的体验效果。可选的,可以启动一个后台线程,循环N次刷新动画,N为确定的动画帧的数量,每个动画帧的显示时长为T/N。以下提出三种插值方式:
方式一,所述预设的插值算法为:mx=S×(x-A)/F,其中,mx为第x个动画帧中的各个条目相对于其滚动前的初始位置的位移;S为所述总移动位移;A为常数;F与A之和为所述动画帧的数量;
其中,在A<0时,F>-A;
在x-A≤0时,mx=0。
在本实施方式中,由于已经确定了动画帧的数量,所以在确定A和F时,只需要保证在A<0时,F>-A,且A与F之和等于之前确定好的动画帧的数量即可。
例如,假设确定好的动画帧的数量为8,则可以设置A=-2,F=10,则mx=S×(x+2)/10,因此,对于第一个动画帧,条目的位移为m1=3S/10;对于第二个动画帧,条目的位移为m2=4S/10;直至第八个动画帧,条目的位移为m8=10S/10=S。因此动画帧的数量为A+F=8。
例如,假设确定好的动画帧的数量为13,则可以设置A=3,F=10,则mx=S×(x-3)/10,因此,对于第一个、第二个以及第三个动画帧,由于x≤3,因此,x-3≤0,因此mx=0,即各个条目的位置保持不动。对于第四个动画帧,条目的位移为m4=S/10;对于第五个动画帧,条目的位移为m5=2S/10;直至第十三个动画帧,条目的位移为m13=10S/10=S。因此动画帧的数量为A+F=13。
本实施例提供的插值算法,在A大于0时,用户在输入触发操作后,可以使得条目出现延迟滚动效果;在A小于0时,用户输入触发操作后,可以使得条目出现跳跃滚动效果。
方式二,所述利用预设的插值算法依次计算遍历的各个条目在当前确定的动画帧中的显示位置的步骤包括:
在遍历的各个条目中选取焦点条目;
计算所述焦点条目和非焦点条目在当前确定的动画帧中的显示位置;
其中,将播放动画帧的时间段划分为第一时间段和第二时间段,在所述第一时间段播放的各个动画帧中,所述焦点条目的位移大于其预设周边范围内的各个非焦点条目的位移;在所述第二时间段播放的各个动画帧中,所述焦点条目的位移小于其周边范围内的各个非焦点条目的位移。
在本实施例中,焦点条目可以为默认的。例如,可以默认为居中的条目。或者,焦点条目还可以由用户指定,例如,用户可以用手指触摸显示区域中显示的某一条目,即可将用户触摸区域对应的条目设置为焦点条目。
可选的,第一时间段和第二时间段可以根据各个时间段内需要播放的动画帧的数量设置。
例如,假设焦点条目位于第三行,条目的总数量为5个,确定的动画帧的数量为6,则可以将前三个动画帧的条目位移设置为:在每一动画帧中(前三个动画帧中的任一动画帧),焦点条目的位移大于其他任一条目的位移,且第二行条目的位移大于第一行条目的位移,第四行条目的位移大于第五行条目的位移。同样的,可以将后三个动画帧的条目位移设置为:在每一动画帧中(后三个动画帧中的任一动画帧),焦点条目的位移小于其他任一条目的位移,且第二行条目的位移小于第一行条目的位移,第四行条目的位移小于第五行条目的位移。最终,对于最后一个动画帧,各个条目的总移动位移均相等。本实施例提供的插值方式,使得条目在滚动过程中能够呈现焦点跟随动画效果。
方式三,所述利用预设的插值算法依次计算遍历的各个条目在当前确定的动画帧中的显示位置的步骤包括:
在遍历的各个条目中确定位于奇数行的条目和位于偶数行的条目;
计算所述位于奇数行的条目和位于偶数行的条目在当前确定的动画帧中的显示位置;
其中,将播放动画帧的时间段划分为第三时间段和第四时间段,在所述第三时间段播放的各个动画帧中,所述位于奇数行的条目的位移大于所述位于偶数行的条目的位移;在所述第四时间段播放的各个动画帧中,所述位于奇数行的条目的位移小于所述位于偶数行的条目的位移。
可选的,第三时间段和第四时间段可以根据各个时间段内需要播放的动画帧的数量设置。
例如,假设条目的总数量为6个,确定的动画帧的数量为8,则可以将前4个动画帧的条目位移设置为:在每一动画帧中(前4个动画帧中的任一动画帧),位于奇数行的条目的位移大于位于偶数行的条目的位移。同样的,可以将后4个动画帧的条目位移设置为:在每一动画帧中(后4个动画帧中的任一动画帧),位于奇数行的条目的位移小于位于偶数行的条目的位移。最终,对于最后一个动画帧,各个条目的总移动位移均相等。从而,在第三时间段,使得位于奇数行的条目运动较快,而位于偶数行的条目运动较慢;在第四时间段,使得位于奇数行的条目运动较慢,而位于偶数行的条目运动较快。本实施例提供的插值方式,使得条目在滚动过程中能够呈现碰撞动画效果。
本发明提供的条目滚动过程中的显示方法,系统代码耦合性低,产品升级换代成本低,不用更改框架,仅仅实现不同的插值器即可实现各类酷炫动画效果。通过给不同的条目设置不同的延迟常数,可以实现动画的非统一性,如:焦点跟随运动,焦点处运动最快,离焦点越远运动越慢,或者碰撞运动,偶数行快,奇数行慢,导致相邻两行碰撞运动等效果。
本发明进一步提供一种条目滚动过程中的显示装置,该装置可以应用于电视机、手机、平板电脑等终端。参照图2,图2为本发明条目滚动过程中的显示装置第一实施例的功能模块示意图,所述条目滚动过程中的显示装置包括:
确定模块10,用于在接收到预设触发操作时,确定条目本次滚动对应的总移动位移以及本次滚动过程中所需播放的动画帧的数量;
在本实施例中,预设触发操作可以为用户按下了预设的按键或控件。例如,用户按下了向下键或向上键。预设触发操作还可以为用户对触摸屏幕输入了预设的滑动触摸操作,例如,滑动触摸方式为向下滑动或向上滑动。
可选的,可以预设有触发操作与总移动位移的映射关系。
例如,用户每按一次向下键,则对应的总移动位移为S。用户每按一次向上键,则对应的总移动位移为-S。可以理解的是,S为位移,具有方向性,显示于屏幕上的方式例如可以为:S对应的移动方向为向下移动,-S对应的移动方向为向上移动。
例如,映射关系还可以为,用户每向下滑动一次,则对应的总移动位移为S。用户每向上滑动一次,则对应的总移动位移为-S。可以理解的是,S为位移,具有方向性,显示于屏幕上的方式例如可以为:S对应的移动方向为向下移动,-S对应的移动方向为向上移动。
本次滚动过程中所需播放的动画帧的数量可以成为动画帧率。可选的,还可以确定动画时长T,即,动画播放的总时长为T。此处的动画帧率不同于刷新帧率。刷新帧率跟系统性能有关,比如常见的每秒60帧。而本实施例的动画帧率,是跟动画的显示速度相关。如在时长T内,显示的动画帧的数量即为动画帧率。
生成模块20,用于分别确定每一所述动画帧中所需显示的各个条目的显示位置,并根据确定的各个显示位置排布每一所述动画帧中所需显示的各个条目,以生成各个所述动画帧;
在本实施例中,在同一动画帧中的各个条目对应的显示位置是分别计算的,可以使得除最后播放的动画帧以外的其他各个动画帧中,位于同一动画帧中的各个条目的位移不同。
可以理解的是,在本实施例及以下各个实施例中,条目在某一动画帧中的位移均指该条目在该动画帧中的相对于该条目在滚动前的初始位置的位移,即,条目的位移均以条目在滚动前的初始位置为参考点。
播放模块30,用于依次播放生成的各个所述动画帧;
其中,最后播放的动画帧中的每一条目的位置相对于该条目在滚动前的初始位置的位移均为所述总移动位移。
在本实施例中,在播放动画帧完成后,各个条目相对于各自的初始位置的位移均为总移动位移,从而保证了在滚动完成后各个条目之间的相对位置不发生变化,进而完成了条目的滚动。
本发明提供的条目滚动过程中的显示装置,通过在接收到预设触发操作时,确定条目本次滚动对应的总移动位移以及本次滚动过程中所需播放的动画帧的数量,并分别确定每一所述动画帧中所需显示的各个条目的显示位置,并根据确定的各个显示位置排布每一所述动画帧中所需显示的各个条目,以生成各个所述动画帧,最后依次播放生成的各个所述动画帧。由于在同一动画帧中的各个条目对应的显示位置是分别计算的,从而能够在条目滚动的过程中,实现各个条目之间独立滚动,进而实现条目滚动的动画效果,本发明条目滚动方式更加灵活,提高了用户体验效果。
进一步地,基于本发明条目滚动过程中的显示装置的第一实施例,本发明还提出了条目滚动过程中的显示装置的第二实施例,参照图3,图3为本发明条目滚动过程中的显示装置第二实施例中生成模块的细化功能模块示意图,所述生成模块20包括:
遍历单元21,用于在确定第一个播放的动画帧时,依次遍历在滚动前的显示区域内显示的各个条目以及即将进入所述显示区域的各个条目;或者,在确定第二个及之后播放的各个动画帧时,依次遍历在前一动画帧对应的显示区域内显示的各个条目以及即将进入所述显示区域的各个条目;
位置计算单元22,用于利用预设的插值算法依次计算遍历的各个条目在当前确定的动画帧中的显示位置。
在本实施例中,在确定第一个播放的动画帧时,根据滚动方向确定即将进入显示区域内的各个条目。例如,若条目需要向上滚动,则即将进入显示区域内的条目即为位于在滚动前的显示区域下方的条目;若条目需要向下滚动,则即将进入显示区域内的条目即为位于在滚动前的显示区域上方的条目。
在确定第二个及之后播放的各个动画帧时,根据滚动方向确定即将进入显示区域内的各个条目。例如,若条目需要向上滚动,则即将进入显示区域内的条目即为位于前一动画帧对应的显示区域下方的条目;若条目需要向下滚动,则即将进入显示区域内的条目即为位于前一动画帧对应的显示区域上方的条目。
可选的,所述即将进入所述显示区域的各个条目的数量可以根据实际需要进行确定。例如,可以为预设值,也可以根据滚动速度确定。
预设的插值算法可以根据实际需要进行设置。不同的插值算法可以使得滚动过程中显示不同的动画效果,使得条目的滚动方式更加灵活,提高用户的体验效果。可选的,可以启动一个后台线程,循环N次刷新动画,N为确定的动画帧的数量,每个动画帧的显示时长为T/N。以下提出三种插值方式:
方式一,所述预设的插值算法为:mx=S×(x-A)/F,其中,mx为第x个动画帧中的各个条目相对于其滚动前的初始位置的位移;S为所述总移动位移;A为常数;F与A之和为所述动画帧的数量;
其中,在A<0时,F>-A;
在x-A≤0时,mx=0。
在本实施方式中,由于已经确定了动画帧的数量,所以在确定A和F时,只需要保证在A<0时,F>-A,且A与F之和等于之前确定好的动画帧的数量即可。
例如,假设确定好的动画帧的数量为8,则可以设置A=-2,F=10,则mx=S×(x+2)/10,因此,对于第一个动画帧,条目的位移为m1=3S/10;对于第二个动画帧,条目的位移为m2=4S/10;直至第八个动画帧,条目的位移为m8=10S/10=S。因此动画帧的数量为A+F=8。
例如,假设确定好的动画帧的数量为13,则可以设置A=3,F=10,则mx=S×(x-3)/10,因此,对于第一个、第二个以及第三个动画帧,由于x≤3,因此,x-3≤0,因此mx=0,即各个条目的位置保持不动。对于第四个动画帧,条目的位移为m4=S/10;对于第五个动画帧,条目的位移为m5=2S/10;直至第十三个动画帧,条目的位移为m13=10S/10=S。因此动画帧的数量为A+F=13。
本实施例提供的插值算法,在A大于0时,用户在输入触发操作后,可以使得条目出现延迟滚动效果;在A小于0时,用户输入触发操作后,可以使得条目出现跳跃滚动效果。
方式二,参照图4,图4为本发明条目滚动过程中的显示装置第二实施例中位置计算单元的第一细化功能模块示意图,所述位置计算单元22包括:
选取子单元221,用于在遍历的各个条目中选取焦点条目;
第一计算子单元222,用于计算所述焦点条目和非焦点条目在当前确定的动画帧中的显示位置;
其中,将播放动画帧的时间段划分为第一时间段和第二时间段,在所述第一时间段播放的各个动画帧中,所述焦点条目的位移大于其预设周边范围内的各个非焦点条目的位移;在所述第二时间段播放的各个动画帧中,所述焦点条目的位移小于其周边范围内的各个非焦点条目的位移。
在本实施例中,焦点条目可以为默认的。例如,可以默认为居中的条目。或者,焦点条目还可以由用户指定,例如,用户可以用手指触摸显示区域中显示的某一条目,即可将用户触摸区域对应的条目设置为焦点条目。
可选的,第一时间段和第二时间段可以根据各个时间段内需要播放的动画帧的数量设置。
例如,假设焦点条目位于第三行,条目的总数量为5个,确定的动画帧的数量为6,则可以将前三个动画帧的条目位移设置为:在每一动画帧中(前三个动画帧中的任一动画帧),焦点条目的位移大于其他任一条目的位移,且第二行条目的位移大于第一行条目的位移,第四行条目的位移大于第五行条目的位移。同样的,可以将后三个动画帧的条目位移设置为:在每一动画帧中(后三个动画帧中的任一动画帧),焦点条目的位移小于其他任一条目的位移,且第二行条目的位移小于第一行条目的位移,第四行条目的位移小于第五行条目的位移。最终,对于最后一个动画帧,各个条目的总移动位移均相等。本实施例提供的插值方式,使得条目在滚动过程中能够呈现焦点跟随动画效果。
方式三,参照图5,图5为本发明条目滚动过程中的显示装置第二实施例中位置计算单元的第二细化功能模块示意图,所述位置计算单元22包括:
确定子单元223,用于在遍历的各个条目中确定位于奇数行的条目和位于偶数行的条目;
第二计算子单元224,用于计算所述位于奇数行的条目和位于偶数行的条目在当前确定的动画帧中的显示位置;
其中,将播放动画帧的时间段划分为第三时间段和第四时间段,在所述第三时间段播放的各个动画帧中,所述位于奇数行的条目的位移大于所述位于偶数行的条目的位移;在所述第四时间段播放的各个动画帧中,所述位于奇数行的条目的位移小于所述位于偶数行的条目的位移。
可选的,第三时间段和第四时间段可以根据各个时间段内需要播放的动画帧的数量设置。
例如,假设条目的总数量为6个,确定的动画帧的数量为8,则可以将前4个动画帧的条目位移设置为:在每一动画帧中(前4个动画帧中的任一动画帧),位于奇数行的条目的位移大于位于偶数行的条目的位移。同样的,可以将后4个动画帧的条目位移设置为:在每一动画帧中(后4个动画帧中的任一动画帧),位于奇数行的条目的位移小于位于偶数行的条目的位移。最终,对于最后一个动画帧,各个条目的总移动位移均相等。从而,在第三时间段,使得位于奇数行的条目运动较快,而位于偶数行的条目运动较慢;在第四时间段,使得位于奇数行的条目运动较慢,而位于偶数行的条目运动较快。本实施例提供的插值方式,使得条目在滚动过程中能够呈现碰撞动画效果。
本发明提供的条目滚动过程中的显示装置,系统代码耦合性低,产品升级换代成本低,不用更改框架,仅仅实现不同的插值器即可实现各类酷炫动画效果。通过给不同的条目设置不同的延迟常数,可以实现动画的非统一性,如:焦点跟随运动,焦点处运动最快,离焦点越远运动越慢,或者碰撞运动,偶数行快,奇数行慢,导致相邻两行碰撞运动等效果。
需要说明的是,在本文中,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、物品或者装置不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、方法、物品或者装置所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括该要素的过程、方法、物品或者装置中还存在另外的相同要素。
上述本发明实施例序号仅仅为了描述,不代表实施例的优劣。
通过以上的实施方式的描述,本领域的技术人员可以清楚地了解到上述实施例方法可借助软件加必需的通用硬件平台的方式来实现,当然也可以通过硬件,但很多情况下前者是更佳的实施方式。基于这样的理解,本发明的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质(如ROM/RAM、磁碟、光盘)中,包括若干指令用以使得一台终端设备(可以是手机,计算机,服务器,空调器,或者网络设备等)执行本发明各个实施例所述的方法。
以上仅为本发明的优选实施例,并非因此限制本发明的专利范围,凡是利用本发明说明书及附图内容所作的等效结构或等效流程变换,或直接或间接运用在其他相关的技术领域,均同理包括在本发明的专利保护范围内。

Claims (10)

1.一种条目滚动过程中的显示方法,其特征在于,所述条目滚动过程中的显示方法包括:
在接收到预设触发操作时,确定条目本次滚动对应的总移动位移以及本次滚动过程中所需播放的动画帧的数量;
分别确定每一所述动画帧中所需显示的各个条目的显示位置,并根据确定的各个显示位置排布每一所述动画帧中所需显示的各个条目,以生成各个所述动画帧;
依次播放生成的各个所述动画帧;
其中,最后播放的动画帧中的每一条目的位置相对于该条目在滚动前的初始位置的位移均为所述总移动位移。
2.如权利要求1所述的条目滚动过程中的显示方法,其特征在于,所述分别确定每一所述动画帧中所需显示的各个条目的显示位置的步骤包括:
在确定第一个播放的动画帧时,依次遍历在滚动前的显示区域内显示的各个条目以及即将进入所述显示区域的各个条目;或者,在确定第二个及之后播放的各个动画帧时,依次遍历在前一动画帧对应的显示区域内显示的各个条目以及即将进入所述显示区域的各个条目;
利用预设的插值算法依次计算遍历的各个条目在当前确定的动画帧中的显示位置。
3.如权利要求2所述的条目滚动过程中的显示方法,其特征在于,所述预设的插值算法为:mx=S×(x-A)/F,其中,mx为第x个动画帧中的各个条目相对于其滚动前的初始位置的位移;S为所述总移动位移;A为常数;F与A之和为所述动画帧的数量;
其中,在A<0时,F>-A;
在x-A≤0时,mx=0。
4.如权利要求2所述的条目滚动过程中的显示方法,其特征在于,所述利用预设的插值算法依次计算遍历的各个条目在当前确定的动画帧中的显示位置的步骤包括:
在遍历的各个条目中选取焦点条目;
计算所述焦点条目和非焦点条目在当前确定的动画帧中的显示位置;
其中,将播放动画帧的时间段划分为第一时间段和第二时间段,在所述第一时间段播放的各个动画帧中,所述焦点条目的位移大于其预设周边范围内的各个非焦点条目的位移;在所述第二时间段播放的各个动画帧中,所述焦点条目的位移小于其周边范围内的各个非焦点条目的位移。
5.如权利要求2所述的条目滚动过程中的显示方法,其特征在于,所述利用预设的插值算法依次计算遍历的各个条目在当前确定的动画帧中的显示位置的步骤包括:
在遍历的各个条目中确定位于奇数行的条目和位于偶数行的条目;
计算所述位于奇数行的条目和位于偶数行的条目在当前确定的动画帧中的显示位置;
其中,将播放动画帧的时间段划分为第三时间段和第四时间段,在所述第三时间段播放的各个动画帧中,所述位于奇数行的条目的位移大于所述位于偶数行的条目的位移;在所述第四时间段播放的各个动画帧中,所述位于奇数行的条目的位移小于所述位于偶数行的条目的位移。
6.一种条目滚动过程中的显示装置,其特征在于,所述条目滚动过程中的显示装置包括:
确定模块,用于在接收到预设触发操作时,确定条目本次滚动对应的总移动位移以及本次滚动过程中所需播放的动画帧的数量;
生成模块,用于分别确定每一所述动画帧中所需显示的各个条目的显示位置,并根据确定的各个显示位置排布每一所述动画帧中所需显示的各个条目,以生成各个所述动画帧;
播放模块,用于依次播放生成的各个所述动画帧;
其中,最后播放的动画帧中的每一条目的位置相对于该条目在滚动前的初始位置的位移均为所述总移动位移。
7.如权利要求6所述的条目滚动过程中的显示装置,其特征在于,所述生成模块包括:
遍历单元,用于在确定第一个播放的动画帧时,依次遍历在滚动前的显示区域内显示的各个条目以及即将进入所述显示区域的各个条目;或者,在确定第二个及之后播放的各个动画帧时,依次遍历在前一动画帧对应的显示区域内显示的各个条目以及即将进入所述显示区域的各个条目;
位置计算单元,用于利用预设的插值算法依次计算遍历的各个条目在当前确定的动画帧中的显示位置。
8.如权利要求7所述的条目滚动过程中的显示装置,其特征在于,所述预设的插值算法为:mx=S×(x-A)/F,其中,mx为第x个动画帧中的各个条目相对于其滚动前的初始位置的位移;S为所述总移动位移;A为常数;F与A之和为所述动画帧的数量;
其中,在A<0时,F>-A;
在x-A≤0时,mx=0。
9.如权利要求7所述的条目滚动过程中的显示装置,其特征在于,所述位置计算单元包括:
选取子单元,用于在遍历的各个条目中选取焦点条目;
第一计算子单元,用于计算所述焦点条目和非焦点条目在当前确定的动画帧中的显示位置;
其中,将播放动画帧的时间段划分为第一时间段和第二时间段,在所述第一时间段播放的各个动画帧中,所述焦点条目的位移大于其预设周边范围内的各个非焦点条目的位移;在所述第二时间段播放的各个动画帧中,所述焦点条目的位移小于其周边范围内的各个非焦点条目的位移。
10.如权利要求7所述的条目滚动过程中的显示装置,其特征在于,所述位置计算单元包括:
确定子单元,用于在遍历的各个条目中确定位于奇数行的条目和位于偶数行的条目;
第二计算子单元,用于计算所述位于奇数行的条目和位于偶数行的条目在当前确定的动画帧中的显示位置;
其中,将播放动画帧的时间段划分为第三时间段和第四时间段,在所述第三时间段播放的各个动画帧中,所述位于奇数行的条目的位移大于所述位于偶数行的条目的位移;在所述第四时间段播放的各个动画帧中,所述位于奇数行的条目的位移小于所述位于偶数行的条目的位移。
CN201611142950.3A 2016-12-12 2016-12-12 条目滚动过程中的显示方法及装置 Active CN106598439B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201611142950.3A CN106598439B (zh) 2016-12-12 2016-12-12 条目滚动过程中的显示方法及装置

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201611142950.3A CN106598439B (zh) 2016-12-12 2016-12-12 条目滚动过程中的显示方法及装置

Publications (2)

Publication Number Publication Date
CN106598439A true CN106598439A (zh) 2017-04-26
CN106598439B CN106598439B (zh) 2020-01-14

Family

ID=58597823

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201611142950.3A Active CN106598439B (zh) 2016-12-12 2016-12-12 条目滚动过程中的显示方法及装置

Country Status (1)

Country Link
CN (1) CN106598439B (zh)

Cited By (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN107329649A (zh) * 2017-06-14 2017-11-07 努比亚技术有限公司 动画显示方法、终端及计算机可读存储介质
CN109656639A (zh) * 2018-12-25 2019-04-19 深圳创维数字技术有限公司 一种界面滚动方法、装置、设备及介质

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102138123A (zh) * 2008-08-26 2011-07-27 苹果公司 基于列表项目属性的列表巡览的动态控制
CN102148048A (zh) * 2011-05-12 2011-08-10 北京瑞信在线系统技术有限公司 歌词显示方法及装置
US20130120400A1 (en) * 2011-11-14 2013-05-16 Microsoft Corporation Animation creation and management in presentation application programs
CN105100862A (zh) * 2014-04-18 2015-11-25 阿里巴巴集团控股有限公司 网格移动的显示处理方法及其系统

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102138123A (zh) * 2008-08-26 2011-07-27 苹果公司 基于列表项目属性的列表巡览的动态控制
CN102148048A (zh) * 2011-05-12 2011-08-10 北京瑞信在线系统技术有限公司 歌词显示方法及装置
US20130120400A1 (en) * 2011-11-14 2013-05-16 Microsoft Corporation Animation creation and management in presentation application programs
CN105100862A (zh) * 2014-04-18 2015-11-25 阿里巴巴集团控股有限公司 网格移动的显示处理方法及其系统

Cited By (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN107329649A (zh) * 2017-06-14 2017-11-07 努比亚技术有限公司 动画显示方法、终端及计算机可读存储介质
CN109656639A (zh) * 2018-12-25 2019-04-19 深圳创维数字技术有限公司 一种界面滚动方法、装置、设备及介质
CN109656639B (zh) * 2018-12-25 2022-04-15 深圳创维数字技术有限公司 一种界面滚动方法、装置、设备及介质

Also Published As

Publication number Publication date
CN106598439B (zh) 2020-01-14

Similar Documents

Publication Publication Date Title
US9237367B2 (en) Interactive video advertisement in a mobile browser
CN101273633B (zh) 通过图形特征的连续滚动来浏览列表的方法及相关终端
CN107533450B (zh) 一种显示方法及终端设备
CN105338394A (zh) 字幕数据的处理方法及系统
CN105094628A (zh) 一种截屏方法及电子设备
CN105451062B (zh) 一种显示推送信息的方法及装置
CN106534993A (zh) 一种信息交互方法及装置
CN103618956A (zh) 一种获取视频关联信息的方法及移动终端
CN101262518B (zh) 移动终端以及从web站点播放视频的方法
CN100380303C (zh) 数字多功能和信息显示装置及其方法
CN106162298B (zh) 一种实现弹幕的方法和系统
CN106527894A (zh) 移动终端和显示控制方法
CN114697721B (zh) 弹幕显示方法及电子设备
CN106598439A (zh) 条目滚动过程中的显示方法及装置
CN111901832B (zh) 一种一体机的无线投屏模块及投屏方法
RU2007139408A (ru) Устройство формирования эпп и способ формирования эпп
CN107277600A (zh) 提供各种类型的内容的控制方法和显示装置
CN101312506B (zh) 附带字幕的影像重现装置
CN109840315B (zh) 一种详情信息查看方法及装置
CN114511359A (zh) 显示方法、装置、设备及介质
CN113342230A (zh) 控件显示方法、装置、设备及介质
CN104133596B (zh) 电子屏信息的显示方法及装置
CN102741793A (zh) 目标图像显示装置、目标图像显示方法、目标图像显示程序
US20080026800A1 (en) Mobile communication terminal and method for creating menu screen for the same
CN109151547B (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