Cocos2d - iPhone 上的月食效果

Cocos2d - lunar eclipse effect on iPhone(Cocos2d - iPhone 上的月食效果)

问题描述

我有一个关于实现像月食这样的效果的问题.效果应该看起来像这个 gif 的前几秒.所以就像一个黑色的阴影越过圆圈.理想的情况是一个函数，我可以传递一个百分比参数来获得这个数量作为圆圈上的阴影:

我面临的问题是我的背景是渐变的.所以不可能有一个在月球上移动的黑色圆圈来获得效果.

我用 CCClippingNode 尝试了一些东西，但它看起来不太好.此外，边缘的剪辑总是有点像素化.

我曾想过使用 GLSL Shader 之类的东西来实现效果，但我对 GLSL 不太熟悉，也找不到示例.

效果适用于为 iphone 开发的应用游戏.我使用的是版本3(当前版本)的cocos2d框架.

有人知道如何获得这种效果吗?我可以从哪里开始搜索?

提前谢谢你

i have a question about achieving an effect like on a lunar eclipse. The effect should look like in the first seconds of this gif. So just like a black shadow which goes over the circle. The ideal situation would be a function where i can passed a parameter in percentage to get this amount as a shadow on the circle:

The problem which i am facing is that my background is an gradient. So it's not possible to have a black circle which moves over the moon to get the effect.

I tried something with CCClippingNode but it looks not nice. Furthermore the clip on the edges was always a bit pixelated.

I thought about using something like a GLSL Shader to achieve the effect but i am not so familiar with GLSL and i can't find an example.

The effect is for an app game developed for an iphone. I use the cocos2d framework in version 3 (the current one).

Has somebody an idea how to get this effect? An idea where i can start to search?

Thank you in advance

The physics behind is simple you change the light shining on the moon. So

1. I would create a 1D gradient texture representing the lighting conditions

2. compute each rendered pixel of moon

   you obviously have the 2D texture of moon. So you now need to obtain the position of each pixel inside the 1D lighting texture. So if moon is fully visible you are in sunlight. When partially eclipsed then you are in the umbra region. And finaly while total eclipse you are in penumbra region. so just compute the middle point's of the moon position. And for the rest use relative position in the moons motion direction.

   So now just multiply the Moon surface with the lighting texture and render the output.

3. when working you can add the curvature correction

   Now you got linerly cutted Moon phases but the real phases are curved as the lighting conditions differs also with radial distance from motion direction and moons center. To fix this you can do

   • convert the lighting to 2D texture
   • or shift the texture coordinate by some curvature dependent on the radial distance

这篇关于Cocos2d - iPhone 上的月食效果的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！