• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
동국대 앱창작터 1일차:소개, 환경설정, 주요개념
 

동국대 앱창작터 1일차:소개, 환경설정, 주요개념

on

  • 920 views

동국대 앱창작터 모바일게임 과정 2

동국대 앱창작터 모바일게임 과정 2
1일차 과정

Statistics

Views

Total Views
920
Views on SlideShare
920
Embed Views
0

Actions

Likes
2
Downloads
0
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    동국대 앱창작터 1일차:소개, 환경설정, 주요개념 동국대 앱창작터 1일차:소개, 환경설정, 주요개념 Presentation Transcript

    • 1일차:소개, 환경설정, 주요개념 동국대학교 앱창작터 모바일게임과정II:Cocos2d-X
    • 목차  강좌개요  Cocos2d-X 소개  Cocos2d-X 설치  Cocos2d-X의 기본 구조  좌표계와 앵커포인트  프로젝트 기본형 만들기 모바일게임과정II:Cocos2d-X 2
    • 강좌 개요 모바일게임과정II:Cocos2d-X 3
    • 강좌 개요  모바일 게임 프로그래밍 과정 II  Cocos2d-X  기간: 2013년 7월 8일 – 12일  교재:  시작하세요! Cocos2d-x 프로그래밍  이재환 지음, 위키북스, 2013년 02월 28일 모바일게임과정II:Cocos2d-X 4
    • 강좌 일정 모바일게임과정II:Cocos2d-X 5 일차 주요 내용 세부 내용 1일차 소개, 환경설 정, 주요개념 0.개요 1.Cocos2d-x 설치 2.Cocos2d-x의 기본 구조 3.좌표계와 앵커포인트 4.프로젝트 기본형 만들기 2일차 기본 기능 5.레이블 사용하기 6.스프라이트 사용하기 7.메뉴 사용하기 8.액션 사용하기 9.트랜지션 사용하기 10.애니메이션 사용하기 11.사운드 사용하기 12.터치 사용하기 13.스케줄 사용하기
    • 강좌 일정 모바일게임과정II:Cocos2d-X 6 일차 주요 내용 세부 내용 3일차 CocosBuilder CocosBuilder 소개/설치 CocosBuilder 사용방법 Cocos2d-X에서 CocosBuilder 결과물 사용하는 방법 4일차 고급 기능 14.패럴렉스노드 사용하기 15.타일맵 사용하기 16.파티클 사용하기 5일차 확장 기능 17.데이터 저장하기 18.사용자 입력 사용하기 19.HTTP 통신 사용하기 20.XML 사용하기 21.JSON 사용하기 22.스크롤뷰 사용하기 23.중력 가속도계 사용하기
    • COCOS2D-X 소개 모바일게임과정II:Cocos2d-X 7
    • Cocos2d-x 엔진  Cocos2d-x  2D 게임엔진 라이브러리  C++ / LUA / Javascript 지원  OpenGL-ES 기반의 게임 엔진  다양한 플랫폼 지원  www.cocos2d-x.org 모바일게임과정II:Cocos2d-X 8
    • Cocos2d Family 모바일게임과정II:Cocos2d-X 9 cocos2d (python) cocos2d-iphone cocos2d-x cocos2d- javascript cocos2d-android cocos2d-android- 1 cocos2d-html5cocos2d-xna (from Cocos2d-X.org )
    • 주요 프로젝트  Cocos2d-X  Cocos2d-HTML5  Cocos2d-iPhone  CocosBuilder 모바일게임과정II:Cocos2d-X 10
    • Global Contributors 모바일게임과정II:Cocos2d-X 11
    • 모바일게임과정II:Cocos2d-X 12
    • Cocos2d Javascript API  Cocos2d-x API exported, compatible with Cocos2d- html5  OpenGL ES 2.0 exported, compatible with WebGL  Chipmunk API  libWebsocket API  XMLHttpRequest API 모바일게임과정II:Cocos2d-X 13
    • 모바일게임과정II:Cocos2d-X 14
    • Plugin-X:Integrate 3rd SDK easily 모바일게임과정II:Cocos2d-X 15
    • 모바일게임과정II:Cocos2d-X 16
    • Cocos2d 3.0  Entity-Component architecture  A whole new GUI framework  New rendering pipeline  C++ 11 support  BMFont in runtime from TTF  multi-threading support  WYSIWYG editors 모바일게임과정II:Cocos2d-X 17
    • Tools  CocosBuilder  Version 3.0 alpha5  www.cocosbuilder.com  Mac only  Cocos2d’s Javascript bindings, which means that your code, animations, and interfaces  CocoStudio  Version 0.1.3  studio.cocos2d-x.org  Windows Only  UI Editor, Animation Editor, Data Cruncher, Scene editor, CocoStudio Framework, etc. 모바일게임과정II:Cocos2d-X 18
    • COCOS2D-X 설치 모바일게임과정II:Cocos2d-X 19
    • Cocos2d-x의 장점  API가 배우고 사용하기 쉽고 간단함  적은 용량으로 게임 개발에 필요한 거의 모든 기능 제공  오픈소스 프로젝트이므로 무료로 이용  OpenGL ES 1.1/2.0에 최적화돼 있어 빠름  멀티 플랫폼을 지원  iOS, Android, BlackBerry, Bada, Marmalade, Windows, Linux 등 모바일게임과정II:Cocos2d-X 20
    • Cocos2d에서 제공하는 기능  장면(Scene) 관리 기능  장면전환(Scene Transition) 기능  메뉴 및 버튼 시스템 지원  스프라이트(Sprite) 및 스프라이트 배치노드(SpriteBatchNode) 지원  다양한 액션(Action) 지원  애니메이션(Animation) 지원  정지/플레이 및 좀 더 정교한 사용법이 간단한 타이머 기능 지원  텍스트 렌더링(Text Rendering) 지원  사운드(Sound) 지원  파티클 시스템(Particle System) 지원  타일맵(TileMap) 지원  물리 엔진(Physics Engine) 지원: Box2D & Chipmunk 모바일게임과정II:Cocos2d-X 21
    • Cocos2d-x의 개발환경  Windows  Microsoft의 Visual Studio 또는 Visual Studio Express  Mac  Apple의 Xcode  developer.apple.com  Eclipse  Mac OS X, Windows, Linux 지원  CDT 사용  www.eclipse.org 모바일게임과정II:Cocos2d-X 22
    • Cocos2d-x 다운로드  다운로드  http://www.cocos2d-x.org  Version: cocos2d-x-2.1.4 모바일게임과정II:Cocos2d-X 23
    • 윈도우에서 Cocos2d-X 설치  Cocos2d-X 파일 다운로드  다운로드 받은 압축파일 풀기  Visual Studio Template 설치  install-template-msvc.bat 실행  Visual Studio에서 솔루션 파일 열기  cocos2d-win32.vc2008.sln  cocos2d-win32.vc2010.sln  cocos2d-win32.vc2012.sln  솔루션 전체 빌드 실행 모바일게임과정II:Cocos2d-X 24
    • 윈도우에서 cocos2d-x 프로젝트 생성하기  Visual Studio에서 “새 프로젝트” 선택  “새 프로젝트 추가” 대화상자에서 Cocos2d-X 선택  프로젝트 이름 입력  프로젝트 마법사 대화상자에서 옵션 선택  물리엔진 사용여부: Box2D, Chipmunk  사운드 엔진  Lua 사용여부  프로젝트 종속성 설정  libcocos2d, libCocosDenshion(사운드 엔진), libBox2D/libchipmunk (물리엔진) 등  프로젝트 실행 모바일게임과정II:Cocos2d-X 25
    • 맥에서 cocos2d-x 설치  Cocos2d-X 파일 다운로드  다운로드 받은 압축파일 풀기  터미널에서 install-templates-xcode.sh 실행  Xcode 실행 후, 새 프로젝트 선택  Xcode 프로젝트 대화상자의 왼편에서 cocos2d-x 선택  대화상자의 오른편에서 cocos2dx, cocos2dx_box2d, cocos2dx_chipmunk, cocos2dx_js, cocos2dx_lua 중 선택  프로젝트 이름 입력  프로젝트 실행 모바일게임과정II:Cocos2d-X 26
    • 윈도우용 프로젝트를 iOS 용 프로젝트로 포팅하기  윈도우에서 생성한 프로젝트 폴더로 이동  Classes와 Resources 폴더를 Xcode 프로젝트 디렉 토리로 이동 모바일게임과정II:Cocos2d-X 27
    • iOS 프로젝트를 안드로이 드 프로젝트로 포팅하기  Xcode에서 생성한 프로젝트 폴더로 이동  Classes와 Resources 폴더를 이클립스 프로젝트 디 렉토리로 이동 모바일게임과정II:Cocos2d-X 28
    • Android NDK 설치  developer.android.com에서 NDK 다운로드  다운로드 받은 NDK를 압축해제  환경변수 설정 (.bashrc)  create-android-project.sh 파일 수정  NDK_ROOT_LOCAL과 ANDROID_SDK_ROOT_LOCAL 내용 수 정 모바일게임과정II:Cocos2d-X 29 export ANDROID_SDK_ROOT=<안드로이드 SDK 경로> export ANDROID_NDK_ROOT=<안드로이드 NDK 경로> export COCOS2DX_ROOT=<cocos2d-x 경로> export NDK_ROOT=<NDK 경로> export PATH=$PATH:$NDK_ROOT
    • Android 프로젝트 생성하 기  create-android-project.sh를 실행하여 안드로이드 프로젝트 생성  Cocos2d-X 설치된 곳에서 안드로이드 관련 파일을 프로젝트 폴더로 복사  $COCOS2D_ROOT/cocos2dx/platform/android/java/src/or g/cocos2dx에서 lib 디렉토리를 proj.android/src/org/cocos2dx 로 복사  안드로이드 프로젝트 폴더에 있는 build_native.sh 실행  이클립스에서 안드로이드 생성된 프로젝트 import 모바일게임과정II:Cocos2d-X 30
    • iOS 프로젝트와 안드로이 드 프로젝트 통합  iOS 프로젝트와 안드로이드 프로젝트 생성  안드로이드 프로젝트 디렉토리에서 proj.android 디렉토리를 iOS 프로젝트 디 렉토리로 복사  $COCOS2DX_ROOT/cocos2dx에서 android.mk 파일을 iOS 프로젝트 디렉토리의 libs/cocos2dx로 복사  $COCOS2DX_ROOT/CocosDenshion에서 android 디렉토리를 libs/CocosDenshion으로 복사  $COCOS2DX_ROOT/cocos2dx에서 platform 디렉토리를 libs/cocos2dx로 복사 (iOS 프로젝트에 이미 있는 내용은 삭제 후 복사)  $COCOS2DX_ROOT/extensions에 있는 android.mk 파일을 libs/extensions로 복 사  $COCOS2DX_ROOT/extensions/GUI/CCEditBox에 있는 CCEditBoxImplAndroid.cpp, CCEditBoxImplAndroid.h 파일을 libs/extensions/GUI/CCEditBox에 복사  $COCOS2DX_ROOT/cocos2dx/platform/android/java/src/org/cocos2dx에서 lib 디 렉토리를 proj.android/src/org/cocos2dx로 복사  proj.android./build_native.sh 파일 편집  COCOS2DX_ROOT=“$DIR/../libs"로 수정 모바일게임과정II:Cocos2d-X 31
    • 통합 프로젝트 생성기 사용  Cocos2d-x 2.1에서 추가  Cocos2d-x가 설치된 디렉토리의 $COCOS2DX_ROOT/tools/project- creator/create_project.py 실행  여러 플랫폼을 위한 프로젝트 파일을 생성 모바일게임과정II:Cocos2d-X 32 ./create-project.py –project MyGame –package com.MyCompany.AwesomeGame -language cpp
    • COCOS2D-X의 기본 구조 모바일게임과정II:Cocos2d-X 33
    • CCNode  Cocos2d-X의 최상위 클래스  다양한 프로퍼티 제공  위치, 색상, 투명도, 크기, 회전, 가시성 여부, 카메라, 그리도 (grid) 등  자식 노드를 가질 수 있음  다른 노드에 대해서 컨테이너처럼 사용하는 것이 가능  객체들의 계층 구조를 만들 때 사용  자체 스케줄러를 가지고 있음  게임 루프를 만들 때 사용  1/60 프레임  중지(pause)와 재시작(resume) 기능 제공 모바일게임과정II:Cocos2d-X 34
    • CCDirector  싱글톤 클래스  하나의 애플리케이션에 하나의 인스턴스만 존재  여러 장면들을 관리하는 클래스 모바일게임과정II:Cocos2d-X 35
    • CCScene과 CCLayer  CCScene과 CCLayer  스프라이트, 레이블, 메뉴 등과 같은 클래스 객체를 자 식으로 가질 수 있음  차이점  CCScene은 사용자 터치 이벤트를 받아서 처리할 수 없고 Accelerometer 입력 수신과 처리 할 수 없음  CCLayer는 사용자 터치 이벤트를 받아서 처리할 수 있고 Accelerometer 입력 수신과 처리 할 수 있음 모바일게임과정II:Cocos2d-X 36
    • CCScene  예  하나의 게임은 여러 장면(Scene)으로 구성 모바일게임과정II:Cocos2d-X 37
    • CCLayer: 예  예) 모바일게임과정II:Cocos2d-X 38
    • CCLayer: 예  여러 레이어로 구성  배경  캐릭터  HUD  참고  CCNode의 계층구조 모바일게임과정II:Cocos2d-X 39
    • CCLayer: 예  메뉴 또는 HUD(Head Up Display) 레이어  캐릭터 레이어  배경 레이어 모바일게임과정II:Cocos2d-X 40
    • CCSprite  화면에 출력되어 보이는 클래스  스프라이트  화면을 구성하는 정적 이미지나 애니메이션이 되는 일 련의 이미지를 가리키는 말  게임에서 사용되는 이미지  이미지 파일 로딩과 화면 출력에 관련한 다양한 메소드 를 제공 모바일게임과정II:Cocos2d-X 41
    • CCAction  CCNode 클래스를 상속한 클래스의 애니메이션 처 리를 위한 클래스  기본 액션: 이동, 회전, 점프, 크기 변환 등  복합 액션: 기본 액션들을 결합하거나 반복하는 액션  By 액션과 To 액션  By 액션: 현재 값에서 지정한 값만큼 변하는 액션  To 액션: 지정한 값으로 변하는 액션  Reverse 액션  기본적으로 반대로 동작하는 새 액션을 수행 모바일게임과정II:Cocos2d-X 42
    • 좌표계와 앵커포인트 모바일게임과정II:Cocos2d-X 43
    • 좌표계  원점  화면의 좌측 하단  OpenGL에서 사용하는 좌표계 모바일게임과정II:Cocos2d-X 44
    • 좌표계 모바일게임과정II:Cocos2d-X 45
    • 앵커포인트  앵커포인트(AnchorPoint)  메뉴, 레이블, 스프라이트 등이 레이어나 장면에 포함될 때 기준이 되는 부분  범위: (0.0, 0.0) – (1.0, 1.0) 모바일게임과정II:Cocos2d-X 46
    • 앵커포인트 모바일게임과정II:Cocos2d-X 47
    • 프로젝트 기본형 만들기 모바일게임과정II:Cocos2d-X 48
    • 맥에서 프로젝트 기본형 만들기 모바일게임과정II:Cocos2d-X 49
    • 모바일게임과정II:Cocos2d-X 50
    • 모바일게임과정II:Cocos2d-X 51
    • 모바일게임과정II:Cocos2d-X 52
    • 통합 프로젝트 생성기 사 용  터미널 실행  $COCOS2DX_ROOT/tools/project-creator 디렉토리 로 이동  create-project.py 실행  $COCOS2DX_ROOT/projects 디렉토리 아래에 프로 젝트 생성  iOS: $COCOS2DX_ROOT/projects/<project>/proj.ios 디렉 토리에 있는 프로젝트를 Xcode에서 열기  Android: $COCOS2DX_ROOT/projects/<project>/proj.android 디렉 토리에 있는 build_native.sh 를 실행 모바일게임과정II:Cocos2d-X 53
    • 모바일게임과정II:Cocos2d-X 54
    • 모바일게임과정II:Cocos2d-X 55
    • 모바일게임과정II:Cocos2d-X 56
    •  이클립스에서 프로젝트 열기 모바일게임과정II:Cocos2d-X 57
    •  생성한 Cocos2d-X 프로젝트 Import 모바일게임과정II:Cocos2d-X 58
    •  Cocos2d-X 안드로이드 라이브러리 프로젝트 임포 트  $COCOS2DX_ROOT/cocos2dx/platform/android/java 모바일게임과정II:Cocos2d-X 59
    •  화면 회전: Ctrl + F12 모바일게임과정II:Cocos2d-X 60
    • 실습1  Cocos2d-X 다운로드  Cocos2d-X 설치  Xcode 템플릿  ./install-templates-xcode.sh -u  Cocos2d-X를 위한 안드로이드 환경 설정  SDK 설치:  NDK 설치  create-project.py를 사용하여 iOS/Android 프로젝 트 생성  생성된 프로젝트를 Xcode와 이클립스에서 실행 모바일게임과정II:Cocos2d-X 61
    • 실습2  교재 P77 – P80  화면 바탕색 변경 모바일게임과정II:Cocos2d-X 62