본문 바로가기

Cocos2d-x

3. Menu

1. 메뉴

메뉴의 기능을 사용하기 위해서는 Menu 클래스를 사용하여 객체를 만들면 됩니다.
구체적인 기능 구현과 세부 설정을 위해서는 MenuItem 클래스를 추가해야 됩니다.

 

2. 메뉴 아이템

메뉴에서 사용자 정의를 담당하는 하위 클래스.

※ 콜백 함수(callback function)
CC_CALLBACK_1(Test::func1, this);
첫 번째 인수 (selector) : 메뉴가 선택됐을 때 호출되어야 할 함수            ->   위의 예시로는 Test::func1
두 번째 인수 (target) : MenuItem이 선택됐을 때 반응해야 하는 객체    ->   this
※ 이 함수에서 this가 의미하는 것 : 메뉴가 생성되어 있는 현재씬을 참조한다.


2-1. MenuItemImage

· 원형 : MenuItemImage::create("평소의 이미지", "메뉴가 선택(클릭)됐을 때의 이미지", 호출할 함수);

auto itemImage = MenuItemImage::create
("Normal_Image.png", "Selected_Image.png", CC_CALLBACK_1(test::Func1, this));

평소 상태와 선택됐을 때의 이미지가 같게 하려면, 동일한 이미지 파일을 넣어주시면 됩니다.

 

생성해 놓은 MenuItemImage로 메뉴 만들기

auto imageMenu = Menu::create(itemImage, NULL);

// 수평&수직 정렬 (사용 시 좌표는 화면 정중앙) => 선택사항입니다.
imageMenu->alignItemsHorizontally();
imageMenu->alignItemsVertically();

//화면 출력
this->addChild(imageMenu);


2-2. MenuItemFont

MenuItemImage와 동일하게 폰트만 작성하고 메뉴를 작성하면 됩니다.

// 폰트 초기화
MenuItemFont::setFontName("fonts/NanumBarunGothic.ttf");
MenuItemFont::setFontSize(24);

// MenuItemFont 작성
auto ItemFont = MenuItemFont::create("폰트형 메뉴", CC_CALLBACK_1(test::Func2, this));

auto fontMenu = Menu::create(itemFont, NULL);

//화면 출력
this->addChild(fontMenu);

3. UI의 Button 기능

개인적으로 Menu의 가장 큰 단점이라고 생각하는 것은 클릭했을 때, 메뉴의 이미지가 커졌다 작아지는 것 이라고 생각합니다.

효과가 이쁘지도 않는데 on/off도 안되니까요..

UI 기능은 뒤에서 다룰 내용이지만, Button기능은 Menu와 유사한 기능을 수행하기에 알아두어야 취사선택에 도움이 될 것 같아 미리 소개드립니다.

 

<헤더>

#include "cocos2d.h"

// ui를 사용하기 위한 선언 요소
#include "extensions\cocos-ext.h"
#include "ui/CocosGUI.h"

// 한글 활성화
#if (CC_TARGET_PLATFORM == CC_PLATFORM_WIN32)
#pragma execution_character_set("utf-8")
#endif

USING_NS_CC;
USING_NS_CC_EXT;

class UI_test : public cocos2d::Scene
{
public:
	static cocos2d::Scene* createScene();
	virtual bool init();

	CREATE_FUNC(UI_test);

private:
	// 버튼 콜백함수
	void ButtonEvent(Ref* Sender, ui::Widget::TouchEventType type);
};

 

<cpp>

#include "UI_test.h"

using namespace ui;

cocos2d::Scene * UI_test::createScene()
{
	return UI_test::create();
}

bool UI_test::init()
{
	if (!Scene::init()) return false;
    
    // Button::create(기본 상태, 선택된 상태, 비활성화 상태)
	auto btn = Button::create("Normal.png", "Seleted.png");	
	btn->addTouchEventListener(CC_CALLBACK_2(UI_test::ButtonEvent, this));
	this->addChild(btn);
}

// 버튼을 누를 때 호출할 함수
void UI_test::ButtonEvent(Ref * Sender, ui::Widget::TouchEventType type)
{
	// 버튼 터치이벤트 목록입니다.
	switch (type)
	{
	case cocos2d::ui::Widget::TouchEventType::BEGAN:
		break;
	case cocos2d::ui::Widget::TouchEventType::MOVED:
		break;
        // 터치가 끝났을 때
	case cocos2d::ui::Widget::TouchEventType::ENDED:
		log("터치가 끝났을 때 출력될 문장입니다.");
		break;
	case cocos2d::ui::Widget::TouchEventType::CANCELED:
		break;
	default:
		break;
	}
}

 

메뉴의 터치이벤트가 작동이 됐는지를 확인하기 위해 log를 썼기 때문에, 콘솔창을 띄워서 log를 확인해야 합니다.

콘솔창을 띄우는 방법은 win32폴더 안의 main.cpp에 

#pragma comment(linker, "/entry:wWinMainCRTStartup /subsystem:console");

을 넣어주시면 됩니다. 빌드를 한다면, 콘솔창과 함께 빌드됩니다.

 

Menu와 동일한 기능을 수행하지만, 특유의 효과가 발생하지 않습니다.

'Cocos2d-x' 카테고리의 다른 글

6. 애니메이션(Animation)  (0) 2021.08.28
5. 스케줄(schedule)  (0) 2021.08.18
4. 액션(Action)  (0) 2021.08.17
2. Label, Font  (0) 2021.08.06
1. Sprite  (0) 2021.07.24