欢迎光临散文网 会员登陆 & 注册

DragonBones导入Cocos Creator黑边问题

2021-01-13 13:03 作者:Nad_H  | 我要投稿

问题描述:

龙骨(DragonBones)动画导入Cocos Creator以后,发现了素材有黑边,并且在龙骨导出的png图集纹理图中也可以直观发现图片有黑色边缘。

             

黑色边缘

执行解决方案后



解决方案:

   方案一

  1. 在资源管理器中选中图集数据,在属性检查器中勾选Premultiply Alpha 选项             

          

勾选Premultiply Alpha 选项


  2.在层级管理器中选中骨骼数据,在属性检查器中Materials内勾选Premultiplied Alpha

Premultiplied Alpha

             

           

方案二

在资源管理器中选中图集纹理,在属性检查器中Filter Mode选择Point

           

选择Point

           

方案三

技术后台设置

注意:

方案1中设置完成后有一定概率出现实时预览中具有不透明度的素材会全白,具有alpha通道的素材会有白边,cocos预览播放时正常的。          

扩展:

DragonBones 骨骼动画资源:

  • .json/.dbbin 骨骼数据

  • .json 图集数据

  • .png 图集纹理

           

从上到下

 cocos官方对图片素材的黑边问题解决方案

图片黑边问题

当图片资源导入到编辑器中时,默认使用的过滤方式(Filter Mode)为线性插值(Bilinear)。而对于 Sprite 组件,默认的 SrcBlendFactor 为 SRC_ALPHA。在这种条件下,对于有半透明像素的 PNG 图片,在编辑器及预览时半透明边缘通常会有黑边问题。原因是因为低分辨率的图片在显示到更高分辨率的显示设备上时,会进行上采样(upsampling),也就是图像插值(interpolating)。在做像素插值时,半透明边缘与透明像素(0,0,0,0)插值之后会产生低透明度的黑色像素。避免图片的黑边问题通常有如下几种方式:

  1. 过滤方式(Filter Mode)使用 Point 模式。(推荐使用, 需要能够接受该模式带来的锯齿问题)

  2. 当图片在 PS 等工具中制作时,增加背景图层,图层颜色设置成与半透明边缘相同的颜色,然后设置背景图层的透明度为很低的值,如 1/100。(推荐使用)

  3. 在图片导出时,设置为较高的分辨率,避免显示到设备时进行图像插值放大。(不推荐使用)

  4. 引擎的自动图集提供了扩边选项,勾选该选项时,编辑器会自动对半透明图片边缘进行扩边处理,以此来避免黑边问题。需要注意的是,自动图集只有构建之后才会生效,在编辑器及预览时不会生效。其他图集打包工具一般也会有类似的处理选项(推荐使用)

  5. 设置 Sprite 的 SrcBlendFactor 为 ONE,对图片进行预乘处理,但是可能会影响到图片的批次合并,需要开发者视使用场景决定。(需要同步勾选图片的 Premultiply Alpha 选项)



DragonBones导入Cocos Creator黑边问题的评论 (共 条)

分享到微博请遵守国家法律