Cocos2d - 月球效果对iPhone [英] Cocos2d - lunar eclipse effect on iPhone

问题描述

我有一个关于实现像月食的效果的问题。效果应该看起来像这个gif的第一秒。所以就像一个黑色的阴影，越过了圆圈。理想的情况是一个函数，其中我可以传递一个参数的百分比，得到这个金额作为一个阴影在圆上：

我尝试过 CCClippingNode 但它看起来不好。此外，边缘上的剪辑总是有点像素化。

我想过使用像GLSL着色器来实现效果，但我不太熟悉GLSL和i找不到一个例子。

效果是为iphone开发的应用程序游戏。我使用cocos2d框架在版本3（当前一个）。

有人有一个想法如何获得这种效果？

提前感谢您

解决方案

计算月亮的每个渲染像素

你显然有月亮的2D纹理。所以你现在需要获得每个像素在1D照明纹理内的位置。所以如果月亮完全可见，你在阳光下。当部分黯然失色，那么你在乌姆布地区。和最后，当全日食你在半影区。所以只需计算月球位置的中点。其余的使用在卫星运动方向的相对位置。

工作时可以添加曲率校正

strong>

现在你有了划线的月相，但是实际相位是弯曲的，因为照明条件也不同于从运动方向和卫星中心的径向距离。要解决此问题，您可以

• 将照明转换为2D纹理


• 由一些取决于径向距离的曲率

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的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！