帧动画的渲染方法、装置、计算机设备及存储介质制造方法及图纸

技术编号:27320085 阅读:21 留言:0更新日期:2021-02-10 09:59
本申请是关于一种帧动画的渲染方法、装置、计算机设备及存储介质,属于图片处理技术领域。该方法包括:通过主线程创建的工作线程获取计算机设备的渲染方式支持信息,基于渲染方式支持信息,从至少两种渲染方式中选择目标渲染方式;至少两种渲染方式中包含第一渲染方式和第二渲染方式,第一渲染方式是基于图像处理器进行渲染的方式,第二渲染方式是基于中央处理器进行渲染的方式;基于目标渲染方式,对帧动画中的各帧图片进行逐帧渲染。通过上述方案,可以避免了主线程发生阻塞时对帧动画渲染产生的影响,提高了各帧图片的渲染速度,进而提高了帧动画的渲染效率。提高了帧动画的渲染效率。提高了帧动画的渲染效率。

【技术实现步骤摘要】
帧动画的渲染方法、装置、计算机设备及存储介质


[0001]本申请涉及图片处理
,特别涉及一种帧动画的渲染方法、装置、计算机设备及存储介质。

技术介绍

[0002]如今,随着用户对动画需求的提升,通过Gif图或者Apng图实现帧动画的方式由于分辨率以及展示效果的受限,逐渐被终端设备淘汰,随着终端设备的性能日益提高,可以通过HTML5的原生功能Canvas,实现简单的帧动画。
[0003]在相关技术中,利用Canvas实现帧动画,由于Canvas具有的2DAPI可以对帧图片进行渲染,并且绝大多数的终端设备支持HTML5的原生功能Canvas,所以通过Canvas对各个帧图片进行渲染,然后可以根据各个帧图片对应的定时器播放生成帧动画。
[0004]然而,相关技术中通过Canvas对各个帧图片进行渲染可能导致帧图片渲染速度较慢,进而导致帧动画的渲染效率较低。

技术实现思路

[0005]本申请实施例提供了一种帧动画的渲染方法、装置、计算机设备及存储介质,可以提高帧动画的渲染效率。该技术方案包括如下内容:
[0006]一方面,提供了一种帧动画的渲染方法,所述方法由计算机设备执行,所述方法包括:
[0007]响应于所述帧动画所处的页面中存在第一元素,通过主线程创建工作线程;所述第一元素用于指示支持图形绘制;所述主线程用于执行用户操作;所述工作线程是与所述主线程并行执行的线程;
[0008]通过所述工作线程获取所述计算机设备的渲染方式支持信息,所述渲染方式支持信息用于指示所述计算机设备对至少两种渲染方式的支持情况;
[0009]基于所述渲染方式支持信息,通过所述工作线程从所述至少两种渲染方式中选择目标渲染方式;所述至少两种渲染方式中包含第一渲染方式和第二渲染方式,所述第一渲染方式是基于图像处理器进行渲染的方式,所述第二渲染方式是基于中央处理器进行渲染的方式;所述第一渲染方式的优先级高于所述第二渲染方式的优先级;
[0010]基于所述目标渲染方式,通过所述工作线程对所述帧动画中的各帧图片进行逐帧渲染;所述帧动画是对所述各帧图片依序进行展示实现的动画。
[0011]一方面,提供了一种帧动画的渲染装置,所述装置用于计算机设备中,所述装置包括:
[0012]线程创建模块,用于响应于所述帧动画所处的页面中存在第一元素,通过主线程创建工作线程;所述第一元素用于指示支持图形绘制;所述主线程用于执行用户操作;所述工作线程是与所述主线程并行执行的线程;
[0013]信息获取模块,用于通过所述工作线程获取所述计算机设备的渲染方式支持信
息,所述渲染方式支持信息用于指示所述计算机设备对至少两种渲染方式的支持情况;
[0014]目标选择模块,用于基于所述渲染方式支持信息,通过所述工作线程从所述至少两种渲染方式中选择目标渲染方式;所述至少两种渲染方式中包含第一渲染方式和第二渲染方式,所述第一渲染方式是基于图像处理器进行渲染的方式,所述第二渲染方式是基于中央处理器进行渲染的方式;所述第一渲染方式的优先级高于所述第二渲染方式的优先级;
[0015]图片渲染模块,用于基于所述目标渲染方式,通过所述工作线程对所述帧动画中的各帧图片进行逐帧渲染;所述帧动画是对所述各帧图片依序进行展示实现的动画。
[0016]在一种可能的实现方式中,所述信息获取模块,包括:
[0017]创建结果获取子模块,用于通过所述工作线程创建所述第一渲染方式的渲染上下文,获得所述第一渲染方式的渲染上下文的创建结果;
[0018]所述目标选择模块,包括:
[0019]第一目标选择子模块,用于响应于所述创建结果指示所述第一渲染方式的渲染上下文创建正确,通过所述工作线程将所述第一渲染方式选择为所述目标渲染方式;
[0020]第二目标选择子模块,用于响应于所述创建结果指示所述第一渲染方式的渲染上下文创建错误,通过所述工作线程将所述第二渲染方式选择为所述目标渲染方式。
[0021]在一种可能的实现方式中,所述信息获取模块,包括:
[0022]状态获取子模块,用于通过所述工作线程获取所述第一渲染方式的上下文状态,所述上下文状态用于指示所述计算机设备是否支持所述第一渲染方式;
[0023]所述目标选择模块,包括:
[0024]第三目标选择子模块,用于响应于所述上下文状态指示所述计算机设备支持所述第一渲染方式,通过所述工作线程将所述第一渲染方式选择为所述目标渲染方式;
[0025]第四目标选择子模块,用于响应于所述上下文状态指示所述计算机设备不支持所述第一渲染方式,通过所述工作线程将所述第二渲染方式选择为所述目标渲染方式。
[0026]在一种可能的实现方式中,所述图片渲染模块,包括:
[0027]图片加载子模块,用于通过所述工作线程加载所述帧动画中的各帧图片;
[0028]管理器创建子模块,用于通过所述工作线程创建所述帧动画的事件管理器,所述事件管理器用于管理事件容器,所述事件容器包含所述各帧图片中,除了首帧图片之外的其它图片对应的动画翻页事件所述动画翻页事件对应有预期触发时间;
[0029]图片渲染子模块,用于基于所述目标渲染方式,通过所述工作线程按照所述预期触发时间对所述其它图片进行逐帧渲染。
[0030]在一种可能的实现方式中,所述图片渲染子模块,包括:
[0031]事件查询单元,用于在开始展示所述其它图片中的一帧图片时,通过所述工作线程查询所述事件容器中是否包含所述预期触发时间到达的事件;
[0032]图片渲染单元,用于响应于存在所述预期触发时间到达的事件,且所述预期触发时间到达的事件是所述动画翻页事件,基于所述目标渲染方式,通过所述工作线程渲染所述预期触发时间到达的事件对应的图片。
[0033]在一种可能的实现方式中,所述事件容器中还包含用户注册事件,所述装置还包括:
[0034]事件执行单元,用于响应于存在所述预期触发时间到达的事件,且所述预期触发时间到达的事件是所述用户注册事件,执行所述用户注册事件。
[0035]在一种可能的实现方式中,所述装置还包括:
[0036]事件销毁单元,用于响应于存在所述预期触发时间到达的事件,且所述预期触发时间到达的事件是暂停播放所述帧动画的事件,销毁所述事件容器中剩余的所述动画翻页事件。
[0037]在一种可能的实现方式中,所述装置还包括:
[0038]事件创建单元,用于响应于存在所述预期触发时间到达的事件,且所述预期触发时间到达的事件是继续播放所述帧动画或者重新播放所述帧动画的事件,在所述事件容器中创建继续播放所述帧动画或者重新播放所述帧动画的所述动画翻页事件。
[0039]在一种可能的实现方式中,所述图片加载子模块,包括:
[0040]首帧图片加载单元,用于通过第一工作线程加载所述各帧图片中的首帧图片;
[0041]其它图片加载单元,用于通过第二工作线程加载所述各帧图本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种帧动画的渲染方法,其特征在于,所述方法由计算机设备执行,所述方法包括:响应于所述帧动画所处的页面中存在第一元素,通过主线程创建工作线程;所述第一元素用于指示支持图形绘制;所述主线程用于执行用户操作;所述工作线程是与所述主线程并行执行的线程;通过所述工作线程获取所述计算机设备的渲染方式支持信息,所述渲染方式支持信息用于指示所述计算机设备对至少两种渲染方式的支持情况;基于所述渲染方式支持信息,通过所述工作线程从所述至少两种渲染方式中选择目标渲染方式;所述至少两种渲染方式中包含第一渲染方式和第二渲染方式,所述第一渲染方式是基于图像处理器进行渲染的方式,所述第二渲染方式是基于中央处理器进行渲染的方式;所述第一渲染方式的优先级高于所述第二渲染方式的优先级;基于所述目标渲染方式,通过所述工作线程对所述帧动画中的各帧图片进行逐帧渲染;所述帧动画是对所述各帧图片依序进行展示实现的动画。2.根据权利要求1所述的方法,其特征在于,所述通过所述工作线程获取所述计算机设备的渲染方式支持信息,包括:通过所述工作线程创建所述第一渲染方式的渲染上下文,获得所述第一渲染方式的渲染上下文的创建结果;所述基于所述渲染方式支持信息,通过所述工作线程从所述至少两种渲染方式中选择目标渲染方式,包括:响应于所述创建结果指示所述第一渲染方式的渲染上下文创建正确,通过所述工作线程将所述第一渲染方式选择为所述目标渲染方式;响应于所述创建结果指示所述第一渲染方式的渲染上下文创建错误,通过所述工作线程将所述第二渲染方式选择为所述目标渲染方式。3.根据权利要求1所述的方法,其特征在于,所述通过所述工作线程获取所述计算机设备的渲染方式支持信息,包括:通过所述工作线程获取所述第一渲染方式的上下文状态,所述上下文状态用于指示所述计算机设备是否支持所述第一渲染方式;所述基于所述渲染方式支持信息,通过所述工作线程从所述至少两种渲染方式中选择目标渲染方式,包括:响应于所述上下文状态指示所述计算机设备支持所述第一渲染方式,通过所述工作线程将所述第一渲染方式选择为所述目标渲染方式;响应于所述上下文状态指示所述计算机设备不支持所述第一渲染方式,通过所述工作线程将所述第二渲染方式选择为所述目标渲染方式。4.根据权利要求1至3任一所述的方法,其特征在于,所述基于所述目标渲染方式,通过所述工作线程对所述帧动画中的各帧图片进行逐帧渲染,包括:通过所述工作线程加载所述帧动画中的各帧图片;通过所述工作线程创建所述帧动画的事件管理器,所述事件管理器用于管理事件容器,所述事件容器包含所述各帧图片中,除了首帧图片之外的其它图片对应的动画翻页事件,所述动画翻页事件对应有预期触发时间;基于所述目标渲染方式,通过所述工作线程按照所述预期触发时间对所述其它图片进
行逐帧渲染。5.根据权利要求4所述的方法,其特征在于,所述基于所述目标渲染方式,通过所述工作线程按照所述预期触发时间对所述其它图片进行逐帧渲染,包括:在开始展示所述其它图片中的一帧图片时,通过所述工作线程查询所述事件容器中是否包含所述预期触发时间到达的事件;响应于存在所述预期触发时间到达的事件,且所述预期触发时间到达的事件是所述动画翻页事件,基于所述目标渲染方式,通过所述工作线程渲染所述预期触发时间到达的事件对应的图片。6.根据权利要求5所述的方法,其特征在于,所述事件容器中还包含用户注册事件,所述方法还包括:响应于存在所述预期触发时间...

【专利技术属性】
技术研发人员:徐超
申请(专利权)人:腾讯科技深圳有限公司
类型:发明
国别省市:

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

1