SlideShare uma empresa Scribd logo
1 de 11
Baixar para ler offline
동국대학교 앱창작터 모바일게임과정II:Cocos2d-X
3일차: 기본기능 실습문제
사전 작업
 실습에 사용할 리소스 다운로드
 https://dl.dropboxusercontent.com/u/69147082/3%EC%9
D%BC%EC%B0%A8_%EC%8B%A4%EC%8A%B5%EB%A6%AC%EC
%86%8C%EC%8A%A4.zip
 Cocos2d-x 프로젝트 생성
 Resources 폴더에 다운받은 리소스 추가
 HelloWorld.cpp 수정
모바일게임과정II:Cocos2d-X 2
실습: 레이블
 화면 상에 3개의 문자열을 표시
 GameStart
 캐릭터맵 사용(A Damn Mess.ttf)
 폰트 크기 : 32
 Settings
 폰트 이름 : Arial Rounded MT bold
 폰트 크기 :32
 Help
 비트맵폰트 사용(markerFelt.fnt)
모바일게임과정II:Cocos2d-X 3
실습: 레이블
모바일게임과정II:Cocos2d-X 4
실습: 스프라이트
 이전 실습 화면에 스프라이트 추가
 ‘grossini.png’
 ‘grossinis_sister1.png’
 ‘grossini.png’의 자식으로 추가
 ‘grossinis_sister2.png’
 ‘grossini.png’의 자식으로 추가
스프라이트 5
실습: 스프라이트
스프라이트 6
실습: 메뉴
 메뉴 만들기
 기존에 만든 레이블을 활용
 alignItemsVertically() 적용
 CCMenuItemLabel 사용
 GameStart
 Settings
 Help
실습: 액션
 스프라이트에 액션 부여하기
 ‘grossini.png’ 스프라이트
 Sequence : Move -> Delay(0.5) -> Rotate -> Delay(0.5) ->
Move(Reverse) -> Delay(0.5)
 위에서 정의한 Sequence를 RepeatForever로 무한 반복
액션 8
실습: 트랜지션
 메뉴 선택시 다른 씬으로 이동(pushScene)
 GameStart : 전환효과 CCTransitionFade
 Settings : 전환효과 CCTransitionPageTurn
 Help : 전환효과 CCTransitionSlideInR
 각 하위 씬들은 이전 씬으로이동할 수 있도록 메뉴
작성
 Back 버튼(popScene)
실습: 애니메이션
 GameStart버튼으로 이동한 화면에 애니메이션 생성
 주어진 이미지로 스프라이트 시트를 작성(grossini-aliases.plist,
grossini-aliases.png)
 캐릭터 애니메이션 구현: 프레임 간격 0.5 초
 무한 반복
스프라이트 시트 10
실습: 사운드&터치
 이전에 생성한 애니메이션을 활용
 화면상의 위치를 터치하면
 터치한 곳으로 캐릭터 이동
 효과음 재생(touch.wav)

Mais conteúdo relacionado

Mais de Changhwan Yi

2013 W3C HTML5 Day Conferences:HTML5 Game App 개발 및 이슈
2013 W3C HTML5 Day Conferences:HTML5 Game App 개발 및 이슈2013 W3C HTML5 Day Conferences:HTML5 Game App 개발 및 이슈
2013 W3C HTML5 Day Conferences:HTML5 Game App 개발 및 이슈Changhwan Yi
 
Html5 게임 기술의 개요
Html5 게임 기술의 개요Html5 게임 기술의 개요
Html5 게임 기술의 개요Changhwan Yi
 
동국대 앱창작터 5일차:Cocos2d-X 확장기능
동국대 앱창작터 5일차:Cocos2d-X 확장기능동국대 앱창작터 5일차:Cocos2d-X 확장기능
동국대 앱창작터 5일차:Cocos2d-X 확장기능Changhwan Yi
 
동국대 앱창작터 4일차:Cocos2d-X 고급기능
동국대 앱창작터 4일차:Cocos2d-X 고급기능동국대 앱창작터 4일차:Cocos2d-X 고급기능
동국대 앱창작터 4일차:Cocos2d-X 고급기능Changhwan Yi
 
동국대 앱창작터 2일차:Cocos2d-X 기본기능
동국대 앱창작터 2일차:Cocos2d-X 기본기능동국대 앱창작터 2일차:Cocos2d-X 기본기능
동국대 앱창작터 2일차:Cocos2d-X 기본기능Changhwan Yi
 
동국대 앱창작터 1일차:Cocos2d-X 소개, 환경설정, 주요개념
동국대 앱창작터 1일차:Cocos2d-X 소개, 환경설정, 주요개념동국대 앱창작터 1일차:Cocos2d-X 소개, 환경설정, 주요개념
동국대 앱창작터 1일차:Cocos2d-X 소개, 환경설정, 주요개념Changhwan Yi
 
W3C HTML5 KIG-The near future of the web platform
 W3C HTML5 KIG-The near future of the web platform W3C HTML5 KIG-The near future of the web platform
W3C HTML5 KIG-The near future of the web platformChanghwan Yi
 
W3C HTML5 KIG-The complete guide to building html5 games
W3C HTML5 KIG-The complete guide to building html5 gamesW3C HTML5 KIG-The complete guide to building html5 games
W3C HTML5 KIG-The complete guide to building html5 gamesChanghwan Yi
 
차세대 웹비즈니스를 위한 "HTML5"
차세대 웹비즈니스를 위한 "HTML5"차세대 웹비즈니스를 위한 "HTML5"
차세대 웹비즈니스를 위한 "HTML5"Changhwan Yi
 
WoO 2012-Web 서비스 기술
WoO 2012-Web 서비스 기술WoO 2012-Web 서비스 기술
WoO 2012-Web 서비스 기술Changhwan Yi
 
W3C HTML5 KIG-Typed Arrays
W3C HTML5 KIG-Typed ArraysW3C HTML5 KIG-Typed Arrays
W3C HTML5 KIG-Typed ArraysChanghwan Yi
 
하이브리드 앱(Hybrid App)
하이브리드 앱(Hybrid App)하이브리드 앱(Hybrid App)
하이브리드 앱(Hybrid App)Changhwan Yi
 
W3C HTML5 KIG-How to write low garbage real-time javascript
W3C HTML5 KIG-How to write low garbage real-time javascriptW3C HTML5 KIG-How to write low garbage real-time javascript
W3C HTML5 KIG-How to write low garbage real-time javascriptChanghwan Yi
 
W3C HTML5 KIG-HTML5 Game Performance Issue
W3C HTML5 KIG-HTML5 Game Performance IssueW3C HTML5 KIG-HTML5 Game Performance Issue
W3C HTML5 KIG-HTML5 Game Performance IssueChanghwan Yi
 

Mais de Changhwan Yi (14)

2013 W3C HTML5 Day Conferences:HTML5 Game App 개발 및 이슈
2013 W3C HTML5 Day Conferences:HTML5 Game App 개발 및 이슈2013 W3C HTML5 Day Conferences:HTML5 Game App 개발 및 이슈
2013 W3C HTML5 Day Conferences:HTML5 Game App 개발 및 이슈
 
Html5 게임 기술의 개요
Html5 게임 기술의 개요Html5 게임 기술의 개요
Html5 게임 기술의 개요
 
동국대 앱창작터 5일차:Cocos2d-X 확장기능
동국대 앱창작터 5일차:Cocos2d-X 확장기능동국대 앱창작터 5일차:Cocos2d-X 확장기능
동국대 앱창작터 5일차:Cocos2d-X 확장기능
 
동국대 앱창작터 4일차:Cocos2d-X 고급기능
동국대 앱창작터 4일차:Cocos2d-X 고급기능동국대 앱창작터 4일차:Cocos2d-X 고급기능
동국대 앱창작터 4일차:Cocos2d-X 고급기능
 
동국대 앱창작터 2일차:Cocos2d-X 기본기능
동국대 앱창작터 2일차:Cocos2d-X 기본기능동국대 앱창작터 2일차:Cocos2d-X 기본기능
동국대 앱창작터 2일차:Cocos2d-X 기본기능
 
동국대 앱창작터 1일차:Cocos2d-X 소개, 환경설정, 주요개념
동국대 앱창작터 1일차:Cocos2d-X 소개, 환경설정, 주요개념동국대 앱창작터 1일차:Cocos2d-X 소개, 환경설정, 주요개념
동국대 앱창작터 1일차:Cocos2d-X 소개, 환경설정, 주요개념
 
W3C HTML5 KIG-The near future of the web platform
 W3C HTML5 KIG-The near future of the web platform W3C HTML5 KIG-The near future of the web platform
W3C HTML5 KIG-The near future of the web platform
 
W3C HTML5 KIG-The complete guide to building html5 games
W3C HTML5 KIG-The complete guide to building html5 gamesW3C HTML5 KIG-The complete guide to building html5 games
W3C HTML5 KIG-The complete guide to building html5 games
 
차세대 웹비즈니스를 위한 "HTML5"
차세대 웹비즈니스를 위한 "HTML5"차세대 웹비즈니스를 위한 "HTML5"
차세대 웹비즈니스를 위한 "HTML5"
 
WoO 2012-Web 서비스 기술
WoO 2012-Web 서비스 기술WoO 2012-Web 서비스 기술
WoO 2012-Web 서비스 기술
 
W3C HTML5 KIG-Typed Arrays
W3C HTML5 KIG-Typed ArraysW3C HTML5 KIG-Typed Arrays
W3C HTML5 KIG-Typed Arrays
 
하이브리드 앱(Hybrid App)
하이브리드 앱(Hybrid App)하이브리드 앱(Hybrid App)
하이브리드 앱(Hybrid App)
 
W3C HTML5 KIG-How to write low garbage real-time javascript
W3C HTML5 KIG-How to write low garbage real-time javascriptW3C HTML5 KIG-How to write low garbage real-time javascript
W3C HTML5 KIG-How to write low garbage real-time javascript
 
W3C HTML5 KIG-HTML5 Game Performance Issue
W3C HTML5 KIG-HTML5 Game Performance IssueW3C HTML5 KIG-HTML5 Game Performance Issue
W3C HTML5 KIG-HTML5 Game Performance Issue
 

동국대 앱창작터 3일차:Cocos2d-X 기본기능 (실습)

  • 2. 사전 작업  실습에 사용할 리소스 다운로드  https://dl.dropboxusercontent.com/u/69147082/3%EC%9 D%BC%EC%B0%A8_%EC%8B%A4%EC%8A%B5%EB%A6%AC%EC %86%8C%EC%8A%A4.zip  Cocos2d-x 프로젝트 생성  Resources 폴더에 다운받은 리소스 추가  HelloWorld.cpp 수정 모바일게임과정II:Cocos2d-X 2
  • 3. 실습: 레이블  화면 상에 3개의 문자열을 표시  GameStart  캐릭터맵 사용(A Damn Mess.ttf)  폰트 크기 : 32  Settings  폰트 이름 : Arial Rounded MT bold  폰트 크기 :32  Help  비트맵폰트 사용(markerFelt.fnt) 모바일게임과정II:Cocos2d-X 3
  • 5. 실습: 스프라이트  이전 실습 화면에 스프라이트 추가  ‘grossini.png’  ‘grossinis_sister1.png’  ‘grossini.png’의 자식으로 추가  ‘grossinis_sister2.png’  ‘grossini.png’의 자식으로 추가 스프라이트 5
  • 7. 실습: 메뉴  메뉴 만들기  기존에 만든 레이블을 활용  alignItemsVertically() 적용  CCMenuItemLabel 사용  GameStart  Settings  Help
  • 8. 실습: 액션  스프라이트에 액션 부여하기  ‘grossini.png’ 스프라이트  Sequence : Move -> Delay(0.5) -> Rotate -> Delay(0.5) -> Move(Reverse) -> Delay(0.5)  위에서 정의한 Sequence를 RepeatForever로 무한 반복 액션 8
  • 9. 실습: 트랜지션  메뉴 선택시 다른 씬으로 이동(pushScene)  GameStart : 전환효과 CCTransitionFade  Settings : 전환효과 CCTransitionPageTurn  Help : 전환효과 CCTransitionSlideInR  각 하위 씬들은 이전 씬으로이동할 수 있도록 메뉴 작성  Back 버튼(popScene)
  • 10. 실습: 애니메이션  GameStart버튼으로 이동한 화면에 애니메이션 생성  주어진 이미지로 스프라이트 시트를 작성(grossini-aliases.plist, grossini-aliases.png)  캐릭터 애니메이션 구현: 프레임 간격 0.5 초  무한 반복 스프라이트 시트 10
  • 11. 실습: 사운드&터치  이전에 생성한 애니메이션을 활용  화면상의 위치를 터치하면  터치한 곳으로 캐릭터 이동  효과음 재생(touch.wav)