[D_014] Scroll View

사전작업

1) Extensions 프로젝트 추가

솔루션 오른쪽버튼 -> 기존 프로젝트 추가 -> 프로젝트 폴더 내  cocos2d\extensions\proj.win32\libExtensions 추가

2) 유저프로젝트 오른쪽버튼 -> 속성 -> 공용속성 -> 새 참조 추가 -> libExtensions 체크

3) 유저프로젝트 오른쪽버튼 -> 속성 -> 구성속성 -> 하위메뉴에서 C/C++ -> 추가 포함 디렉터리 -> $(EngineRoot) 추가

4) #include "cocos-ext.h"  , USING_NS_CC_EXT;   추가

Scroll View는 컨테이너 형태로, Layer를 가진다.

(레이어 : 스크롤뷰 == 메뉴아이템 : 메뉴)

예제

Colored By Color Scripter™

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30

auto layer = LayerColor::create(Color4B::WHITE);     layer->setContentSize(Size(600, 100)); //    this->addChild(layer);       //레이어에 테스트용 스프라이트 추가     auto spr = Sprite::create("box1.png");     spr->setPosition(Vec2(500, 50));     layer->addChild(spr);     auto spr1 = Sprite::create("button2.png");     spr1->setPosition(Vec2(100, 50));     layer->addChild(spr1);     auto spr2 = Sprite::create("box.png");     spr2->setPosition(Vec2(300, 50));     layer->addChild(spr2);       //size는 스크롤 뷰가 눈에 보이는 사이즈     auto scroll = ScrollView::create(Size(400, 100), layer);          //위아래로만 스크롤 가능하게 제한. 기본은 아무렇게나 가능     scroll->setDirection(ScrollView::Direction::HORIZONTAL);          //튕기는 효과 on/off     scroll->setBounceable(false);          //스크롤 뷰 생성시 처음 위치 지정. true는 원위치에서 움직이는 거 보여줌     //scroll->setContentOffset(Vec2(-100, 0), true);     //정해진 시간동안 움직임     scroll->setContentOffsetInDuration(Vec2(-100, 0), 3);       this->addChild(scroll);

2) ContentsOffset() - 스크롤 뷰 내에 있는 아이템 클릭 동작 관련

예를들어 화면 넓이가 300인데, 스크롤뷰 내의 레이어는 500이고, 이 레이어의 450좌표에 아이콘이 있고 이걸 클릭하려고 할 때, getContentOffset()을 이용한다.

getContentOffset()은 레이어 내에 포함된 아이템들이 레이어의 움직임에 따라 움직인 위치만큼 보정을 해준다.

예제코드

Colored By Color Scripter™

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

auto sv = (ScrollView*)this->getChildByTag(TST_SV);     auto layer = (Layer*)sv->getChildByTag(TST_LAYER);     auto item1 = (Sprite*)layer->getChildByTag(TST_ITEM);     CCLOG("pos %f, %f", pos.x, pos.y);     if (item1)     {         CCLOG("%f, %f", item1->getPosition().x, item1->getPosition().y);         CCLOG("item is available");     }     Rect rect = item1->getBoundingBox();       Rect rect1 = Rect(rect.origin.x + sv->getContentOffset().x, rect.origin.y + sv->getContentOffset().y, rect.size.width, rect.size.height);       if (rect1.containsPoint(pos))     {         item1->setScale(2.0f);     }