게임 내에 사용하는 이미지들은 대개 네이밍을 전부 영문 소문자로서 구성한다.

띄어쓰기는 사용하지 않고 _를 통해 띄움을 구분한다.

숫자는 _를 쓰기도 하고 안쓰기도 하며, 대개 1대신 001등으로 사용한다.

1) 이미지를 이용한 메뉴 만들기

auto item_01 = MenuItemImage::create("btn-play-normal.png", "btn-play-selected.png", "btn-play-disable.png", CC_CALLBACK_1(HelloWorld::menuCallback, this));

item_01->setEnabled(false);

//( 기본 이미지 , 선택 이미지, 선택불가 이미지, 선택시 호출함수 ) 순으로 지정

//선택 불가 상태는 setEnabled() 함수로 설정. true일 경우 선택 가능, false일 경우 선택불가

//궁극기처럼 조건이 충족되기 전까지 false로 뒀다가 조건 충족시 true로 바꿔주는 식으로 사용

2) 스프라이트를 이용한 메뉴 만들기

auto spr01 = Sprite::create("grossini_dance_01.png");

auto spr02 = Sprite::create("grossini_dance_02.png");

auto sprItem_01 = MenuItemSprite::create(spr01, spr02,CC_CALLBACK_1(HelloWorld::menuCallback, this));

//스프라이트를 바깥에서 모두 생성해준 뒤, 생성한 스프라이트를 메뉴에 추가하여 사용하는 방식

//별로 다른건 없음

MenuItemFont는 스프라이트처럼 하나하나를 레이어에 추가시키는게 아니라, 만들어둔 아이템들을 'Menu'라는 클래스에 추가하여 생성한 뒤, 해당 메뉴를 레이어에 추가하는 것임.

즉, '스프라이트-레이어' 의 관계가 메뉴에서 '메뉴아이템-메뉴' 의 관계와 유사함.

auto item_01 = MenuItemFont::create("Play");        //play 아이템 생성

auto item_02 = MenuItemFont::create("Quit");        //quit 아이템 생성

auto menu = Menu::create(item_01, item_02, NULL);    //두개의 아이템을 추가한 메뉴 생성

//NULL은 더이상 추가할 아이템이 없다는 것을 알려주는 역할

menu->alignItemsVertically();                                    //아이템들을 수직으로 자동 정렬

//menu->alignItemsVerticallyWithPadding(20);

//이렇게 패딩을 통해 아이템들 사이에 빈 공간을 채워서 여유를 줄 수 있다.

//이렇게 정렬을 안해주면, 두 아이템이 기본값으로 추가됐기때문에 겹치게 나옴

this->addChild(menu);                    //아이템이 아닌 메뉴를 레이어에 추가

+ 메뉴/메뉴 아이템의 기본 위치값(좌표/앵커포인트)

메뉴 아이템 클릭시 동작하게 만드는 함수 추가

void playCallback(Ref* sender);

void quitCallback(Ref* sender);

+ Ref* sender란?

위의 아무 동작 안하는 메뉴들 중, play를 수정해서 클릭시 동작하게끔 함수를 바꾼다.

auto item_01 = MenuItemFont::create("Play", CC_CALLBACK_1(HelloWorld::playCallback, this));

//this는 타겟. 여기서는 playCallback이 있는 HelloWorld가 된다.

//이렇게 바꿔줌을 통해, play를 클릭하면 playCallback함수가 호출된다.

//playCallback함수의 호출과 동시에 item_01자기 자신이 함수의 파라미터로 넘어간다.

//아이템에 해당된 함수는 클릭(터치)을 눌렀다가 뗄 시에 호출된다.

+ CC_CALLBACK_1이란?( CC_CALLBACK_n )

MenuItemFont는 말 그대로 font만 직접 입력하여 사용하는 것이기 때문에 다양한 활용도가 없다.

그래서 대신에 MenuItemLabel을 사용하면, 라벨을 이용하여 메뉴를 구성할 수 있다.

//라벨 아이템 생성

auto label_01 = Label::createWithBMFont("west_england-64.fnt", "PLAY");

auto item_01 = MenuItemLabel::create(label_01, CC_CALLBACK_1(HelloWorld::playCallback, this));

//메뉴에 추가하는 건 동일함

+메뉴별 callback을 menuCallback하나로 묶은 코드

라벨이란?

텍스트와 더불어 위치 값, 앵커 포인트 등 정보 값을 함께 가지고 있는 객체(스프라이트와 비슷)

종류 : SystemFont, TrueTypeFont, BMFont, CharMap

폰트 타입들은 

cocos메인 폴더\tests\cpp-tests\Resources\fonts

에 많이 있다. 원하는 폰트를 해당 프로젝트의 resources 폴더에 복사하여 쓰면된다.

1) SystemFont 출력

auto label = Label::createWithSystemFont("Hello world!", "Thonburi", 34, Size(150, 150), TextHAlignment::LEFT, TextVAlignment::CENTER);

label->setPosition(Point(240, 160));

label->setColor( Color3B::RED );

this->addChild(label);

//auto label = Label::createWithSystemFont( 텍스트 내용, 폰트 이름, 글씨 크기, 텍스트박스 크기, 가로정렬, 세로정렬 )

//텍스트 내용, 글꼴, 글씨 크기는 필수

//setPosition은 라벨(텍스트박스)의 위치를 의미

//정렬은 텍스트 박스 내에서 글자들의 정렬 기준을 나타냄

//시스템 폰트를 사용할 때에는 폰트를 ""로 비워두어도 무방함(대부분 pc에 없기 때문)

//#pragma execution_character_set("utf-8"); 를 추가하면 한글 폰트가 제대로 출력됨

//윈도우에서는 깨져나오지만 안드로이드에서는 제대로 나옴

2) TTF 출력

여러가지 효과를 줄 수 있는 폰트. 효과에 따라 색깔 등을 따로 줄 수 있기 때문에, 글자색을 바꿀 때 setColor를 쓰는 다른 폰트들과는 달리 setTextColor 메소드를 사용한다.

auto label = Label::createWithTTF("Hello world!", "A Damn Mess.ttf", 34);

label->setPosition(Point(240, 160));

//label->enableOutline(Color4B(0, 0, 255, 128), 3);        //외곽선 효과를 주는 함수. 색깔과 두께.

//label->enableShadow( Color4B , Size(x, y) , blur);    //색깔, 그림자의 위치(라벨 (0,0)기준),블러

//label->enableGlow( Color4B )                        //형광색 그림자같은 느낌. shadow와 비슷한 기능

this->addChild(label);

//TTF는 폰트 이름에 확장자까지 같이 적어줘야 한다.

//해당 글꼴이 프로젝트의 resources / fonts 폴더에 있어야한다.

//TTF에서 사용가능한 글자 효과 - Outline, Shadow, Glow

3) BMFont

.png파일로 만들어진 비트맵 파일을 기반으로 하여 쓰는 폰트. 한 쌍의 png/fnt파일이 둘다 필요. 다른 폰트들과 달리 글자 사이즈를 입력하지 않는다. 사실상 폰트라기보단 이미지에 가까움.

auto label = Label::createWithBMFont("bitmapFontTest.fnt", "THIS IS IT");

label->setPosition(240, 160);

label->setScale(2);

this->addChild(label);

//http://angelcode.com/products/bmfont/      여기서 bmfont제작툴을 받을 수 있다.

+TTF와 BMF의 차이

TTF는 벡터 방식으로 처리하기 때문에 BMF에 비해 폰트 처리 속도가 느린 편(폰트 양이 많이 않다면 크게 차이 안나옴)

텍스트 양이 많고 글자 크기의 변화가 없다면 BMF가 성능적 측면에서 훨씬 이득

4) CharMap

BMF와 달리, fnt파일이 따로 없이 사용자가 파일의 정보를 직접 지정할 수 있게 한 폰트.

단, 각 글자의 높이/너비가 동일해야하며, 글자의 순서가 아스키코드의 순서와 동일하게 하여 이미지 파일을 만들어야 한다. 대개 숫자를 라벨로 출력할 때 많이 사용된다.

int score = 331245;            //게임에서 사용되는 점수

auto label = Label::createWithCharMap("no_01.png", 33, 45, '0');

label->setString(StringUtils::format("%d", score) );        //점수를 라벨에 출력하기위해 사용

label->setColor(Color3B::WHITE);

label->setPosition(240, 160);

this->addChild(label);

//(이미지 파일 명, 한 글자당 넓이, 한 글자당 높이, 첫 시작 문자의 아스키 코드 값) 순서로 초기화

+ Color3B와 Color4B의 차이점?

3B는 R, G, B의 3개 속성을 가진 기본 컬러고, 4B는 이 RGB에 투명도까지 더한 것.

+ getString / setString 함수를 이용해 라벨의 내용을 가져오거나 설정한다.

+ Label에 %d와 같이 변수를 사용할 경우, StringUtils::format을 사용하여 텍스트를 입력한다.

+ 코드상의 문제가 없는데 폰트 관련하여 문제가 생겼을 경우

1) 다른 폰트를 로드하여 써본다 -> 될 경우 폰트 파일의 문제

2) 다른 내용(영어/한글 등)을 써서 해본다

화면을 구성하는 여러가지 스프라이트들의 z축 위치를 관리하기 위해서 enum을 사용하면 편하다.

enum Z_ORDER

{

BG,            //0

PLAYER,    //1

ENEMY,    //2

UI_TEXT = 10,        //중간에 임의로 값을 지정해줄 수 있음. 단 이 경우 다음것에도 영향을 줌

GAMEOVER            //10다음이니 11로 지정됨

};

이렇게 Z_ORDER를 설정한 뒤, addchild를 통해 스프라이트를 화면에 추가할 경우

this->addchild( spr , Z_ORDER::PLAYER );

이와 같은 식으로 해당 스프라이트의 z축 크기를 설정해서 추가할 수 있다.

//HelloWorldScene.cpp / bool HelloWorld::init() 내부에 구현

//현재 생성되어있는 화면의 사이즈를 구하여 저장

auto director = Director::getInstance();

auto WinSize = director->getWinSize();

//좌측 하단 첫번째 스프라이트 추가

auto Sprite_Grossini01 = Sprite::create("grossini.png");

Sprite_Grossini01->setAnchorPoint(Vec2(0, 0));

Sprite_Grossini01->setPosition(WinSize.ZERO);

this->addChild(Sprite_Grossini01);

//화면 정중앙 스프라이트 추가

auto Sprite_Grossini02 = Sprite::create("grossini.png");

Sprite_Grossini02->setAnchorPoint(Vec2(0.5, 0.5));

Sprite_Grossini02->setPosition(WinSize.width/2, WinSize.height/2);

this->addChild(Sprite_Grossini02);

//화면 우측 거대 스프라이트 추가

auto Sprite_Grossini03 = Sprite::create("grossini.png");

Sprite_Grossini03->setAnchorPoint(Vec2(1, 0));

Sprite_Grossini03->setPosition(WinSize.width, 0);

Sprite_Grossini03->setScale(2);

this->addChild(Sprite_Grossini03);

//화면 중앙 하단 스프라이트 추가

auto Sprite_Sister01 = Sprite::create("grossinis_sister1.png");

Sprite_Sister01->setAnchorPoint(Vec2(0.5, 0));

Sprite_Sister01->setPosition(WinSize.width/2, 0);

this->addChild(Sprite_Sister01);

//화면 중앙 상단 뒤집어진 스프라이트 추가

auto Sprite_Sister02 = Sprite::create("grossinis_sister2.png");

Sprite_Sister02->setAnchorPoint(Vec2(0.5, 0));

Sprite_Sister02->setPosition(WinSize.width/2, WinSize.height);

Sprite_Sister02->setRotation(180);

this->addChild(Sprite_Sister02);

1) 함수 파라미터에 사용하는  const

함수에서 포인터 등을 통해 기존의 데이터를 파라미터로 받아오는 경우가 많은데, 이 함수의 원형 파라미터에 const를 붙일 경우, 해당 파라미터를 통해 받는 값은 함수 내에서 임의로 변경이 불가능하게 된다.(이러한 동작이 존재할 경우 컴파일 에러가 남)

int a[5] = { 12, 13, 15, 16, 17 };

int total = 0;

for (int b : a)

{

total += b;

}

//이 결과는 a 배열 내의 모든 원소가 더해진 값이 total에 저장됨

작동 원리

for ( for-range-declaration : expression )

   statement 

expression에는 항상 배열류(배열, 리스트, 벡터 등) 자료구조가 들어가야 함.

for-range-declaration에는 해당 배열의 값이 저장됨

즉, expression의 처음부터 끝의 범위동안 반복해서 statement를 반복함.

C/C++에서 흔히 쓰이는 switch 문을 사용할 때, 

case 내부에서 변수를 선언하게 될 경우가 생길 수도 있다.

이때는 switch문 내부의 지역변수로 선언되기 때문에 하나의 case에서 선언된 지역변수가 switch 종료까지 영향을 미칠 수 있다. (사실은 에러가 나면서 컴파일이 안됨)

그렇기 때문에 이 경우에는 해당 변수 선언이 이루어지는 case문을 {}로 묶어주면 해결된다.

기본 자료형(32bits)

1) 정수형 (32bit기준)

int : 4byte

short int : 2byte

long int : 4byte

unsigned int : 4byte

unsigned short int : 2byte

->운영체제의 32/64에 따라 달라질 수 있음

2) 실수형

float : 4byte (3.2f)

double : 8byte (3.4)

long double : 8byte 

+ 서로 다른 자료형 간의 연산은 더 큰 형으로 자동 형변환

ex)  int a와 float b의 합의 결과는 float형

3) 문자형

char : 1byte ('a', '5')

함수 네이밍 룰 : 

1) 동사+대상 

ex) addChild : 더한다+자식 -> 자식을 추가하는 함수

2) 첫 글자는 소문자로 시작

ex)

bool isTrue()

int sprData;

클래스 네이밍 룰 :

1) 모든 단어의 첫 글자는 대문자로 사용

ex) class SpriteBatchNode

AppDelegate.cpp 에서

director->setDisplayStats( true/false )        //현재 표현된 화면에 대한 성능 분석 표시 여부

- DisplayStats 분석

GL calls : Draw call이 일어난 횟수

+ 단순 계산은 CPU 자체에 부하가 거의 없다.

하드웨어에 가장 큰 부하가 걸리는 시점?

->CPU에서 GPU로 데이터를 보낼때(Draw call) 가장 큰 비용이 듦

이런 부분을 해소하기 위해 COCOS에서는 Sprite Cache를 사용한다(사용할 스프라이트를 미리 GPU에 올려두는 작업인 듯)

HelloWorldScene.cpp 에서

init 함수 내부 청소

menuCloseCallback 함수 삭제

하면 cocos프로젝트 기본형 완성

cocos에서 사용되는 자료구조들의 기본 개념

Texture : 이미지 그 자체

Sprite : 이미지와 이미지의 정보값까지 포함한 것.

Text : 글자 그 자체

Label : 글자의 내용과 그 글자의 정보값까지 포함한 것.