사전작업
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()은 레이어 내에 포함된 아이템들이 레이어의 움직임에 따라 움직인 위치만큼 보정을 해준다.
예제코드
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); } |
