CN110047120A - 一种动画展示方法及装置 - Google Patents
一种动画展示方法及装置 Download PDFInfo
- Publication number
- CN110047120A CN110047120A CN201910238259.2A CN201910238259A CN110047120A CN 110047120 A CN110047120 A CN 110047120A CN 201910238259 A CN201910238259 A CN 201910238259A CN 110047120 A CN110047120 A CN 110047120A
- Authority
- CN
- China
- Prior art keywords
- display layer
- animation
- factor
- display
- switching
- 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
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T13/00—Animation
- G06T13/20—3D [Three Dimensional] animation
Landscapes
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Processing Or Creating Images (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本发明涉及一种动画展示方法及装置,所述方法包括:响应于显示层切换查看请求,确定当前所在的切换位置,根据所述切换位置确定第一动画因子,以及确定与所述切换位置相邻的第一显示层和第二显示层;根据所述第一动画因子,确定所述第一显示层和所述第二显示层的显示格式;获取原始显示层详情图,根据所述显示格式对所述原始显示层详情图中的所述第一显示层和所述第二显示层进行调整,生成与所述切换位置相对应的切换状态图并显示;重复以上步骤直至接收到显示层切换停止请求,所述显示层切换过程中显示的若干所述切换状态图形成所述显示层切换动画。本发明能够对显示层切换过程进行动画展示,实现相邻显示层之间的平滑过渡。
Description
技术领域
本发明涉及图像处理技术领域,尤其涉及一种动画展示方法及装置。
背景技术
在图像技术领域,通常为了展示一个目标对象的内部详情信息,可以将该目标对象划分为若干显示层,其中,每个显示层包含了该目标对象在该层的详细信息,通过在不同显示层之间进行切换,可以展示该目标对象不同显示层的精细化数据,从而能够直观、清楚地了解该目标对象的组成结构。
对于在不同显示层之间进行切换的方法,现有技术中是通过控制显示层的整数层切换,即在控件上显示相关按钮,点击显示层ID,便可直接切换到相应的显示层,显示层切换过程生硬,难以实现相邻显示层之间的平滑过渡。
发明内容
本发明所要解决的技术问题在于,提供一种动画展示方法及装置,能够对显示层切换过程进行动画展示,实现相邻显示层之间的平滑过渡。
为了解决上述技术问题,第一方面,本发明提供了一种动画展示方法,包括:
响应于显示层切换查看请求,确定当前所在的切换位置,根据所述切换位置确定第一动画因子,以及确定与所述切换位置相邻的第一显示层和第二显示层,其中,所述切换位置位于所述第一显示层和所述第二显示层之间;
根据所述第一动画因子,确定所述第一显示层和所述第二显示层的显示格式;
获取原始显示层详情图,根据所述显示格式对所述原始显示层详情图中的所述第一显示层和所述第二显示层进行调整,生成与所述切换位置相对应的切换状态图,并显示所述切换状态图;
重复以上步骤直至接收到显示层切换停止请求,所述显示层切换过程中显示的若干所述切换状态图形成所述显示层切换动画。
第二方面,本发明提供了一种动画展示装置,包括:
位置确定模块,用于响应于显示层切换查看请求,确定当前所在的切换位置,根据所述切换位置确定第一动画因子,以及确定与所述切换位置相邻的第一显示层和第二显示层,其中,所述切换位置位于所述第一显示层和所述第二显示层之间;
显示格式确定模块,用于根据所述第一动画因子,确定所述第一显示层和所述第二显示层的显示格式;
切换状态图生成模块,用于获取原始显示层详情图,根据所述显示格式对所述原始显示层详情图中的所述第一显示层和所述第二显示层进行调整,生成与所述切换位置相对应的切换状态图,并显示所述切换状态图;
切换动画展示模块,用于重复执行上述模块相应的操作直至接收到显示层切换停止请求,所述显示层切换过程中显示的若干所述切换状态图形成所述显示层切换动画。
第三方面,本发明提供了一种计算机存储介质,所述存储介质中存储有至少一条指令、至少一段程序、代码集或指令集,所述至少一条指令、至少一段程序、代码集或指令集由处理器加载并执行如上述第一方面所述的动画展示方法。
第四方面,本发明提供了一种设备,所述设备包括处理器以及存储器,其中所述处理器用于调用并执行所述存储器中存储的程序,所述存储器用于存储程序,所述程序用于实现上述第一方面所述的动画展示方法。
实施本发明实施例,具有如下有益效果:
本发明通过响应于显示层切换查看请求,确定当前所在的切换位置,根据所述切换位置确定第一动画因子,以及与所述切换位置相邻的第一显示层和第二显示层;根据第一动画因子,确定所述第一显示层和所述第二显示层的显示格式;根据显示格式对原始显示层详情图中的第一显示层和第二显示层进行调整,以生成与所述切换位置相对应的切换状态图,并显示所述切换状态图;重复上述步骤直至接收到切换停止请求,在切换过程中显示的若干切换状态图形成了显示层切换动画。本发明通过在显示层切换过程中,不断生成与每个切换位置相对应的切换状态图,并显示出来,形成了显示层切换动画,实现了相邻显示层之间平滑过渡的效果,提升了用户体验。
附图说明
图1是本发明实施例提供的应用场景示意图;
图2是本发明实施例提供的一种动画显示方法流程图;
图3是本发明实施例提供的一种切换位置处理方法流程图;
图4是本发明实施例提供的一种显示格式确定方法示意图;
图5是本发明实施例提供的显示层切换界面示意图;
图6是本发明实施例提供的一种目标对象展开动画生成方法示意图;
图7是本发明实施例提供的第一动画帧序列的确定方法示意图;
图8是本发明实施例提供的显示层间距变化示意图;
图9是本发明实施例提供的第一曲线示意图;
图10是本发明实施例提供的一种目标对象聚集动画生成方法示意图;
图11是本发明实施例提供的第二动画帧序列的确定方法示意图;
图12是本发明实施例提供的第二曲线示意图;
图13是本发明实施例提供的另一种动画展示方法示意图;
图14是本发明实施例提供的一种动画展示装置示意图;
图15是本发明实施例提供的位置确定模块示意图;
图16是本发明实施例提供的显示格式确定模块示意图;
图17是本发明实施例提供的展开装置示意图;
图18是本发明实施例提供的第一动画帧序列确定模块示意图;
图19是本发明实施例提供的聚集装置示意图;
图20是本发明实施例提供的第二动画帧序列确定模块示意图。
具体实施方式
为使本发明的目的、技术方案和优点更加清楚,下面将结合附图对本发明作进一步地详细描述。显然,所描述的实施例仅仅是本发明的一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动的前提下所获得的所有其他实施例,都属于本发明保护的范围。
在本发明的描述中,需要理解的是,术语“第一”、“第二”仅用于描述目的,而不能理解为指示或暗示相对重要性或者隐含指明所指示的技术特征的数量。由此,限定有“第一”、“第二”的特征可以明示或者隐含地包括一个或者更多个该特征。应该理解这样使用的数据在适当情况下可以互换,以便这里描述的本发明的实施例能够以除了在这里图示或描述的那些以外的顺序实施。
请参见图1,其示出了本发明实施例提供的一种应用场景图,本申请可以应用于需要通过对目标对象进行展开以获取内部详情信息,并进行切换查看各部分详情的应用场景,其应用场景图可参见图1,用户通过滑动相关控件中的游标,便可切换到与当前游标位置相对应的部分进行查看,并对当前查看的结构部分作突出显示,对于整个的切换查看过程,将会以动画的形式展示给用户。
以下将以室内图展示为例具体说明本申请的具体实施方式。室内图是地图中用来展示建筑室内详细信息的,包含了更加精细化的数据,数据按楼层进行划分,每个楼层中包含了各种商铺的数据。
请参见图2,其示出了一种动画显示方法,可应用于客户端侧,对于在室内图应用场景中,该方法中的目标对象可以看成为某个建筑的室内图,显示层即为该建筑的楼层,具体地,所述方法包括:
S210.响应于显示层切换查看请求,确定当前所在的切换位置,根据所述切换位置确定第一动画因子,以及确定与所述切换位置相邻的第一显示层和第二显示层,其中,所述切换位置位于所述第一显示层和所述第二显示层之间。
这里的显示层切换查看请求可以由控件中的游标滑动操作实现,当用户滑动游标时,说明用户有进行显示层切换的需求,从而客户端接收到显示层切换请求,进行相关的切换位置和参数确定操作。
具体地,可参见图3,其示出了一种切换位置处理方法,包括:
S310.当检测到控件中的游标滑动操作时,记录当前的游标读数,其中,所述游标读数为浮点数。
S320.对所述游标读数进行取整操作。
S330.确定所述游标读数的小数部分为所述第一动画因子。
S340.确定与所述游标读数的整数部分数值对应的层级为第一显示层。
假设游标在UI控件中的位置读数为浮点数x,游标位置所在的楼层区间为[i,i+1],其中i=int(x),x的小数部分为fac1=x-i,这里i即为第一显示层,fac1为第一动画因子。第一动画因子fac1越接近于0,则表示当前的切换位置更接近第i层;第一动画因子fac1越接近于1,则表示当前的切换位置更接近于第i+1层。
对于一共有N个楼层的建筑物室内图,用户通过UI滑竿切换楼层,对于实际的切换位置的值域范围为[1,N],其中,1和N表示最底下和最顶上的楼层,对于每一个浮点数表示的位置,其一定位于两个楼层之间。对于切换位置正好是整数层的楼层时,可认为当前位置处于当前整数层和当前整数层的上一层之间。
S220.根据所述第一动画因子,确定所述第一显示层和所述第二显示层的显示格式。
通过第一动画因子,能够对当前切换位置所涉及到的两个显示层进行处理显示。
首先引入函数,定义:
type mix(type min,type max,float a)
{return min*(1.0-a)+max*a;}
其中,type对于1维度是float,也可以是多维的向量,例如vec2f,vec4f等。
对于具体的第一显示层和第二显示层的显示格式的确定方法,可参见图4,包括:
S410.根据所述第一动画因子,计算所述第一显示层和所述第二显示层的缩放因子。
采用scale数组表示所有楼层的缩放因子,默认全部用1进行填充,并设定最大的缩放因子MAX_SCALE,本实施例中,最大缩放因子MAX_SCALE取1.5,对于最大缩放因子MAX_SCALE可根据实际情况进行选取。
对于第i层和第i+1层,可通过以下公式计算相应的缩放因子:
scale[i]=mix(1.0,MAX_SCALE,1.0-fac1) (1)
根据式(1)可知,fac1越小,表示当前切换位置离第i层越近,此时第i层的楼层被激活得更多,mix函数计算出的scale[i]值更接近于最大缩放因子MAX_SCALE。
scale[i+1]=mix(1.0,MAX_SCALE,fac1) (2)
根据式(2)可知,fac1越大,表示当前切换位置离第i+1层越近,此时第i+1层被激活得更多,mix函数计算出的scale[i+1]值更接近于最大缩放因子MAX_SCALE。
S420.根据所述第一动画因子,确定所述第一显示层和所述第二显示层的显示颜色。
对于每一个切换位置,需要对当前涉及到的两个显示层进行突出显示,而对其他显示层的显示样式进行弱化。本实施例中,通过调整显示层的颜色来实现,具体可以为:涉及到的两个显示层为原色显示,其他无关显示层为灰色显示。需要说明的是,这里对于相关楼层的颜色显示方案并不是唯一的,只需要能够有效区分开当前涉及到的楼层和其他无关楼层的配色方案均可应用于本实施例中。
对于彩色是默认样式配置,而灰色的生成方式是:通过对片段着色器fragmentshader输入的原始颜色,采用统一的灰度算法进行灰度化,保留对比度。
采用colorFac数组表示所有显示层的颜色混合因子,默认为1填充。
对于第i层,设置其颜色混合因子为:
colorFac[i]=fac1 (3)
对于第i+1层,设置其颜色混合因子为:
colorFac[i+1]=1.0-fac1 (4)
以上的颜色混合方案在GPU(Graphics Processing Unit,图形处理器)的fragment shader中完成。
另外,对于每个显示层的颜色的确定,可通过如下方法实现:
color_f=mix(colorful,gray,colorFac[i]) (5)
根据式(5)可知,除了第i层和第i+1层之外的其他显示层,与其对应的colorFac数组值为1,则显示颜色混合结果是灰色;而对于第i层和第i+1层的显示颜色是灰色和彩色混合的结果。
具体可参见图5,图5左图中的游标偏向楼层F1,则F1楼层更亮和更大些;图5右图中的游标偏向F2,则F2楼层更亮和更大些。
S430.根据所述第一动画因子,对所述第一显示层和所述第二显示层作居中显示。
解决激活楼层居中的问题,增加变量cameraOffsetY表示所有楼层整体的偏移量,使得切换涉及到的两个楼层第i层和第i+1层位于屏幕的中心位置,具体可参见以下公式:
cameraOffsetY=mix(YOffset[i],YOffset[i+1],fac1) (6)
其中,YOffset数组表示的是每个显示层Y轴方向距离原点的偏移向量,有正负之分,场景的坐标系原点和屏幕中心重叠,cameraOffsetY大于0,整体向上移动;反之,整体向下移动;式(6)实现效果是:fac1越小,游标越靠近第i层,那么第i层会比第i+1层更加接近于屏幕中心;fac1越大,游标越靠近第i+1层,那么第i+1层会比第i层更加接近于屏幕中心。
S230.获取原始显示层详情图,根据所述显示格式对所述原始显示层详情图中的所述第一显示层和所述第二显示层进行调整,生成与所述切换位置相对应的切换状态图,并显示所述切换状态图。
每一个切换位置均会对应一张切换状态图,这里的切换状态图是在原始显示层详情图上对涉及到的两个显示层进行调整之后得到的,其中,原始显示层详情图是指包含当前建筑内部所有显示层详情信息的显示图,是预先就存在的;对于当前的切换位置,在经过上述一系列操作之后,得到与当前切换位置相对应的第一显示层和第二显示层的显示格式,根据显示格式对原始显示层详情图中的第一显示层和第二显示层进行调整,得到相应的切换状态图并进行显示。
S240.重复以上步骤直至接收到显示层切换停止请求,所述显示层切换过程中显示的若干所述切换状态图形成所述显示层切换动画。
每个切换位置均会对应切换动画中的一张帧图片,每执行一次步骤S210~步骤S230中的相关操作,便会生成显示层切换动画中的一张帧图片,重复执行步骤S210~步骤S230中的相关操作,最终展示给用户的便是连续不变的动画。
在上述实施例中,通过对第一显示层和第二显示层进行缩放因子的计算,可以调整这两个显示层的具体呈现出来的图像大小,并且,随着切换位置的不断变化,第一动画因子fac1不断变化,相应地第一显示层和第二显示层的缩放因子也在不断变化,第一显示层和第二显示层的显示大小也在不断变化,结合颜色以及位置的变化,呈现给用户的显示效果就是随着切换位置的变化,相应涉及到的显示层的显示大小、显示颜色和显示位置都在不断变化,实现了显示层之间平滑过渡的显示效果。
另外,上述实施例中的第一动画因子选取为一位小数,在实际操作过程中,可以采用多位小数,这样对应的切换位置的数量会增多,对应的切换状态图会变多,显示层之间的切换效果会更加平滑。
将本申请应用于室内图切换场景,用户可通过智能设备中安装的相关地图类APP查看地图上的建筑A的内部详细信息,建筑A内部分为若干楼层,查看某一楼层便可了解关于该楼层的详细信息;当用户需要进行楼层切换查看时,通过滑动显示界面控件上的游标,便可切换到与当前游标位置相对应的楼层进行楼层信息的查看,并且对当前切换位置所涉及到的两个楼层进行突出显示,对于整个的楼层切换过程,将会以动画的形式展示给用户。其中,这里的智能设备包括但不限于智能手机、平板电脑、个人计算机等终端设备。
在步骤S210之前还可以包括目标对象展开为若干显示层的过程,具体可参见图6,其示出了一种目标对象展开动画生成方法,同样应用于客户端侧,包括:
S610.响应于第一触发请求,确定与目标对象展开过程相对应的第一动画帧序列,其中,所述目标对象包括若干所述显示层。
目标对象可以是指某一栋建筑室内详情图,其内包含了若干显示层。本实施例中第一触发请求具体可以是检测到用户点击游标,便触发了目标对象展开的相关操作。
S620.依次显示所述第一动画帧序列中的图片,形成所述目标对象的展开动画,所述第一动画帧序列中的每张帧图片均包括所述目标对象。
第一动画帧序列中的每张帧图片均包含了目标对象的各状态信息,即包括了整栋建筑展开成若干显示层的各个状态。
其中,请参见图7,所述第一动画帧序列的确定方法包括:
S710.获取第二动画因子递增序列。
上述的目标对象的展开动画是由若干帧展开图片形成的,其中,每帧图片均对应一个第二动画因子fac2,且按照展开的时间先后顺序,依次递增。假设根据预设的条件,展开动画是由1s内的20帧图片构成,则这20帧图片依次对应的第二动画因子fac2为:0.05,0.1,0.15,0.2…1,由此形成了第二动画因子递增序列,此序列可根据预设的条件提前计算好。
S720.根据所述第二动画因子递增序列构建所述第一动画帧序列,所述第一动画帧序列中的每张帧图片均根据所述目标对象和所述第二动画因子递增序列中相应的第二动画因子计算而得。
第一动画帧序列由包含实现展开动画的若干帧图片组成,以20帧/s为例,若干帧图片展示的是若干显示层相对于最底层高度不断增高的过程,其中每一帧图片显示层之间的间距都会有变化,随着时间的推移,显示层之间的距离逐渐增大。具体如图8所示,图8展示了一个楼层的展开动画,三个楼层的间距逐渐变大,对于每个楼层展开动画改变的是高度值,这四个状态图可以看成是组成楼层展开动画的四张帧图片。
可用MAX_YDIS表示展开后的两个显示层之间的最大间距,本实施例中设置MAX_YDIS为5倍的楼层高度,建筑的最底层高度为0,那么显示层越高高度值越大,为了实现类似弹簧展开的楼层展开效果,本实施例中的楼层展开高度变化采用了四次方曲线,可参见图9,将帧图片的第二动画因子作为四次方函数的输入,输出结果与目标楼层高度相乘,得到当前帧图片中每个楼层的楼层高度,每个楼层高度变化的计算方式可如下表所示,其中,每一个过程对应一张帧图片,例如过程1对应的是第二动画因子为0.05的帧图片,过程2对应的是第二动画因子为0.1的帧图片:
表1楼层展开过程中楼层高度的计算
楼层号 | 0层 | 1层 | 2层 | …… | N层 |
起始高度 | 0 | 0 | 0 | 0 | 0 |
过程1 | 0 | 5H×0.05<sup>4</sup> | 10H×0.05<sup>4</sup> | …… | N×5H×0.05<sup>4</sup> |
过程2 | 0 | 5H×0.1<sup>4</sup> | 10H×0.1<sup>4</sup> | …… | N×5H×0.1<sup>4</sup> |
…… | …… | …… | …… | …… | …… |
目标高度 | 0 | 5H | 10H | …… | N×5H |
在步骤S240之后还可以包括目标对象聚集的过程,具体可参见图10,其示出了一种目标对象聚集动画生成方法示意图,所述方法包括:
S1010.确定与目标对象聚集过程相对应的第二动画帧序列,其中,所述目标对象包括若干所述显示层。
S1020.依次显示所述第二动画帧序列中的图片,形成所述目标对象的聚集动画,所述第二动画帧序列中的每张帧图片均包括所述目标对象。
S1030.获取当前的切换位置,确定与所述切换位置最近的目标显示层,隐藏所述目标显示层以上的显示层。
这里的目标对象的聚集过程与图6中的目标对象展开过程是相反的过程,关于显示层的高度的计算方法是类似的,在接收到显示层切换停止请求之后,本实施例中,可以为当用户松开游标之后,便触发目标对象聚集的相关操作。
其中,对于第二动画帧序列的确定方法可参见图11,包括:
S1110.获取第三动画因子递减序列。
这里的第三动画因子与第二动画因子的计算方法类似,只不过这里的是递减序列,即假设根据预设的条件,聚集动画是由1s内的20帧图片构成,则这20帧图片按照时间先后顺序依次对应的第三动画因子fac3为:1,0.95,0.9…0.05。
S1120.根据所述第三动画因子递减序列构建所述第二动画帧序列,所述第二动画帧序列中的每张帧图片均根据所述目标对象和所述第三动画因子递减序列中相应的第三动画因子计算而得。
在聚集的过程中,各楼层之间的间距不断减小,本实施例中的楼层聚集高度变化也采用了四次方曲线,可参见图12,将帧图片的第三动画因子fac3作为四次方函数的输入,输出结果与目标楼层高度相乘,得到当前帧图片中每个楼层的楼层高度,其具体计算过程与表1类似,在此不再赘述。
以上通过四次方曲线来计算显示层高度实现了展开与聚集的弹簧效果,增强了动画显示效果。
其中,在聚集的时候,需要对当前显示层以上的显示层全部隐藏,这样才能清晰地看到当前显示层内部的全貌。当手指在UI控件上滑动时,输出的位置是1至N之间的连续浮点数,从而驱动楼层控件做动画。当用户松开的时候,游标可能位于两个楼层之间,此时需要自动吸附到最近的楼层,楼层号为整数,完成切换功能。
为了清楚显示当前显示层的全貌,在聚集的过程中,当前显示层以上的所有显示层透明度作渐隐效果处理;反之,当准备切换显示层的时候,目标对象由聚集变化到展开的状态,这时候需要展示所有的楼层,原来被隐去的楼层做透明度的渐现处理。
对于透明度的计算,可通过如下方式实现:
采用alpha数组表示所有楼层的透明度,数组默认填充1,设当前楼层为楼层i,当前楼层以上的楼层为楼层j,i+1≤j≤N。聚集的时候,随着第三动画因子fac3的递减,alpha[j]=fac3,alpha[j]从1变到0,即由不透明变为透明;展开的时候,随着第二动画因子的递增,alpha[j]=fac2,alpha[j]从0变到1,即由透明变为不透明。这样在进行目标对象的展开和聚集的过程中,各楼层的透明度也在不断变化,对于各楼层透明度的变化,可以在展开或者聚集动画中的每帧图片中体现,从而增强了展开和聚集的动画效果。
图2所示的动画展示方法和图6以及图10所示的动画生成方法可以组成另一种动画展示方法,请参见图13,包括:
S1310.响应于游标点击操作,播放目标对象展开动画。
S1320.不断响应于游标滑动操作,进行相应显示层的切换查看,生成相应的显示层切换动画。
S1310.响应于游标松开操作,播放目标对象聚集动画。
用户点中游标,目标对象自动展开;用户滑动游标进行显示层切换,生成相应的切换动画;用户松开游标,目标对象聚集在一起,显示层切换结束。其中,在具体的实施过程中,目标对象的展开和目标对象的聚集是自动播放的,而切换显示层的整个过程是手工动画,即是根据用户滑动游标的位置生成相应的动画的。
另外,在本实施例具体实施过程中,显示层展开的时候,为了最佳显示效果,所有的显示层整体倾斜一定的角度,本实施例中选择45度。
本发明实施例提供的动画展示方法通过在显示层切换过程中,不断生成与每个切换位置相对应的切换状态图,并显示出来,形成了显示层切换动画,实现了相邻显示层之间平滑过渡的效果。
本实施例还提供了一种装置,该装置可通过硬件和/或软件的方式实现,并一般可以集成于客户端中,与提供资源的服务器配合使用。具体可参见图14,其示出了一种动画展示装置,包括:
位置确定模块1410,用于响应于显示层切换查看请求,确定当前所在的切换位置,根据所述切换位置确定第一动画因子,以及确定与所述切换位置相邻的第一显示层和第二显示层,其中,所述切换位置位于所述第一显示层和所述第二显示层之间。
显示格式确定模块1420,用于根据所述第一动画因子,确定所述第一显示层和所述第二显示层的显示格式。
切换状态图生成模块1430,用于获取原始显示层详情图,根据所述显示格式对所述原始显示层详情图中的所述第一显示层和所述第二显示层进行调整,生成与所述切换位置相对应的切换状态图,并显示所述切换状态图。
切换动画展示模块1440,用于重复执行上述模块相应的操作直至接收到显示层切换停止请求,所述显示层切换过程中显示的若干所述切换状态图形成所述显示层切换动画。
请参见图15,所述位置确定模块1410包括:
读数检测模块1510,用于当检测到控件中的游标滑动操作时,记录当前的游标读数,其中,所述游标读数为浮点数。
取整模块1520,用于对所述游标读数进行取整操作。
第一确定模块1530,用于确定所述游标读数的小数部分为所述第一动画因子。
第二确定模块1540,用于确定与所述游标读数的整数部分数值对应的层级为第一显示层。
请参见图16,所述显示格式确定模块1420包括:
缩放因子计算模块1610,用于根据所述第一动画因子,计算所述第一显示层和所述第二显示层的缩放因子;
显示颜色确定模块1620,用于根据所述第一动画因子,确定所述第一显示层和所述第二显示层的显示颜色;
居中显示模块1630,用于根据所述第一动画因子,对所述第一显示层和所述第二显示层作居中显示。
请参见图17,所述装置还可以包括:
第一动画帧序列确定模块1710,用于响应于第一触发请求,确定与目标对象展开过程相对应的第一动画帧序列,其中,所述目标对象包括若干所述显示层;
第一动画展示模块1720,用于依次显示所述第一动画帧序列中的图片,形成所述目标对象的展开动画,所述第一动画帧序列中的每张帧图片均包括所述目标对象。
其中,其参见图18,所述第一动画帧序列确定模块1710包括:
第二动画因子获取模块1810,用于获取第二动画因子递增序列;
展开图片确定模块1820,用于根据所述第二动画因子递增序列构建所述第一动画帧序列,所述第一动画帧序列中的每张帧图片均根据所述目标对象和所述第二动画因子递增序列中相应的第二动画因子计算而得。
请参见图19,所述装置还包括:
第二动画帧序列确定模块1910,用于确定与目标对象聚集过程相对应的第二动画帧序列,其中,所述目标对象包括若干所述显示层;
第二动画展示模块1920,用于依次显示所述第二动画帧序列中的图片,形成所述目标对象的聚集动画,所述第二动画帧序列中的每张帧图片均包括所述目标对象;
隐藏模块1930,用于获取当前的切换位置,确定与所述切换位置最近的目标显示层,隐藏所述目标显示层以上的显示层。
其中,请参见图20,所述第二动画帧序列确定模块1910包括:
第三动画因子获取模块2010,用于获取第三动画因子递减序列;
聚集图片确定模块2020,用于根据所述第三动画因子递减序列构建所述第二动画帧序列,所述第二动画帧序列中的每张帧图片均根据所述目标对象和所述第三动画因子递减序列中相应的第三动画因子计算而得。
上述实施例中提供的装置可执行本发明任意实施例所提供方法,具备执行该方法相应的功能模块和有益效果。未在上述实施例中详尽描述的技术细节,可参见本发明任意实施例所提供的方法。
本实施例还提供了一种计算机可读存储介质,所述存储介质中存储有计算机可执行指令,所述计算机可执行指令由处理器加载并执行本实施例中的任一方法。
本实施例还提供了一种设备,所述设备包括处理器以及存储器,其中所述处理器用于调用并执行所述存储器中存储的程序,所述存储器用于存储程序,所述程序用于实现本实施例中的任一方法。
需要说明的是,以上具体是以室内图切换展示为例来说明本申请的,但是本申请技术方案并不仅限于室内图显示领域,本申请可以适用于任何需要通过对目标对象进行展开以获取内部详细结构信息的应用场景。
本发明实施例根据用户操作游标而确定的切换位置,生成与当前切换位置相对应的切换状态图,其中切换位置位浮点数;随着用户不断地切换位置,通过展示相应的切换状态图形成了切换动画,解决了现有技术中只能切换到整数显示层而缺少中间切换过渡过程,从而造成切换过程生硬的问题,实现了显示层之间切换的平滑过渡;极大地改进了用户体验,也让室内图产品形态更加有趣,同时保持了可用性。
另外,本实施例中的游标读数是是一个线性的值,关联的是2D中的x轴,显示层切换动画中各种变量是y轴。基于x变量,y可以是任何函数,线性的非线性的,本实施例中的高度变化采用了非线性的四次方曲线,其他变量(颜色,透明度,高度,大小等)均是简单的线性变化函数,使用其他动画曲线函数也属于本专利保护范围。
本说明书提供了如实施例或流程图所述的方法操作步骤,但基于常规或者无创造性的劳动可以包括更多或者更少的操作步骤。实施例中列举的步骤和顺序仅仅为众多步骤执行顺序中的一种方式,不代表唯一的执行顺序。在实际中的系统或中断产品执行时,可以按照实施例或者附图所示的方法顺序执行或者并行执行(例如并行处理器或者多线程处理的环境)。
本实施例中所示出的结构,仅仅是与本申请方案相关的部分结构,并不构成对本申请方案所应用于其上的设备的限定,具体的设备可以包括比示出的更多或更少的部件,或者组合某些部件,或者具有不同的部件的布置。应当理解到,本实施例中所揭露的方法、装置等,可以通过其它的方式实现。例如,以上所描述的装置实施例仅仅是示意性的,例如,所述模块的划分仅仅为一种逻辑功能的划分,实际实现时可以有另外的划分方式。基于这样的理解,本发明的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质中,包括若干指令用以使得一台计算机设备(可以是个人计算机,服务器,或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。而前述的存储介质包括:U盘、移动硬盘、只读存储器(ROM,Read-Only Memory)、随机存取存储器(RAM,Random Access Memory)、磁碟或者光盘等各种可以存储程序代码的介质。
本领域技术人员还可以进一步意识到,结合本说明书所公开的实施例描述的各示例的单元及算法步骤,能够以电子硬件、计算机软件或者二者的结合实现,为了清楚地说明硬件和软件的可互换性,在上述说明中已经按照功能一般性地描述了各示例的组成及步骤。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能,但这种实现不应认为超出本发明的范围。
以上所述,以上实施例仅用以说明本发明的技术方案,而非对其限制;尽管参照前述实施例对本发明进行了详细的说明,本领域的普通技术人员应当理解:其依然可以对前述各实施例所记载的技术方案进行修改,或者对其中部分技术特征进行等同替换;而这些修改或者替换,并不使相应技术方案的本质脱离本发明各实施例技术方案的精神和范围。
Claims (10)
1.一种动画展示方法,其特征在于,包括:
响应于显示层切换查看请求,确定当前所在的切换位置,根据所述切换位置确定第一动画因子,以及确定与所述切换位置相邻的第一显示层和第二显示层,其中,所述切换位置位于所述第一显示层和所述第二显示层之间;
根据所述第一动画因子,确定所述第一显示层和所述第二显示层的显示格式;
获取原始显示层详情图,根据所述显示格式对所述原始显示层详情图中的所述第一显示层和所述第二显示层进行调整,生成与所述切换位置相对应的切换状态图,并显示所述切换状态图;
重复以上步骤直至接收到显示层切换停止请求,所述显示层切换过程中显示的若干所述切换状态图形成所述显示层切换动画。
2.根据权利要求1所述的一种动画展示方法,其特征在于,响应于显示层切换查看请求,确定当前所在的切换位置,根据所述切换位置确定第一动画因子,以及确定与所述切换位置相邻的第一显示层和第二显示层包括:
当检测到控件中的游标滑动操作时,记录当前的游标读数,其中,所述游标读数为浮点数;
对所述游标读数进行取整操作;
确定所述游标读数的小数部分为所述第一动画因子;
确定与所述游标读数的整数部分数值对应的层级为第一显示层。
3.根据权利要求2所述的一种动画展示方法,其特征在于,所述根据所述第一动画因子,确定所述第一显示层和所述第二显示层的显示格式包括:
根据所述第一动画因子,计算所述第一显示层和所述第二显示层的缩放因子;
根据所述第一动画因子,确定所述第一显示层和所述第二显示层的显示颜色;
根据所述第一动画因子,对所述第一显示层和所述第二显示层作居中显示。
4.根据权利要求1所述的一种动画展示方法,其特征在于,所述响应于显示层切换查看请求,确定当前所在的切换位置之前还包括:
响应于第一触发请求,确定与目标对象展开过程相对应的第一动画帧序列,其中,所述目标对象包括若干所述显示层;
依次显示所述第一动画帧序列中的图片,形成所述目标对象的展开动画,所述第一动画帧序列中的每张帧图片均包括所述目标对象;
其中,所述第一动画帧序列的确定方法包括:
获取第二动画因子递增序列;
根据所述第二动画因子递增序列构建所述第一动画帧序列,所述第一动画帧序列中的每张帧图片均根据所述目标对象和所述第二动画因子递增序列中相应的第二动画因子计算而得。
5.根据权利要求1所述的一种动画展示方法,其特征在于,所述接收到显示层切换停止请求之后还包括:
确定与目标对象聚集过程相对应的第二动画帧序列,其中,所述目标对象包括若干所述显示层;
依次显示所述第二动画帧序列中的图片,形成所述目标对象的聚集动画,所述第二动画帧序列中的每张帧图片均包括所述目标对象;
获取当前的切换位置,确定与所述切换位置最近的目标显示层,隐藏所述目标显示层以上的显示层;
其中,所述第二动画帧序列的确定方法包括:
获取第三动画因子递减序列;
根据所述第三动画因子递减序列构建所述第二动画帧序列,所述第二动画帧序列中的每张帧图片均根据所述目标对象和所述第三动画因子递减序列中相应的第三动画因子计算而得。
6.一种动画展示装置,其特征在于,包括:
位置确定模块,用于响应于显示层切换查看请求,确定当前所在的切换位置,根据所述切换位置确定第一动画因子,以及确定与所述切换位置相邻的第一显示层和第二显示层,其中,所述切换位置位于所述第一显示层和所述第二显示层之间;
显示格式确定模块,用于根据所述第一动画因子,确定所述第一显示层和所述第二显示层的显示格式;
切换状态图生成模块,用于获取原始显示层详情图,根据所述显示格式对所述原始显示层详情图中的所述第一显示层和所述第二显示层进行调整,生成与所述切换位置相对应的切换状态图,并显示所述切换状态图;
切换动画展示模块,用于重复执行上述模块相应的操作直至接收到显示层切换停止请求,所述显示层切换过程中显示的若干所述切换状态图形成所述显示层切换动画。
7.根据权利要求6所述的一种动画展示装置,其特征在于,所述位置确定模块包括:
读数检测模块,用于当检测到控件中的游标滑动操作时,记录当前的游标读数,其中,所述游标读数为浮点数;
取整模块,用于对所述游标读数进行取整操作;
第一确定模块,用于确定所述游标读数的小数部分为所述第一动画因子;
第二确定模块,用于确定与所述游标读数的整数部分数值对应的层级为第一显示层。
8.根据权利要求7所述的一种动画展示装置,其特征在于,所述显示格式确定模块包括:
缩放因子计算模块,用于根据所述第一动画因子,计算所述第一显示层和所述第二显示层的缩放因子;
显示颜色确定模块,用于根据所述第一动画因子,确定所述第一显示层和所述第二显示层的显示颜色;
居中显示模块,用于根据所述第一动画因子,对所述第一显示层和所述第二显示层作居中显示。
9.一种计算机存储介质,其特征在于,所述存储介质中存储有至少一条指令、至少一段程序、代码集或指令集,所述至少一条指令、至少一段程序、代码集或指令集由处理器加载并执行如权利要求1至5任一项所述的动画展示方法。
10.一种设备,其特征在于,包括:处理器以及存储器,其中所述处理器用于调用并执行所述存储器中存储的程序,所述存储器用于存储程序,所述程序用于实现如权利要求1至5任一项所述的动画展示方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201910238259.2A CN110047120B (zh) | 2019-03-27 | 2019-03-27 | 一种动画展示方法及装置 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201910238259.2A CN110047120B (zh) | 2019-03-27 | 2019-03-27 | 一种动画展示方法及装置 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN110047120A true CN110047120A (zh) | 2019-07-23 |
CN110047120B CN110047120B (zh) | 2023-09-08 |
Family
ID=67275407
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201910238259.2A Active CN110047120B (zh) | 2019-03-27 | 2019-03-27 | 一种动画展示方法及装置 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN110047120B (zh) |
Cited By (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN112214856A (zh) * | 2020-11-04 | 2021-01-12 | 上海理工大学 | 面向整体结构的精密机床刚度优化设计方法 |
CN112882638A (zh) * | 2021-02-23 | 2021-06-01 | 上海哔哩哔哩科技有限公司 | 多图层动画展示方法及装置 |
Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20150121263A1 (en) * | 2013-10-31 | 2015-04-30 | Fih (Hong Kong) Limited | Display device and method for navigating between display layers thereof |
CN104699437A (zh) * | 2015-03-23 | 2015-06-10 | 联想(北京)有限公司 | 一种显示方法和电子设备 |
CN105607917A (zh) * | 2014-11-19 | 2016-05-25 | 阿里巴巴集团控股有限公司 | 一种页面加载方法及装置 |
CN105869201A (zh) * | 2016-03-25 | 2016-08-17 | 北京全景思维科技有限公司 | 在全景漫游中实现全景视图平滑切换的方法及装置 |
CN108319414A (zh) * | 2018-01-31 | 2018-07-24 | 北京小米移动软件有限公司 | 界面显示方法及装置 |
-
2019
- 2019-03-27 CN CN201910238259.2A patent/CN110047120B/zh active Active
Patent Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20150121263A1 (en) * | 2013-10-31 | 2015-04-30 | Fih (Hong Kong) Limited | Display device and method for navigating between display layers thereof |
CN105607917A (zh) * | 2014-11-19 | 2016-05-25 | 阿里巴巴集团控股有限公司 | 一种页面加载方法及装置 |
CN104699437A (zh) * | 2015-03-23 | 2015-06-10 | 联想(北京)有限公司 | 一种显示方法和电子设备 |
CN105869201A (zh) * | 2016-03-25 | 2016-08-17 | 北京全景思维科技有限公司 | 在全景漫游中实现全景视图平滑切换的方法及装置 |
CN108319414A (zh) * | 2018-01-31 | 2018-07-24 | 北京小米移动软件有限公司 | 界面显示方法及装置 |
Cited By (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN112214856A (zh) * | 2020-11-04 | 2021-01-12 | 上海理工大学 | 面向整体结构的精密机床刚度优化设计方法 |
CN112882638A (zh) * | 2021-02-23 | 2021-06-01 | 上海哔哩哔哩科技有限公司 | 多图层动画展示方法及装置 |
CN112882638B (zh) * | 2021-02-23 | 2022-08-26 | 上海哔哩哔哩科技有限公司 | 多图层动画展示方法及装置 |
Also Published As
Publication number | Publication date |
---|---|
CN110047120B (zh) | 2023-09-08 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
EP2469474B1 (en) | Creation of a playable scene with an authoring system | |
US8593475B2 (en) | Systems and methods for dynamic procedural texture generation management | |
KR102294134B1 (ko) | 하이브리드 슬라이드-캔버스 프리젠테이션을 합성하기 위한 저작 도구 | |
KR101087520B1 (ko) | 3d 그래픽스 파이프라인의 자동 로드 밸런싱 | |
CN105912234B (zh) | 虚拟场景的交互方法和装置 | |
CN111161392B (zh) | 一种视频的生成方法、装置及计算机系统 | |
WO2021135320A1 (zh) | 一种视频的生成方法、装置及计算机系统 | |
CN110674341A (zh) | 特效处理方法、装置、电子设备及存储介质 | |
CN114669047B (zh) | 一种图像处理方法、电子设备及存储介质 | |
CN109993822B (zh) | 一种水墨风格渲染方法和装置 | |
CN110047120A (zh) | 一种动画展示方法及装置 | |
WO2005073925A1 (en) | Image rendering with multi-level z-buffers | |
CN112070875A (zh) | 图像处理方法、装置、电子设备和存储介质 | |
US11625900B2 (en) | Broker for instancing | |
CN111210486B (zh) | 一种用于实现流光效果的方法和装置 | |
CN115335866A (zh) | 在渲染时通过几何图形分析进行几何图形的高效多gpu渲染的系统和方法 | |
CN111402369A (zh) | 互动广告的处理方法、装置、终端设备及存储介质 | |
Maleshkov et al. | Affordable virtual reality system architecture for representation of implicit object properties | |
KR100469820B1 (ko) | 화면 갱신 방법 및 그 시스템 | |
CN115167940A (zh) | 3d文件加载方法及装置 | |
CN114191815A (zh) | 一种游戏中的显示控制方法和装置 | |
CN113672280A (zh) | 动画播放程序包编写方法、装置、电子设备及存储介质 | |
CN116302296B (zh) | 资源预览方法、装置、设备及存储介质 | |
CN116071217A (zh) | 渲染管线的配置方法、装置、设备及存储介质 | |
CN110262798B (zh) | 基于WebGL的图形绘制方法、装置、运行器及可读存储介质 |
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 |