cocos2dx에서 하나의 Scene에 두개의 카메라 동시에 표현하기

2017. 9. 27. 0:09

다음글은 cocos2dx 에서 하나의 화면에 두개의 카메라를 그릴때 어떻게 해야 할지를 구현하는 방법에 대해 적은 것이다. 
아래 화면을 보면 상단에는 확대된 3D화면이 하단에는 축소된 3D화면이 있는것을 알수있다( 쉽게 생각해서 레이싱 화면에서 앞으로 가는것이보이고, 백미러가 상단에 있는것 생각하면 된다)

위처럼 작업을 하려면 Open GL의 FrameBuffer에 대해서 알아야 하는데기본적인 코드에 대해서는 이전글인 다음의 URL을 참고하면 된다.

화면의 일부분에 3D layer를 위해 Frame Buffer Object 사용하기

COCOS 2D-X에서 3D 작업을 할때 전체 화면이 아닌 화면의 일부 구역에 3D Layer를 만들고 싶을때...

byunhy69.blog.me

위 글을 읽었다면 코드는 간단하게 다음처럼 구현할수 있다. 
일단 3D 레이어를 하나 만들고 ( 위 URL 내용을 먼저 읽을것 )카메라를 2개를 생성을 한다.

// frame buffer object를 만들어서 그것을 카메라와 연결 void HelloWorld::createCameraWithFrameBuffer1() { float width = 600, height = 400; // 큰화면 _camera1 = Camera::createPerspective(95, width / height, 1, 10000); // 10000 : far plane distance , landscape _camera1->setCameraFlag(CameraFlag::USER1); _camera1->setPosition3D(Vec3(0, 0, 0)); _camera1->lookAt(Vec3(0, 0, 0), Vec3(0, 1, 0)); _camera1->retain(); m_layer3D->addChild(_camera1); experimental::Viewport vp; vp._left = 0; vp._bottom = 0; vp._width = 1; vp._height = 1; _camera1->setViewport(vp); auto fbo = experimental::FrameBuffer::create(1, width, height); //render target experimental::RenderTarget* renderTarget = experimental::RenderTarget::create(width, height); fbo->attachRenderTarget(renderTarget); renderTarget->getTexture()->setAliasTexParameters(); //stencil depth auto depth = experimental::RenderTargetDepthStencil::create(width, height); fbo->attachDepthStencilTarget(depth); //_camera1->setDepth(0); _camera1->setFrameBufferObject(fbo); // 그리기 평면 텍스쳐, 스프라이트를 만들어서 붙인다 Texture2D* texture = fbo->getRenderTarget()->getTexture(); auto pDraw = Sprite::createWithTexture(texture); pDraw->setFlippedY(true); // 화면이 뒤집혀 있기 때문에 pDraw->setAnchorPoint(Vec2::ZERO); pDraw->setPosition(Vec2(360, 800 )); addChild(pDraw); } // frame buffer object를 만들어서 그것을 카메라와 연결 void HelloWorld::createCameraWithFrameBuffer2() { float width = 400, height = 300; // 작은 화면 _camera2 = Camera::createPerspective(95, width / height, 1, 10000); // 10000 : far plane distance , landscape _camera2->setCameraFlag(CameraFlag::USER2); _camera2->setPosition3D(Vec3(0, 0, 0)); _camera2->lookAt(Vec3(0, 0, 0), Vec3(0, 1, 0)); _camera2->retain(); m_layer3D->addChild(_camera2); experimental::Viewport vp; vp._left = 0; vp._bottom = 0; vp._width = 1; vp._height = 1; _camera2->setViewport(vp); auto fbo = experimental::FrameBuffer::create(2, width, height); //render target experimental::RenderTarget* renderTarget = experimental::RenderTarget::create(width, height); fbo->attachRenderTarget(renderTarget); renderTarget->getTexture()->setAliasTexParameters(); //stencil depth auto depth = experimental::RenderTargetDepthStencil::create(width, height); fbo->attachDepthStencilTarget(depth); _camera2->setFrameBufferObject(fbo); // 그리기 평면 텍스쳐, 스프라이트를 만들어서 붙인다 Texture2D* texture = fbo->getRenderTarget()->getTexture(); auto pDraw = Sprite::createWithTexture(texture); pDraw->setFlippedY(true); // 화면이 뒤집혀 있기 때문에 pDraw->setAnchorPoint(Vec2::ZERO); pDraw->setPosition(Vec2(360, 100)); addChild(pDraw); }

생성된 두개의 카메라는 한 m_layer3D 에 addChild() 한다.두개의 Layer를 만드는 것이 아니고 , 하나의 레이어에 두개의 Camera를 만드는 것이다. 
그리고 최종적으로 카메라 보여지는 작업을 할때 아래처럼 두개가 보이게 한다.

m_layer3D->setCameraMask((int)CameraFlag::USER1 | (int)CameraFlag::USER2);