[기본] 튜토리얼 소스 코드

// on "init" you need to initialize your instance bool HelloWorld::init() { ////////////////////////////// // 1. super init first if ( !Layer::init() ) { return false; } //auto spr = Sprite::create("HelloWorld.png");//Sprite 생성 //Point(x, y) : 포인트 값 그러니까 좌표 값을 의미 합니다. //Size(width, height) : 가로, 세로 길이를 의미 합니다. //Rect(x, y, width, height) : 이미지 내부의 x, y 좌표와 좌표로부터의 가로, 세로를 의미 합니다. Rect imgMask = Rect(0, 0, 100, 200); Point posAnchor = Point(0, 0); Point posImg = Point(200, 300); auto spr = Sprite::create("HelloWorld.png", imgMask); spr->setAnchorPoint(posAnchor); //앵커포인터 지정 spr->setPosition(posImg); //포지션 지정 //addChild(Node *child) // : 기타 정보를 넣지 않고 최소한의 객체를 넣는 방식입니다. //addChild(Node *child, init localZOrder) // : 객체의 z 축을 지정할수 있습니다.각 객체간 어떤 객체가 앞에 배치될지 뒤에 배치가 될지를 지정합니다. //addChild(Node *child, int localZOrder, int tag) // : 추가로 tag 라는 값을 넣어서 부모 객체와 그의 자식 객체들을 리턴 할 수 있게 해줍니다. (getChildByTag() 이용) this->addChild(spr); //***************************** // 기본 메소드 //***************************** //setScale(), setScaleX(), setScaleY() : 객체를 배율로 확대 혹은 축소 합니다. //setScale(2.0) - 2배 확대 setScale(0.5) 50 % 축소 //setRotation(), setRotationX(), setRotationY() : 객체를 회전하는 메소드 입니다.X, Y 는 회전하는 축을 의미 하며 360이상 의 값을 입력할 경우 한바퀴 값 만큼 회전후의 값이 입력됨니다. //setRotation(90) : 시계방향 90도 회전 //setFlippedX(), setFlippedY() : 객체를 반전하는 메소드 입니다 X, Y 는 각각의 축을 의미 합니다. //setFlippedX(true) : X 축 기준으로 회전 //setOpacity() : 객체의 투명도를 0~255로 나타 냅니다.투명도를 조절하는 것임으로 0 이 되면 투명화가 되어 나타나지 않습니다. //setOpacity(0) : 나타나지 않음 //setOpacity(255) : 100 % 로 객체가 보임 //setOpacity(180) : 살짝 투명화가 진행된 상태로 보임 //setVisible() : 객체를 보이게 하거나 안보이게 합니다.Opacity 와 다르게 보이고 안보이고를 정하는 것이기 때문에 setVisible(false) 로 지정할경우 setOpacity 의 값과 상관없이 보이지 않게 됩니다. //setVisible(true) : 객체가 보임 Size windowSize = Director::getInstance()->getWinSize(); Sprite *funchild = Sprite::create("funchild.png"); Sprite *funchild_2 = Sprite::create("funchild.png"); Sprite *funtree = Sprite::create("funtree.png"); Sprite *funtree_2 = Sprite::create("funtree.png"); Sprite *funface = Sprite::create("funface.png"); Sprite *funface_2 = Sprite::create("funface.png"); funchild->setOpacity(180); funchild->setPosition(windowSize.width / 2, 300); this->addChild(funchild); funtree->setRotation(90); funtree->setPosition(windowSize.width / 3, 500); this->addChild(funtree); funface->setScale(100); funface->setPosition(windowSize.width / 5, windowSize.width / 6); this->addChild(funface); funchild_2->setScale(2, 0.5); funchild_2->setAnchorPoint(Point::ZERO); funchild_2->setPosition(0, 0); this->addChild(funchild_2); funtree_2->setFlippedX(true); funtree_2->setPosition(windowSize.width / 8, windowSize.height / 2); this->addChild(funtree_2); funface_2->setFlippedX(true); funface_2->setAnchorPoint(Point(1, 1)); funface_2->setPosition(windowSize.width, windowSize.height); this->addChild(funface_2); //SystemFont - 기본 시스템 폰트 //TTF(True Type Font) - Windows 에서 사용하는 외부 폰트 이용 //BMFont - 비트맵 이미지 파일인 *.png 파일과 와 *.png 의 정보를 가진 *.fnt 를 이용하여 폰트를 출력 //CharMap - BMFont 와 비슷하지만 폰트 정보 파일인.fnt 를 사용하지 않고 사용자가 파일 정보를 직접 입력하는 방식 // TextHAlignment: 가로 정렬 관련 //TextHAlignment::CENTER - 가운데 정렬 //TextHAlignment::LEFT - 왼쪽 정렬 //TextHAlignment::RIGHT - 오른쪽 정렬 // TextVAlignment : 가로 정렬 관련 //TextVAlignment::CENTER - 가운데 //TextVAlignment::TOP - 상단 정렬 //TextVAlignment::BOTTOM - 하단 정렬 //Size windowSize = Director::getInstance()->getWinSize(); auto labeltxt = Label::createWithSystemFont("안녕하세요, Hello,　您好、 こんにちは", "Ariel", 50, Size(200, 300), TextHAlignment::LEFT, TextVAlignment::CENTER); labeltxt->setPosition(400, 250); this->addChild(labeltxt); auto labeltft = Label::createWithTTF("안녕하세요, Hello,　您好、 こんにちは", "fonts/Marker Felt.ttf", 50, Size(500, 300), TextHAlignment::LEFT, TextVAlignment::CENTER); labeltft->setPosition(400, 150); this->addChild(labeltft); auto labelbmf = Label::createWithBMFont("fonts/test.fnt", "Hello~ Sydney"); labelbmf->setPosition(600, 150); this->addChild(labelbmf); auto labelmap = Label::createWithCharMap("fonts/test.png", 32, 65, 'A'); labelmap->setString("ABCD"); labelmap->setAnchorPoint(Point(0.5, 0.5)); labelmap->setPosition(400, 450); this->addChild(labelmap); // 1. 폰트 메뉴 auto item_1 = MenuItemFont::create("Play", CC_CALLBACK_1(HelloWorld::menuCallback, this)); auto item_2 = MenuItemFont::create("Score", CC_CALLBACK_1(HelloWorld::menuCallback, this)); auto item_3 = MenuItemFont::create("exit", CC_CALLBACK_1(HelloWorld::menuCloseCallback, this)); auto menuFont = Menu::create(item_1, item_2, item_3, NULL); menuFont->alignItemsVertically(); this->addChild(menuFont); // 2. 레이블 버튼 메뉴 // 레이블을 이용한 버튼 메뉴는 위의 폰트와 비슷하지만 다른점은 폰트의 설정을 레이블의 형태로 불러오기 때문에 조정이 가능하다는 것입니다. // 방법은 간단합니다 앞에서 배운 Label 을 만든 후 MenuItemLabel 로 메뉴 아이템을 생성 후 사용하는 방식입니다 auto btnLable_1 = Label::createWithSystemFont("NewGame", "Airal", 50); auto btnLable_2 = Label::createWithSystemFont("Load", "Airal", 30); auto btnLable_3 = Label::createWithSystemFont("About", "Airal", 20); auto btnLable_4 = Label::createWithSystemFont("Exit", "Airal", 10); auto mItem_1 = MenuItemLabel::create(btnLable_1, CC_CALLBACK_1(HelloWorld::menuCallback, this)); auto mItem_2 = MenuItemLabel::create(btnLable_2, CC_CALLBACK_1(HelloWorld::menuCallback, this)); auto mItem_3 = MenuItemLabel::create(btnLable_3, CC_CALLBACK_1(HelloWorld::menuCallback, this)); auto mItem_4 = MenuItemLabel::create(btnLable_4, CC_CALLBACK_1(HelloWorld::menuCloseCallback, this)); auto menuLable = Menu::create(mItem_1, mItem_2, mItem_3, mItem_4, NULL); menuLable->alignItemsVertically(); this->addChild(menuLable); // 3. 이미지 버튼 메뉴 auto item_1 = MenuItemImage::create("start_on.png", "start_off.png", "start_off.png", CC_CALLBACK_1(HelloWorld::menuCallback, this)); auto item_2 = MenuItemImage::create("start_on.png", "start_off.png", "start_off.png", CC_CALLBACK_1(HelloWorld::menuCallback, this)); auto item_3 = MenuItemImage::create("start_on.png", "start_off.png", "start_off.png", CC_CALLBACK_1(HelloWorld::menuCallback, this)); auto menuImg = Menu::create(item_1, item_2, item_3, NULL); item_1->setEnabled(false); menuImg->alignItemsVertically(); this->addChild(menuImg); //4. Sprite 를 이용한 메뉴 //앞에서 배웠던 Sprite 를 이용해 이미지를 불러온 후 메뉴 아이템으로 이용하는 방법입니다. //Label 이 폰트의 속성을 변경 할수 있다면 Sprite 는 이미지의 속성을 변경우 사용할수 있다는 점에서 Label 과 비슷하다고 보시면 됩니다. auto btnStart_on_1 = Sprite::create("start_on.png"); auto btnStart_off_1 = Sprite::create("start_off.png"); auto btnStart_on_2 = Sprite::create("start_on.png"); auto btnStart_off_2 = Sprite::create("start_off.png"); btnStart_off_2->setScale(0.6); auto btnStart_on_3 = Sprite::create("start_on.png"); auto btnStart_off_3 = Sprite::create("start_off.png"); btnStart_on_3->setScale(0.4); auto mItem_1 = MenuItemSprite::create(btnStart_on_1, btnStart_off_1, CC_CALLBACK_1(HelloWorld::menuCallback, this)); auto mItem_2 = MenuItemSprite::create(btnStart_on_2, btnStart_off_2, CC_CALLBACK_1(HelloWorld::menuCallback, this)); auto mItem_3 = MenuItemSprite::create(btnStart_on_3, btnStart_off_3, CC_CALLBACK_1(HelloWorld::menuCallback, this)); auto menuSprit = Menu::create(mItem_1, mItem_2, mItem_3, NULL); menuSprit->alignItemsVertically(); this->addChild(menuSprit); //5. 토글 //토글 메뉴를 만드는 방법입니다. //토글은 위에서도 설명했다시피 터치 할때마다 속성이 변하는 것을 말합니다. //(2개를 지정 후 교차로 나오게함) = > 간단히 말하면 아래와 같은 스위치 라고 이해하시면 됩니다. auto btnStart_on_1 = Sprite::create("start_on.png"); auto btnStart_off_1 = Sprite::create("start_off.png"); auto btnStart_on_2 = Sprite::create("start_on.png"); auto btnStart_off_2 = Sprite::create("start_off.png"); btnStart_on_2->setScale(0.5); btnStart_off_2->setScale(0.5); auto mItem_1 = MenuItemSprite::create(btnStart_on_1, btnStart_off_1); auto mItem_2 = MenuItemSprite::create(btnStart_on_2, btnStart_off_2); auto tItem_1 = MenuItemToggle::createWithCallback(CC_CALLBACK_1(HelloWorld::menuCallback, this), mItem_1, mItem_2, NULL); auto mItem_3 = MenuItemImage::create("start_on.png", "start_off.png", CC_CALLBACK_1(HelloWorld::menuCallback, this)); auto menuTgl = Menu::create(tItem_1, mItem_3, NULL); menuTgl->alignItemsVertically(); this->addChild(menuTgl); //1. 메뉴는 위치 지정을 하지 않을 경우 화면의 중앙에 기본적으로 위치하게 된다. // MenuItem : 메뉴 안에 들어가는 아이템 의 기본위치 //AnchorPoint (0.5, 0.5) //Position (0, 0) // Menu : 화면에 출력되는 MenuItem 의 집합 //AnchorPoint (0, 0) //Position (윈도우 사이즈 가로 / 2, 윈도우 사이즈 높이 / 2) //대충 설명을 드리자면 //MenuItem 의 경우 기본적으로 중앙 정렬 그리고 좌하단을 기준으로 배치됩니다. //그리고 //Menu 의 경우 좌하단을 기준으로 화면의 중앙에 위치하게 됩니다. //주의를 드리자면 UI 를 만드실때 절대값으로 UI의 위치를 판단하실때는 화면의 크기를 고려하셔서 위치를 만들어 주셔야 합니다. //2. alignItems 를 이용한 가로, 세로 정렬 //그리고 위의 예제들에서도 사용한 가로 정렬, 세로 정렬 함수가 있습니다. //alignItemsVertically() 세로 정렬 //alignItemsHorizontally() 가로 정렬 //그리고 위의 가로 정렬과 세로 정렬은 WithPadding 이라는 함수로 간격을 조절해 주실 수 있습니다. //alignItemsVerticallyWithPadding() 세로 정렬의 간격 조절 //alignItemsHorizontallyWithPadding() 가로 정렬의 간격 조절 menuTgl->alignItemsHorizontally(); menuTgl->alignItemsHorizontallyWithPadding(10); // float return true; }