동국대 앱창작터 2일차:Cocos2d-X 기본기능

2일차:기본기능
동국대학교 앱창작터 모바일게임과정II:Cocos2d-X

목차
 레이블 사용하기
 스프라이트 사용하기
 메뉴 사용하기
 액션 사용하기
 트랜지션 사용하기
 애니메이션 사용하기
 사운드 사용하기
 터치 사용하기
 스케줄 사용하기
모바일게임과정II:Cocos2d-X 2

HelloWorld
 폴더/파일 구성
 Box2D, chipmunk: 물리엔진 관련
 Classes: 게임 관련 파일
 CocosDenshion: 사운드 엔진 관련
 extensions: 확장기능
 Frameworks: iOS 프레임워크
 iOS: iOS 관련 파일들
 Products: 관련 설정
 Resources: 이미지 등

HelloWorld
 노드 생성
 노드 속성 변경
 장면(Scene), 레이어(Layer)

AppDelegate.h

AppDelegate.cpp

HellWorldScene.h

HellWorldScene.cpp

도움말/참고자료
 도움말
 API 참조문서: http://www.cocos2d-x.org/reference/native-cpp/index.html
 메모리 관리
 Reference Count and AutoReleasePool in Cocos2d-x: http://www.cocos2d-
x.org/projects/cocos2d-
x/wiki/Reference_Count_and_AutoReleasePool_in_Cocos2d-x
 cocos2d-x 메모리 관리에 대한 간단한 정리 #1:
http://www.libsora.so/posts/2013/01/25/cocos2dx-memory-management/
 교재 저자: 네이버 카페
 http://cafe.naver.com/cocos2dxusers.cafe
 참고자료
 튜토리얼: http://www.raywenderlich.com/

레이블 사용하기

CCLabelTTF 기본형

트루 타입 폰트 파일 사용하기
 $COCOS2DX_ROOT/samples/TestCpp/Resources/fo
nts 디렉토리 사용
 디렉토리를 프로젝트의 Resources 디렉토리로 복사
 Xcode 프로젝트
 Resources/Info.plist

비트맵 폰트 파일과 캐릭터맵을
이용한 텍스트 출력
 비트맵 폰트 파일
 폰트이름.fnt: 폰트의 각 글자에 대한 이미지 정보
 폰트이름.png: 이미지 파일
 비트맵 폰트 도구
 Hiero: slick.cokeandcode.com
 fonteditor
 Glyph Designeer
 bmGlyph
 LabelAtlasCreator
 AngelCode의 BMFont: www.angelcode.com

 캐릭터맵
 너비와 높이가 서로 같은 크기의 이미지로 구성된 이미
지 이용
 CCLabelAtlas 클래스
 create() 메소드의 인자
 출력할 문자열
 스프라이트 배치노드 이미지
 너비
 높이
 첫번째 이미지에 해당하는 ASCII 값

실습
 화면 상에 임의의 5개의 문자열을 표시
 각 문자열은 서로 다른 글꼴 사용
 1개 이상의 비트맵 글꼴 사용
 1개 이상의 캐릭터맵 사용

스프라이트 사용하기

스프라이트 사용하기
 $COCOS2DX_ROOT/samples/TestCpp/Resources/Im
ages 디렉토리 사용
 주요 개념
 앵커포인트
 Z-Order

 주석 처리된 앵커포인트 코드 확인

 두 번째 스프라이트 추가 후, Z-Order 확인

부모 스프라이트 & 자식 스프라이트
480, 320
480,0
0, 320
0, 0
480, 320
480, 0
0, 320
0, 0

실습
 Cocos2d-Sprite
 “grossini.png” 이미지 표시
 “grossini.png” 이미지 위에 “gauge.png” 이미지 표시
 “gauge.png” 이미지의 폭은 “grossini.png” 이미지의 2/3
 gauge 스프라이트는 grossini 스프라이트의 자식 노드로 추가
스프라이트 37

메뉴 사용하기

메뉴와 메뉴아이템의 기본
사용법
 메뉴 생성
 CCMenu *pMenu = CCMenu:create(NULL); // 빈 메뉴
 메뉴 아이템 종류
 CCMenuItemLabel
 CCMenuItemAtlasFont
 CCMenuItemFont
 CCMenuItemSprite
 CCMenuItemImage
 CCMenuItemToggle
 공통 사항
 타겟: 메뉴가 터치되었을때 동작을 수행할 객체를 지정 (주로 장면)
 셀렉터: 메뉴가 터치되었을때 동작을 수행할 메소드를 지정

 메뉴 초기화
 CCMenu *pMenu = CCMenu:create(item1, item2, item3,
NULL);
 메뉴 레이아웃
 pMenu->alignItemsVertically()
 pMenu->alignItemsHorizontally()

메뉴 및 메뉴 아이템의 앵
커포인트와 위치

메뉴 아이템에서 태그 사용하기
 태그(tag)
 메뉴 아이템의 구별을 위해서 사용
 CCNode 클래스
 int getTag();
 void setTag(int tag);
 CCNode* getChildByTag(int tag);

실습: 메뉴
 다음과 같은 프로그램을 작성하시오.
 Menu 화면
 게임 화면
 도움말
 설정
 각 메뉴 항목을 선택하면 CCLog()를 사용하여 문자열 출
력

액션 사용하기

기본 액션
 위치(Position)
 CCMoveBy, CCMoveTo
 CCJumpBy, CCJumpTo
 CCBezierBy, CCBezierTo
 CCPlace
 크기(Scale)
 CCScaleBy, CCScaleTo
 회전(Rotation)
 CCRotationBy, CCRotationTo
 가시성(Visible)
 CCShow, CCHide, CCBlink, CCToggleVisibility
 투명도(Opacity)
 CCFadeIn, CCFadeOut, CCFadeTo
 색(R,G,B)
 CCTintBy, CCTintTo
 거의 모든 액션에는 리버스(Reverse) 메소드가 구현되어 있음

복합 액션
 CCSequence
 CCSpawn
 Reverse() 메소드
 CCDelayTime
 CCRepeat, CCRepeatForever

이즈 액션(Ease Action)
 선형(Linear)
 이즈 액션

 EaseExponential actions
 EaseSine actions

 EaseElastic actions
 탄성 시뮬레이션
 두번째 인자: 탄력적인가를 지정
 기본값: 0.3
 권고값: 0.3 – 0.45
 EaseBounce actions

 EaseBack actions
 CCSpeed
 액션 진행 속도 변경

콜백 액션
 지정한 메소드를 호출
 CCCallFunc
 CCCallFuncN: 인자로 노드를 사용
 CCCallFuncND: 인자로 노드와 포인터형 데이터를 사용

실습:액션
 다음과 같이 동작하는 프로그램을 작성하시오.
 Menu 화면
 Sequence: Move, Jump, Move (각 액션 사이에 0.5 지연 추가)
 Spawn: Move & Rotate
 RepeatForever: 좌우 왕복 이동
 위의 내용을 가진 메뉴 화면을 화면에 표시
 메뉴에서 지정된 액션을 수행
액션 84

트랜지션 사용하기

장면의 추가, 삭제, 교체

장면 트랜지션
97
CCTransitionFade
CCTransitionFadeBL
CCTransitionFadeDown
CCTransitionFadeTR
CCTransitionFadeUp
CCTransitionFlipAngular
CCTransitionFlipX
CCTransitionFlipY
CCTransitionJumpZoom
CCTransitionMoveInB
CCTransitionMoveInL
CCTransitionMoveInR
CCTransitionMoveInT
CCTransitionPageTurn
CCTransitionProgressHorizontal
CCTransitionProgressRadialCCW
CCTransitionProgressRadialCW
CCTransitionRotoZoom
CCTransitionSceneOriented
CCTransitionShrinkGrow
CCTransitionSlideInB
CCTransitionSlideInL
CCTransitionSlideInR
CCTransitionSlideInT
CCTransitionSplitCols
CCTransitionSplitRows
CCTransitionTurnOffTiles
CCTransitionZoomFlipAngular
CCTransitionZoomFlipX
CCTransitionZoomFlipY
씬 전환, 메뉴와 레이블

장면 트랜지션
98씬 전환, 메뉴와 레이블

장면의 생성 및 소멸 순서

실습: 트랜지션
 다음과 같은 장면과 장면 전환을 하는 프로그램을 작
성하시오.
 Menu 화면
 게임 화면
 도움말
 설정
 첫 화면은 메뉴 화면
 메뉴 화면
 게임 화면, 도움말 화면, 설정 화면으로 이동
 각 화면으로 전환될 때는 서로 다른 전환 효과를 사용
 게임 화면, 도움말 화면, 설정 화면
 각 화면을 설명하는 문자열을 화면에 표시
 메뉴화면으로 이동

애니메이션 사용하기

애니메이션 기초

스프라이트배치노드

스프라이트배치노드를 이
용한 애니메이션

스프라이트배치노드의 응용

애니메이션 종합

Zwoptex로 스프라이트배
치노드 만들기
118
 Zwoptex
 http://zwopple.com/zwo
ptex/
 Download flash version
스프라이트 시트

실습
 주어진 이미지로 스프라이트 시트를 작성
 만들어진 스프라이트 시트를 사용하여 캐릭터 애니메이션 구현:
프레임 간격 0.5 초
스프라이트 시트 119

사운드 사용하기

심플오디오엔진의 기본
사용법

터치 사용하기

스탠다드 터치 델리게이
트

타겟 지정 터치 델리게이
트

멀티터치

실습
 다음 이미지로 캐릭터 애니메이션 구현: 프레임 간격 0.5 초
 화면상의 위치를 터치하면
 터치한 곳으로 캐릭터 이동
 효과음 재생

스케줄 사용하기

스케줄 기초
 Cocos2d-X의 스케줄러의 이점
 정지(pause)/재시작(resume) 기능 사용
 레이어가 스테이지에 들어가면 자동으로 타이머가 활
성화, 그리고 스테이지를 떠나면 자동으로 비활성화

스케줄의 정지/재시작

동국대 앱창작터 2일차:Cocos2d-X 기본기능

Recommandé

Recommandé

Contenu connexe

Tendances

Tendances (12)

En vedette

En vedette (20)

Similaire à 동국대 앱창작터 2일차:Cocos2d-X 기본기능

Similaire à 동국대 앱창작터 2일차:Cocos2d-X 기본기능 (20)

Plus de Changhwan Yi

Plus de Changhwan Yi (11)

동국대 앱창작터 2일차:Cocos2d-X 기본기능