多图层动画展示方法及装置制造方法及图纸

技术编号:28672276 阅读:13 留言:0更新日期:2021-06-02 02:47
本申请提供一种多图层动画展示方法及装置,其中所述多图层动画展示方法包括:对交互事件进行监测,所述交互事件中携带有交互事件的位置信息和多图层动画展示请求;在监测到交互事件的情况下,根据所述多图层动画展示请求计算所述位置信息相对于多图层动画中的各图层中心的偏移信息;根据预先保存的配置数据计算与所述各图层中心的偏移信息对应的图层显示属性;根据所述图层显示属性对各图层进行渲染,并将渲染后的各图层叠加生成目标动画并展示。所述多图层动画展示方法,不仅简化了多图层动画的制作和实现流程,还提高了用户对展示多图层动画的页面或者应用程序的体验性。

【技术实现步骤摘要】
多图层动画展示方法及装置
本申请涉及计算机
,特别涉及一种多图层动画展示方法。本申请同时涉及一种多图层动画展示装置,一种计算设备,以及一种计算机可读存储介质。
技术介绍
随着计算机技术的快速发展,各种各样的动画形式层出不穷,在有用户交互的动画展示领域,有用户交互的动画展示非常流行。根据用户输入的不同展示不同的动画效果,可以给用户一种耳目一新的感觉,会极大的提高用户对展示该动画的页面或者应用的观看兴趣。现有技术中,在实现有用户交互的动画效果时,通常方法是由设计师确定动画效果的具体设计以及对应的交互,然后由开发人员评审其可行性,在确认其可行后参照设计稿进行对应效果的实现,最后由设计师对实现效果进行验收,做细微调整后完成开发。然而上述方法中,开发过程中由于设计师和开发人员间缺乏统一的描述多图层动画的手段,导致此类任务的开发效率低、周期长、且会有开发人员完成的效果与设计预期不一致的情况。因此,急需提供一种简化多图层动画的制作和实现流程、提高开发效率的多图层动画展示方法。
技术实现思路
有鉴于此,本申请实施例提供了一种多图层动画展示方法。本申请同时涉及一种多图层动画展示装置,一种计算设备,以及一种计算机可读存储介质,以解决现有技术中开发效率低、周期长、以及完成效果与预期效果不一致的技术缺陷。根据本申请实施例的第一方面,提供了一种多图层动画展示方法,包括:对交互事件进行监测,所述交互事件中携带有交互事件的位置信息和多图层动画展示请求;在监测到交互事件的情况下,根据所述多图层动画展示请求计算所述位置信息相对于多图层动画中的各图层中心的偏移信息;根据预先保存的配置数据计算与所述各图层中心的偏移信息对应的图层显示属性;根据所述图层显示属性对各图层进行渲染,并将渲染后的各图层叠加生成目标动画并展示。可选地,所述根据所述多图层动画展示请求计算所述位置信息相对于多图层动画中的各图层中心的偏移信息,包括:根据多图层动画展示请求解析所述位置信息,通过预先设置的最大偏移量计算所述位置信息的解析结果相对于多图层动画中的各图层中心的偏移信息。可选地,所述根据预先保存的配置数据计算与所述各图层中心的偏移信息对应的图层显示属性,包括:根据配置数据中各图层的偏移曲线和偏移量计算与所述各图层中心的偏移信息对应的图层显示属性。可选地,在对交互事件进行监测之前,还包括:接收初始化指令,根据所述初始化指令获取各图层初始配置数据并保存;解析所述各图层初始配置数据,加载所述各图层初始配置数据中包含的文件资源,其中,所述文件资源包括视频和/或图片;根据所述初始化指令,通过各图层初始配置数据对各图层进行渲染,将渲染后的各图层叠加生成初始动画并展示。可选地,解析所述各图层初始配置数据,加载所述各图层初始配置数据中包含的文件资源,包括:解析所述各图层初始配置数据,将各图层初始配置数据中的文件资源加载为目标元素,其中,所述目标元素包括图片元素和/或视频元素。可选地,根据所述初始化指令,通过各图层初始配置数据对各图层进行渲染,将渲染后的各图层叠加生成初始动画并展示,包括:根据所述初始化指令,为各图层创建目标元素节点;通过所述各图层初始配置数据中的初始状态初始化各图层目标元素节点;根据初始化后的各图层目标元素节点对各图层进行渲染,将渲染后的各图层叠加生成初始动画并展示。可选地,在通过所述各图层初始配置数据中的初始状态初始化各图层目标元素节点之后,还包括:根据各图层初始配置数据中初始状态下的初始缩放和目标元素的尺寸计算各图层的宽度和高度,并确定缩放插值函数的参数值;根据各图层初始配置数据中初始状态下的初始位置确定位置插值函数的参数值;根据各图层初始配置数据中初始状态下的初始旋转确定旋转插值函数的参数值;和/或根据各图层初始配置数据中初始状态下的初始模糊确定模糊插值函数的参数值。可选地,所述各图层默认为居中显示。可选地,在将各图层初始配置数据中的文件资源加载为目标元素之后,还包括:根据所述目标元素生成对应的贴图。可选地,根据所述初始化指令,通过各图层初始配置数据对各图层进行渲染,将渲染后的各图层叠加生成初始动画并展示,包括:根据各图层初始数据配置中的初始状态初始化渲染各图层所需要的模型顶点数据,确定所述模型顶点数据的读取格式;初始化渲染器,并将所述贴图输入至所述渲染器;根据所述各图层初始配置数据设置渲染器,通过所述渲染器对各图层进行渲染,将渲染后的各图层叠加生成初始动画并展示。可选地,所述方法还包括:当所述交互事件的位置信息连续变化时,将所述位置信息按照时间阈值划分为至少两个子位置信息;根据所述多图层动画展示请求计算至少两个子位置信息相对于交互事件的初始位置的至少两个偏移信息,其中,每个子位置信息对应一个偏移信息;根据预先保存的配置数据计算与所述至少两个偏移信息对应的至少两个图层显示属性,其中,每个偏移信息对应一个图层显示属性;根据所述至少两个图层显示属性对各图层进行渲染,将渲染后的各图层叠加生成至少两个目标动画并展示。可选地,所述配置数据包括图层数组,所述图层数组中的每个元素代表一个图层,每个图层的属性包括图片配置/视频配置、初始状态、偏移状态、以及偏移曲线。根据本申请实施例的第二方面,提供了一种多图层动画展示装置,包括:监测模块,被配置为对交互事件进行监测,所述交互事件中携带有交互事件的位置信息和多图层动画展示请求;第一处理模块,被配置为在监测到交互事件的情况下,根据所述多图层动画展示请求计算所述位置信息相对于多图层动画中的各图层中心的偏移信息;第二处理模块,被配置为根据预先保存的配置数据计算与所述各图层中心的偏移信息对应的图层显示属性;展示模块,被配置为根据所述图层显示属性对各图层进行渲染,并将渲染后的各图层叠加生成目标动画并展示。根据本申请实施例的第三方面,提供了一种计算设备,包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机指令,所述处理器执行所述计算机指令时实现所述多图层动画展示方法的步骤。根据本申请实施例的第四方面,提供了一种计算机可读存储介质,其存储有计算机指令,该计算机指令被处理器执行时实现所述多图层动画展示方法的步骤。本申请提供的多图层动画展示方法,对交互事件进行监测,所述交互事件中携带有交互事件的位置信息和多图层动画展示请求;在监测到交互事件的情况下,根据所述多图层动画展示请求计算所述位置信息相对于多图层动画中的各图层中心的偏移信息;根据预先保存的配置数据计算与所述各图层中心的偏移信息对应的图层显示属性;根据所述图层显示属性对各图层进行渲染,并将渲染后的各图层叠加生成目标动画并展示。所述多图层动画展示方法通过对交互事件进行监测,可以实时地监测到用户与多图层动画之间的交互,根据配置数据和用户交本文档来自技高网...

【技术保护点】
1.一种多图层动画展示方法,其特征在于,包括:/n对交互事件进行监测,所述交互事件中携带有交互事件的位置信息和多图层动画展示请求;/n在监测到交互事件的情况下,根据所述多图层动画展示请求计算所述位置信息相对于多图层动画中的各图层中心的偏移信息;/n根据预先保存的配置数据计算与所述各图层中心的偏移信息对应的图层显示属性;/n根据所述图层显示属性对各图层进行渲染,并将渲染后的各图层叠加生成目标动画并展示。/n

【技术特征摘要】
1.一种多图层动画展示方法,其特征在于,包括:
对交互事件进行监测,所述交互事件中携带有交互事件的位置信息和多图层动画展示请求;
在监测到交互事件的情况下,根据所述多图层动画展示请求计算所述位置信息相对于多图层动画中的各图层中心的偏移信息;
根据预先保存的配置数据计算与所述各图层中心的偏移信息对应的图层显示属性;
根据所述图层显示属性对各图层进行渲染,并将渲染后的各图层叠加生成目标动画并展示。


2.根据权利要求1所述的方法,其特征在于,所述根据所述多图层动画展示请求计算所述位置信息相对于多图层动画中的各图层中心的偏移信息,包括:
根据多图层动画展示请求解析所述位置信息,通过预先设置的最大偏移量计算所述位置信息的解析结果相对于多图层动画中的各图层中心的偏移信息。


3.根据权利要求1所述的方法,其特征在于,所述根据预先保存的配置数据计算与所述各图层中心的偏移信息对应的图层显示属性,包括:
根据配置数据中各图层的偏移曲线和偏移量计算与所述各图层中心的偏移信息对应的图层显示属性。


4.根据权利要求1所述的方法,其特征在于,在对交互事件进行监测之前,还包括:
接收初始化指令,根据所述初始化指令获取各图层初始配置数据并保存;
解析所述各图层初始配置数据,加载所述各图层初始配置数据中包含的文件资源,其中,所述文件资源包括视频和/或图片;
根据所述初始化指令,通过各图层初始配置数据对各图层进行渲染,将渲染后的各图层叠加生成初始动画并展示。


5.根据权利要求4所述的方法,其特征在于,解析所述各图层初始配置数据,加载所述各图层初始配置数据中包含的文件资源,包括:
解析所述各图层初始配置数据,将各图层初始配置数据中的文件资源加载为目标元素,其中,所述目标元素包括图片元素和/或视频元素。


6.根据权利要求4所述的方法,其特征在于,根据所述初始化指令,通过各图层初始配置数据对各图层进行渲染,将渲染后的各图层叠加生成初始动画并展示,包括:
根据所述初始化指令,为各图层创建目标元素节点;
通过所述各图层初始配置数据中的初始状态初始化各图层目标元素节点;
根据初始化后的各图层目标元素节点对各图层进行渲染,将渲染后的各图层叠加生成初始动画并展示。


7.根据权利要求6所述的方法,其特征在于,在通过所述各图层初始配置数据中的初始状态初始化各图层目标元素节点之后,还包括:
根据各图层初始配置数据中初始状态下的初始缩放和目标元素的尺寸计算各图层的宽度和高度,并确定缩放插值函数的参数值;
根据各图层初始配置数据中初始状态下的初始位置确定位置插值函数的参数值;
根据各图层初始配置数据中初始状态下的初始旋转确定旋转插值...

【专利技术属性】
技术研发人员:申鹏飞
申请(专利权)人:上海哔哩哔哩科技有限公司
类型:发明
国别省市:上海;31

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1