Gcs2014 0225 cocos2d-xjsb

3,932 views

Published on

GCS2014で講演した cocos2d-x javascript bindingsについてのスライドとなります。

サンプルソースコード
https://github.com/Seasons7/Hitohude

Published in: Education
0 Comments
6 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,932
On SlideShare
0
From Embeds
0
Number of Embeds
2,357
Actions
Shares
0
Downloads
2
Comments
0
Likes
6
Embeds 0
No embeds

No notes for slide

Gcs2014 0225 cocos2d-xjsb

  1. 1. GCS2014 cocos2d-x JavaScript Bindingsによる マルチプラットフォーム開発 Keisuke Hata (@Seasons)
  2. 2. 自己紹介 • cocos2d Japan evangelist • @ Seasons • @ cocos2dfan_jp • f cocos2d facebook Group • B Seasons.NET • S SlideShare • 執筆、連載活動(Mobile Touch)
  3. 3. アジェンダ 1. cocos2d-x 2. 開発環境 3. JavaScript Bindings 4. デバッグ手法 5. 開発支援ツール 6. デモ
  4. 4. cocos2d-x
  5. 5. cocos2d-x • オープンソースプロジェクト • 中国、米国で開発 • 2Dゲームフレームワーク • OpenGL ES 1.1/2.0対応 • マルチプラットフォーム対応
 (iOS,Mac,Android,Windows…) • ネイティブ言語、スクリプト対 応 • v2.x系、v3.x系の2系統 cocos2d-x cocos2d-html5 cocos2d-xna
  6. 6. 開発環境
  7. 7. 開発環境 • Windows, Mac, Linux PC • C++,C言語 • Lua, JS Binding対応 • Lua JS C++, C Windows, Mac, Linux ソースコード共通 or CocoStudioは、Windowsでのみ
 動作。利用したい環境にあわせて
 OS使い分けると良い。 メインOS Parallels Desktop, VMWare (Mac, Windows, Linux)
  8. 8. JavaScript Bindings
  9. 9. JavaScript Bindings(JSB) • One Source on マルチ環境 • JavaScriptを共通言語
 (cocos2dのプラットフォームで共有) • cocos2dの機能をフルサポート • 高いパフォーマンス Common JavaScript SourceCode cocos2d-iphone cocos2d-mac cocos2d-x cocos2d-html5
  10. 10. JSBの実装 • JavaScript Bindingsの実装の 種類は、2種類 • • zynga repository • cocos2d-x repository 基本仕様は同じであるが、 実装の内容が異なる。 zyngaのiPhone版のjsbが
 ベースとなっている。 JavaScript Bindings cocos2d-x zynga
  11. 11. JSB アーキテクチャ JavaScript (JavaScript : *.js ) SpiderMonkey (VM) JavaScript Bindings (C++ : *.cpp) Native Library (C++,C : *.c, *.cpp)
  12. 12. SpiderMonkey • C言語で記述されたJavaScript エンジン
 ( v27搭載[2014/02/16現在] ) • SpiderMoneky (original) オープンソースプロジェクト • MPL/GPL/LGPLのトリプル ライセンス • cocos2d組み込み用にカスタ マイズ(ビルド向け) SpiderMoneky v27 (for cocos2d) cocos2d-x
  13. 13. JSBの機能 • cocos2d-xのクラスを利用可能 • C/C++の資産の再利用=>JS側からコール可能 • カスタマイズが可能 • JS->Cppへの変換の自動化 • JS上でネイティブオブジェクトのサブクラス化 • Callbackのサポート • デバッガのサポート
  14. 14. APIの互換性 • cocos2d-html5との互換性が担保。移植が容易。 同じソースコードを利用可能 *.js cocos2d-html5 cocos2d-x
  15. 15. JSBの仕組み 1. JS側からCpp側のネイティブの cocos2dライブラリを呼び出す
 JS Cpp (要プロキシオブジェクト)。 2. 構造体などは、Cpp側のコード にアクセスするのではなく、
 JS側でそのまま移植。 JS cc.p = function( x, y ) { return {x:x, y:y}; };
  16. 16. オブジェクトライフサイクル xxxx.create() • • JSとCppのオブジェクトライ フサイクル管理用にProxyオブ ジェクトを用意。 ネイティブオブジェクトの
 破棄のタイミングでプロキシ オブジェクト経由でJSオブ ジェクトを破棄 Cpp Object Proxy Object JS Object Hash Table Proxy Object Proxy Object
  17. 17. デバッグ手法
  18. 18. デバッグ手法 1. CCLOG=cc.logの出力 cc.log( 出力したい文字列 or オブジェクト) 2. Firefoxを利用した
 高性能デバッガ Firefoxリモートデバッガ Pause, Continue 上記2つの詳細な解説は、 「cocos2d javascript bindingsで マルチプラットフォーム開発」 第10,11回で解説。 Step In, Out Watch Breakpoint
  19. 19. 開発支援ツール
  20. 20. SublimeText エディタ • http:// www.sublimetext.com • テキストエディタ • 軽快な動作 • カスタマイズ性が高い • 豊富なプラグイン
  21. 21. WebStorm エディタ • http://www.jetbrains.com/ webstorm/ • Web開発専用統合環境 • 高機能(コード補完、エラー チェックなど) • 豊富なプラグイン
  22. 22. TexturePacker テクスチャ • http:// www.codeandweb.com/ texturepacker • テクスチャ汎用ツール • • 減色 • • アトラス化 圧縮 cocos2d対応
  23. 23. GlyphDesigner フォント • http://71squared.com/ja/ glyphdesigner • ビットマップフォントツール • cocos2d対応(CCBMFont)
  24. 24. ParticleDesigner パーティクル • http://71squared.com/ particledesigner • パーティクル生成ツール • cocos2d対応(CCParticle)
  25. 25. Dash リファレンス • https://itunes.apple.com/jp/ app/dash-docs-snippets/ id458034879?mt=12 • リファレンスツール • 軽快な動作 • スニペット機能対応 • cocos2dシリーズ対応
  26. 26. 各種デモ
  27. 27. デモ一覧 • JSB Debugger on Firefox 27 • JSB Sample Game

×