シューティングゲームを作ろう 株式会社TKS2 清水友晶

清水 友晶 �  株式会社TKS2 スマートフォンアプリ開発 Webコンテンツ開発

�  日本cocos2d-xユーザ会代表 講演活動 執筆活動

�  チラ裏開発メモ: http://tks2.net/memo

�  SlideShare: http://www.slideshare.net/doraemonsss

�  2014/9/8発売

�  3,200円 ＋ 税

�  2014/7/26発売

�  2,980円 ＋ 税

�  日本cocos2d-xユーザ会 http://cocos2d-x.jp

�  cocos2d-x開発元Chukong Technologies社公認

�  cocos2d-xのための自由なコミュニティー

�  入門者から上級者まで誰でもOK!!ぜひご参加を! (1870人以上参加)

�  cocos2d-xに関することなら何でも投稿できます!!

�  https://www.facebook.com/groups/cocos2dxjp/

�  9/13~14 アキバJam #01

�  9/18 第24回 shinjuku.cocos2d-x

�  9/26 第8回 cocos2d-x勉強会

�  9/29 第2回 cocos2d-JSもくもく勉強会

�  10/23 第25回 shinjuku.cocos2d-x

目次 �  作成するシューティングゲームについて

�  プロジェクトの作成

�  ゲーム作成 1)  ゲーム画面の作成 2)  背景のアニメーション 3)  プレイヤー表示と操作 4)  敵の表示と移動アニメーション 5)  弾の発射 6)  当たり判定 7)  タイトル画面 8)  画面遷移アニメーション

作成するシューティングゲーム �  画面構成

�  タイトル画面 �  ゲーム画面

�  Cocos2d-xの扱い方を学ぶためのシンプルなゲーム

setup.pyの実行 �  Cocos2d-xが用意しているsetup.pyを実行する

�  次の環境変数が設定される �  COCOS_CONSOLE_ROOT

�  自動設定 �  ANDROID_SDK_ROOT

�  Android SDKのディレクトリを指定する �  NDK_ROOT

�  Android NDKのディレクトリを指定する �  ANT_ROOT

�  入力不要 �  環境変数を反映する

�  Win: コマンドプロンプトの再起動 �  Mac: sourceコマンド実行

プロジェクトの作成 �  Cocos2d-xのプロジェクトを作成するためのコマンド

�  setup.pyにおいてCOCOS_CONSOLE_ROOTをしたため、どこからでも実行することができる �  オプション

�  プロジェクト名 �  -l … cpp, lua, javascript �  -d … ディレクトリを指定 �  -p … パッケージ名

cocos new NyanSky ‒d ~/Documents ‒p net.tks2.projects ‒l cpp

ゲームの作成 �  今回使用する画像 http://goo.gl/Tsvxiv

�  プロジェクトのResourcesディレクトリに配置する

(1)ゲーム画面の作成 �  縦画面設定

�  GameLayerクラスの作成

�  簡易マルチレゾリューション対応のためAppDelegateクラスapplicationDidFinishLaunching関数の編集

�  画像の表示 Spriteクラス

�  http://goo.gl/9lCoEQ

(2)背景のアニメーション �  背景画像のアンカーポイント変更

�  移動アニメーション MoveToクラス

�  runAction関数により実行する

�  http://goo.gl/EJJEU7

(3)プレイヤーの表示と操作 �  プレイヤークラスの作成 Player.h Player.cpp �  Spriteクラスを継承 �  今回は特別な操作を行わないが、ヒットポイントや当たり判定など、プレイヤーに関する処理はこのクラスで行うといい

�  EventListenerTouchOneByOneクラスに よるシングルタップイベントの実装

�  http://goo.gl/WfLBu8

(4)敵の表示と移動アニメーション �  敵クラスの作成 Enemy.h Enemy.cpp �  Spriteクラスを継承 �  敵のタイプにより動きを変えれるような仕組みを持つ

�  毎フレーム処理を実行する scheduleUpdate関数 update関数

�  http://goo.gl/GLIKBw

(5)弾の発射 �  弾クラスの作成 Bullet.h Bullet.cpp �  Spriteクラスを継承 �  表示と同時に前方へ移動するアニメーションを用意する

�  スマートフォンでは、弾が自動で発射 するほうが操作しやすい

�  http://goo.gl/4jcJzb

(6)当たり判定 �  敵や弾の中心から一定の半径を、当たり判定の領域とする �  処理速度に直結するため、当たり判定の領域は複雑にしない

�  もし大きな敵を作る場合も、複数の円の領域を用意するとよい

�  当たり判定チェックを毎フレーム行う

�  http://goo.gl/nDEsVA

(7)タイトル画面 �  TitleLayerクラスの作成

�  Buttonクラスによるボタン設置 �  Buttonクラスを利用するために、CocosGUI.hを読み込む

�  タッチイベントは細かく取得できるため、複雑な処理も可能

�  http://goo.gl/FD6uxY

(8)画面遷移アニメーション �  TransitionSceneクラスを継承したクラスにより画面遷移アニメーションを行うことができる

�  ここではページめくりのようなTransitionPageTurnクラスを利用する

�  http://goo.gl/QmiG2Z

おわり

�  ありがとうございました