CocoStudioとcocos2d-xの連携2
Upcoming SlideShare
Loading in...5
×
 

CocoStudioとcocos2d-xの連携2

on

  • 4,786 views

CocoStudioとcocos2d-xの連携2

CocoStudioとcocos2d-xの連携2

Statistics

Views

Total Views
4,786
Views on SlideShare
4,763
Embed Views
23

Actions

Likes
11
Downloads
12
Comments
0

1 Embed 23

https://twitter.com 23

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

CocoStudioとcocos2d-xの連携2 CocoStudioとcocos2d-xの連携2 Presentation Transcript

  • CocoStudioと cocos2d-xの連携2 (cocos2d-x 3.0rc0, CocoStudio 1.3) 株式会社TKS2 清水友晶
  • 清水 友晶 —  株式会社TKS2 スマートフォンアプリ開発 Webコンテンツ開発 —  日本cocos2d-xユーザ会代表 講演活動 執筆活動 —  チラ裏開発メモ: http://tks2.net/memo —  SlideShare: http://www.slideshare.net/doraemonsss
  • —  6/25発売 —  2,800円 + 税 —  400ページ —  6/18発売 —  2,980円 + 税 —  312ページ —  日経ソフトウェア 2014年2月号
  • —  日本cocos2d-xユーザ会 http://cocos2d-x.jp —  cocos2d-x開発元Chukong Technologies社公認 —  cocos2d-xのための自由なコミュニティー —  入門者から上級者まで誰でもOK!!ぜひご参加を! (1300人以上参加) —  cocos2d-xに関することなら何でも投稿できます!! —  https://www.facebook.com/groups/cocos2dxjp/
  • —  3/30 第18回 shinjuku.cocos2d-x —  4/18 第19回 shinjuku.cocos2d-x
  • 目次 —  cocos2d-x 3.0rc0におけるプロジェクト作成 —  setup.py —  cocosコマンド —  CocoStudioについて —  UI Editorの使い方 —  cocos2d-xでUIの表示 —  Animation Editorの使い方 —  cocos2d-xでAnimationの表示 —  実際にさわってみよう!
  • cocos2d-x 3.0rc0における プロジェクト作成 —  setup.py —  環境変数の設定を行うことができる —  COCOS_CONSOLE_ROOT —  NDK_ROOT —  ANDROID_SDK_ROOT —  ANT_ROOT —  cocosコマンドでAndroid向けビルドをするには、 Android NDK, Android SDK, ANTが必要になるため、 チェックの意味も含めて実行してみるといい
  • cocos2d-x 3.0rc0における プロジェクト作成 —  cocosコマンド —  new —  クロスプラットフォーム対応プロジェクトの生成を行うことが できる —  プロジェクト名 —  -p … パッケージ名 —  -d … ディレクトリ —  -l … 言語(cpp, lua, js) —  ./cocos new MyProject -p net.tks2.MyProject -d -l cpp —  run —  指定プラットフォームのビルドを行い、シミュレータまたは実 機で実行することができる —  -p … プラットフォーム(android, ios, mac, web, win32, linux) —  -m … モード(debug, release) —  ./cocos run -s /MyProject -p android
  • CocoStudioについて —  CocoStudioの起動画面
  • Animation Editor —  スケルタルアニメーション(ボーンアニメーション)を 作成することができる —  Flashのプロジェクトを開くことができる(fla, xml) —  出力時、自動でテクスチャアトラスを作成してくれる
  • UI Editor —  UIおよびアニメーションを作成することができる —  機能としてはCocosBuilderと同じようなことができる —  CocosBuilderのファイルを開くことができる(ccb)
  • Scene Editor —  シーンを作成することができる —  Animation EditorやUI Editorで作成したノードを利用 —  クロスプラットフォーム対応プロジェクトを作成でき る(cocos2d-x 2.2.3)
  • Data Editor —  エクセルデータをKey-Valueデータへ変換するための 確認ができる(xls, csv) —  JSON, SQLiteも将来的に対応予定 —  xls, csvファイルをjsonへ変換できる
  • UI Editorの使い方 デモ
  • cocos2d-xでUIの表示 —  各パーツはGUIReaderクラスを利用しファイルから読み込 む GUIReader::getInstance()->widgetFromJsonFile("xxx.ExportJson"); —  UI Editorで作成したアニメーションは、 ActionManagerExクラスを利用して実行する ActionManagerEx::getInstance()->playActionByName("xxx.ExportJson", "XXXXX"); —  ボタンのタップイベントは、ボタンのNodeを取得し、 addTouchEventListener関数を利用して追加する button->addTouchEventListener(this, toucheventselector(HelloWorld::xxx));
  • Animation Editorの使い方 デモ
  • cocos2d-xでAnimationの表示 —  アニメーションデータは、ArmatureDataManagerクラスで 事前に読み込んでおく ArmatureDataManager::getInstance()->addArmatureFileInfo("xxx.ExportJson"); —  キャラクタの生成は、Armatureクラスを利用する auto character = Armature::create("xxx"); —  キャラクタのアニメーションは、ArmatureAnimationクラ スで管理する character->getAnimation()->play("xxx");
  • 実際にさわってみよう! —  これから利用するリソースはこちら —  http://goo.gl/kkbCZB
  • 画面を縦に設定する —  Device Orientationの設定 —  RootViewController.mmの変更 —  58行目 return UIInterfaceOrientationIsPortrait( interfaceOrientation ); —  64行目 return UIInterfaceOrientationMaskPortrait;
  • 背景の表示 —  GUIReaderクラスにより、Background.ExportJson からレイヤーを取得する —  auto layout = dynamic_cast<Layout*>(GUIReader::getInstance()- >widgetFromJsonFile("JumpingPenguinUI/ Background.ExportJson")); —  位置調整を行う —  ソース —  http://goo.gl/5PKGNx
  • キャラクタの表示 —  ArmatureDataManagerクラスにより、キャラクタ データを取得する —  ArmatureDataManager::getInstance()- >addArmatureFileInfo( xxx.ExportJson"); —  キャラクタの生成 —  _penguin = Armature::create( xxx"); —  ソース —  http://goo.gl/svlMoa
  • スタートの表示 —  ActionManagerExクラスにより、UIのアニメーション を実行する —  ActionManagerEx::getInstance()- >playActionByName("xxx.ExportJson", "xxx"); —  ソース —  http://goo.gl/ZOf0X2
  • タップイベントの設定 —  ボタンに対してaddTouchEventListener関数によりイ ベントを追加する —  auto goButton = dynamic_cast<Button*>(layer- >getChildByName("Go")); —  goButton->addTouchEventListener(this, toucheventselector(HelloWorld::goCallback)); —  ソース —  http://goo.gl/ZeBTfa
  • おわり —  ありがとうございました