ogdc 2014_hands on experience with cocos2dx in cross-platform with farmery_mr. vu ngoc kien

37
Farmery development using cocos2d-x Vu Ngoc Kien - Game Studio North / VNG

Upload: ogdc

Post on 13-May-2015

320 views

Category:

Documents


3 download

TRANSCRIPT

Page 1: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Farmery development using

cocos2d-x

Vu Ngoc Kien - Game Studio North / VNG

Page 2: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Farmery Game

Page 3: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Farmery Game

Over 1M downloads on Google Play

Top 10 frees on Apple Store

Run well on low specs as Galaxy Y phone

Coming soon on WP

Page 4: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Cocos2d-x - Cross platform game engine

Page 5: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

2D Cross-Platform engine game

Open source

High performance

Using cocos2d-ios documents as APIs are

similar

Many support tools

Advantages

Page 6: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Not easy

Many choices: C++, Lua, Java Script

Use C++ language

Require understandings of different

platforms setup

Approach Cocos2d-x

Page 7: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

1. Animation in Farmery game

2. Multiscreen in Cocos2d-x

3. Debug Cocos2d-x on Android

Farmery development using Cocos2d-x

Page 8: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Over 125 animations in game

Optimize to save memory

1. Animation in Farmery

Page 9: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Frame-By-Frame Animation

64 pictures, 2MB

Page 10: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Tween Animation

5 pictures, 240 KB

Page 11: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Make Animations using Dragon Bone

http://dragonbones.github.io

Page 12: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Artists produce objects parts

Page 13: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Assemble animations on Flash

Page 14: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Extract animation file using Dragon Bone

Page 15: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Result

Page 16: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Using flash in animation

Import PSD Layer

Support pictures skewing

Advantages

Page 17: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

1. Animation in Farmery game

2. Multi screen in Cocos2d-x

3. Debug Cocos2d-x on Android

Farmery development using Cocos2d-x

Page 18: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

2. Multi screen in Cocos2d-x

480 x 320

2048 x 1536

1136 x 640

1080 x 1920

Page 19: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

DesignResolutionSize: standard screen size

CCEGLView::sharedOpenGLView()->setDesignResolutionSize

(width, height, policy)

Policy:

• Exact fit

• Show all

• No border

• Fixed Height

• Fixed Width

Multiscreen in cocos2d-x

Page 20: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Picture looks stretched

Exact fit

Page 21: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

2 black edges on the screen

Show all

Page 22: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

No border

Page 23: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

contentScaleFactor = RH/DH, resource for screen suitably

contentScaleFactor = (RH/DH)/ (MIN(fScaleX, fScaleY) /

MAX(fScaleX, fScaleY)).

fScaleX = FW/ DW; float fScaleY = FH/DH.

contentScaleFactor

Page 24: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Farmery displays well on different screen sizes

Page 25: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

1. Animation in Farmery game

2. Multiscreen by Cocos2d-x

3. Debug Cocos2d-x on Android

Farmery development using Cocos2d-x

Page 26: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Require Cygwin, NDK

Setup NDK path

Can’t debug native

Build cocos2d-x on Android by Cygwin on Windows

Page 27: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Build cocos2d-x on Android by eclipse

Not require Cygwin

Can debug native

Page 28: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Undefined Cygwin

(properties -> C/C++ Build -> Environment)

Edit Project Properties

Page 29: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Use Android GCC tool chain

(properties -> C/C++ Build -> Tool Chain Editor)

Edit Project Properties

Page 30: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

• Setting build command: ndk-build NDK_DEBUG=1 –j8

(properties -> C/C++ Build -> Builder Setting)

Edit Project Properties

Page 31: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Link Classes folder

(properties -> C/C++ General -> Paths and Symbols -> Source Location)

Edit Project Properties

Page 32: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Add module path

$(call import-add-path,(LOCAL_PATH)/../../../../../)

$(call import-add-path,(LOCAL_PATH)/../../../../../cocos2dx/platform/third_party/android/prebuilt)

$(call import-module,cocos2dx)

Edit file Android.mk

Page 33: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Crash will show on LogCat

Page 34: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Use Breakpoint to debug

Page 35: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

1. Make Animation with Flash and Dragon Bone

2. Multiscreen by Cocos2d-x

3. Debug cocos2d-x on Android by Eclipse

Develop Farmery by Cocos2d-x

Page 36: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien
Page 37: OGDC 2014_Hands on experience with Cocos2dx in cross-platform with Farmery_Mr. Vu Ngoc Kien

Farmery development using cocos2d-x

Vu Ngoc Kien [email protected] (Game Studio North /VNG)