이펙트

이펙트는 특별한 액션 중 하나입니다. opacity, position, rotation, scale 과 같은 속성을 변경하는 것 대신 새로운 속성 중 하나인 grid 속성을 변경하여 줍니다.

grid 속성은 매트릭스와 같습니다. 여러 사각 형태를 교차하는 선들의 네트웍입니다.

이 특별한 액션은 CocosNode 객체(Layer, Scene, Sprite, 등등)를 그리드로 랜더링하고 각 꼭지점들을 이동시켜서 그리드를 변형할 수 있습니다.

그리드는 두 가지가 있습니다. tiled 그리드와 non-tiled 그리드입니다. 차이점은 tiled 그리드는 개별 타일의 조합이고 non-tiled 그리드는 꼭지점들이 조합된 그리드입니다.

그리드는 row와 column 2차원으로 구성됩니다만, 그리드의 각 꼭지점은 x, y, z 3차원으로 구성되어 있습니다. 그래서 여러분은 tiled-grid-3D 또는 grid-3D 그리드를 변형하는 2d 또는 3d 이펙트를 만들 수 있습니다.

여러분은 그리드의 크기를 증가시켜서 이펙트의 품질을 향상시킬 수 있으나 이펙트의 속도는 떨어질 것입니다.

(16,12) 크기의 그리드는 대부분의 장치에서 빠르게 동장하지만 좋아보이지는 않을 겁니다. (32,24) 그리드는 괜찮아보이지만 iPhone 1세대에서는 빠르게 동작하지 않을 겁니다. ()

스크린의 각 프레임은 텍스쳐(FBO)로 렌더링됩니다. 텍스쳐는 하나의 버텍스 배열로 변형되고 버텍스 배열(그리드)는 그리드 이펙트에 의해 변형됩니다. 마지막으로 버텍스 배열은 스크린으로 렌더링됩니다.

내부 참조에 관하여는 다음을 참조하시기 바랍니다. :

• TiledGrid3D and TiledGrid3DAction tiled grids
• Grid3D and Grid3DAction non-tiled grids

예를 들면, 아래 이미지로 장면이나 레이어가 렌더링 됩니다.For example, if you have an scene or layer that renders this image:

..Ripple3D 액션을 사용하여 이미지를 변형할 수 있습니다. 선으로 된 이미지가 보여주는 것과 같이 32×24 정사각의 그리드를 사용하는 non-tiled 그리드입니다.(모든 정사각은 합쳐져있습니다.)

또는 FadeOutTRTiles 액션을 사용하여 이미지를 변형할 수 있습니다. 선으로 된 이미지가 보여주는 것과 같이 16×12 정사각의 그리드를 사용하는 tiled 그리드입니다.(모든 정사각은 나뉘어질 수 있습니다.)

'3D' 접미사가 붙은 액션은 그리드의 z-축을 변형하는 3D 시각 효과를 제공함을 뜻합니다.

'3D' 액션을 사용하면 여러분은 아마 깊이 버퍼를 사용하려고 할 것입니다. 호출하는 방법은 간단합니다. :

// 주의: 첫번째 장면이 동작하기 전, 최초 부분에 이 함수를 호출하세요
// 24bit의 깊이 버퍼 생성
// 이는 openGL z-order가 사용된다는 것을 의미합니다.
[[Director sharedDirector] setDepthBufferFormat:kDepthBuffer16];

그리고 특정 상황에서 여러분은 RGBA8888 픽셀 포멧을 사용하고 싶을 겁니다. 이는 투명도 이펙트를 제공합니다.

// 주의: 첫번째 장면이 동작하기 전, 최초 부분에 이 함수를 호출하세요
// 투명도 버퍼의 픽셀 포멧 사용
[[Director sharedDirector] setPixelFormat:kRGBA8];

Available Grid3DAction actions:

• FlipX3D
• FlipY3D
• Lens3D
• Liquid
• Ripple3D
• Shaky3D
• Twirl
• Waves
• Waves3D

Available TiledGrid3DAction actions:

• FadeOutBLTiles
• FadeOutTRTiles
• FadeOutUpTiles
• FadeOutDownTiles
• JumpTiles3D
• ShakyTiles3D
• ShatteredTiles3D
• ShuffleTiles
• SplitCols
• SplitRows
• TurnOffTiles
• WavesTiles3D

예제:

// 스프라이트 1에 Waves 실행
id waves = [Waves actionWithWaves:5 amplitude:20 horizontal:YES vertical:NO grid:ccg(15,10) duration:5];
[sprite1 runAction: [RepeatForever actionWithAction: waves]];
 
// 스프라이트 2에 Shaky3D 액션 실행
id shaky = [Shaky3D actionWithRange:4 shakeZ:NO grid:ccg(15,10) duration:5];
[sprite2 runAction: [RepeatForever actionWithAction: shaky]];