如何使用alpha混合和粒子实现良好的射击效果?


41

对OpenGL粒子效果使用以下设置:

SRC: GL_SRC_ALPHA
DST: GL_ONE

创建一种添加剂混合物,当它开始褪色为白色时,它在黑色背景上看起来很壮观,但在较亮的颜色上却很糟糕。

然后,我使用了alpha混合:

SRC: GL_SRC_ALPHA
DST: GL_ONE_MINUS_SRC_ALPHA

这允许使用其他背景而不影响颗粒的颜色,但是与添加剂共混物相比,颗粒本身看起来暗淡无光。如何使用alpha混合和粒子实现良好的射击效果?

添加剂:

黑色添加剂 蓝色添加剂

Α:

黑色的阿尔法 蓝色的阿尔法

更新:

按照David的建议,我创建了一个单独的纹理,然后在绘制纹理之前对粒子效果使用了添加剂混合。这样做的问题是,在alpha = 0的纹理上绘制只会导致粒子的彩色部分出现在我的世界地图的前面,因为通常您使用的是黑色背景。诀窍是使用两个纹理。我创建了一个黑色纹理,然后在其上绘制了粒子。然后,我从该纹理中删除了粒子的alpha层,有效地删除了所有周围的纯黑色并淡化了部分可见的粒子,同时保留了在黑色背景上制作添加剂混合粒子时所期望的底层黑色。简而言之,这是一个艰苦的过程,但我最终到达了那里:

常规添加剂和我的版本

这是我发布流程的线程:http : //www.cocos2d-iphone.org/forum/topic/28707?replies=8#post-141528

视频:http : //www.youtube.com/watch?v=JptGbEO3b5E

Answers:


17

我承认我不知道有什么理想的解决方案可以解决此问题,因此,我将介绍您可能会也可能不满意的解决方法:

  1. 使用添加混合将所有粒子渲染到单独的纹理(或渲染目标),并将其背景清除为透明。
  2. 使用alpha blending在场景顶部渲染该纹理(或渲染目标)。

我在Photoshop中尝试了一下,这是我得到的-它并不完美,但至少可以更好地保留原始颜色:

在此处输入图片说明

这是原始纹理,未在粒子上进行添加剂混合:

在此处输入图片说明


是否会将它们分成两个纹理,就像将添加剂混合的纹理绘制到背景上一样?
— Aram Kocharyan 2012年

@AramKocharyan实际上,除了在Photoshop中,我个人还没有尝试过,因为结果看起来很合理。但我认为它看起来应该像您的第一张照片,但所有黑色都被替换为背景色。换句话说,这些粒子被添加到一起,从而在爆炸的中间产生了较大的高光,但没有背景。然后,将生成的爆炸粘贴到背景顶部,而不进行添加,从而保留原始外观。
— David Gouveia 2012年

正是由于这样,它才像是Photoshop中的普通混合与叠加层一样,但它看起来就像是位于背景层上的叠加层的图像。我会尝试的,并让您知道。
— Aram Kocharyan

@AramKocharyan我将在几分钟后发布我在photoshop中获得的结果,以便您进行比较。
— David Gouveia 2012年

5
只是把它扔出去-这种技术可能会引起性能问题...
— notlesh 2012年


4

正如David Gouveia所指出的那样,在明亮的背景上没有令人满意的替代品来替代添加剂混合。我发现最好的效果(不需要像渲染到后缓冲区)是使用以下GL blendmode:

SRC: GL_ONE
DST: GL_ONE_MINUS_SRC_ALPHA

它不如添加剂混合好,但比更好GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA。如果您稍微调整开始和结束的alpha和颜色值,则可能会获得与增色混合非常接近的结果。

粒子混合模式

在GL_SRC_ALPHA, GL_ONE上图的左侧,在中间GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA的右侧,您可以看到我为此设置建议的混合模式。


我同意,要完全控制颜色,此方法效果很好。
— Aram Kocharyan 2012年

请注意,我注意到,使用这种方法淡出火光的最佳方法是使其减小到零大小,因为减小的alpha值会使其逐渐变成白色。
— Aram Kocharyan

3

您是否尝试过同时使用两者?通过alpha混合在某些粒子上分层,这应该使颜色以您想要的方式显示,然后再进行一些添加剂混合即可获得所需的亮点。


那可能是我的下一个选择,尽管我想将粒子保持在最低限度。希望我能两者兼得。
— Aram Kocharyan 2012年

3

首先,您正在使用的粒子图像似乎具有黑色背景,从而导致第二个图像中出现深色条纹。不要那样做 也就是说,不要在颜色通道上绘制粒子的形状。相反,图像应为单色,并且仅在Alpha通道中定义形状。

这样做将大大改善Alpha透明度的外观。然后,可以通过使粒子在其整个生命周期内改变颜色来进一步改善整体效果的外观。就像,基本图像非常明亮,为您提供中央明亮的黄色区域。然后将颗粒染成红橙色,并随时间增加色泽。这样,粒子从中心移出时将变暗。


是的,纹理只是白色画笔,其alpha值与中心不同。
— Aram Kocharyan 2012年

呵呵,如果这是真的,那对我来说很奇怪,您的Alpha透明度屏幕截图在粒子周围有那些暗淡的光晕。
— 2012年

是的,我不确定它们为什么围绕alpha混合形成。但是对于我现在所拥有的,这似乎很好。
— Aram Kocharyan


看起来不错,您应该将其放在问题更新中。
— 2012年
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.