Cocos2d-x v3 チュートリアル 2

基本コンセプト

元記事はこちらです。
Parkour Game with JavaScript (Cocos2d-JS v3.0) Chapter3

Cocos2d-xは、もともとiOS(iPhoneやiPadで採用されているOS)用にObjective-Cで開発されたゲームエンジンCocos2dをマルチプラットフォームで動作するようにc++へ移植したものです。ですから、基本的な構造はCocos2dと同じです。

Cocos2dは、3つの基本的なノード(node)から構成されています。
– Scene
– Layer
– Sprite

Scene

1つの画面を表すクラスが、Sceneクラスです。例えば、タイトルシーン、ゲーム中シーン、設定シーンなどです。

Layer

Layerクラスは、画面上に重ねあわせるレイヤー(層)を表します。半透明などにより、後ろの他のレイヤーを見ることができるようにします。ゲームの見た目を構成するのに最適です。例えば、次のような構成にすることができます。実際にゲームを制作する場合は、Layerクラスを継承したクラスを作成して重ねあわせます。

  • Background Layer・・・背景
  • Game Play Layer・・・実際のゲームプレイに必要な画像など
  • Status Layer・・・ゲームの状態表示

Layerstructure

Sprite

スプライト(sprite)というのは、小さな妖精の意味です。画像などのゲームの部品を入れます。キャラクタの動きなどは、スプライトを使って実現します。

座標系

Cocos2dは、OpenGLと同じ右手座標系(Right-handed Cartesian Coordinate System)を採用しています。この座標系では、右に+X、上に+Y、手前に+Zになります。Cocos2dは基本的には2D用のゲームエンジンですが、よくある2Dの左上が原点の座標ではありませんので、注意が必要です。

Coordinatesystem

Anchor Point

アンカーポイント(Anchor point)というのは、位置と回転軸の両方の基準となる点のことです。アンカーポイントは相対的な座標で表し、(0,0)は、左下の座標ということになります。中心にする場合は、(0.5f,0.5f)にします。位置を変更するためのsetPosition()関数を呼び出すと、アンカーポイントの位置がその一になるように移動します。また、回転させるとアンカーポイントを中心に回転します。

Action

アクション(Action)は、オブジェクトが実行する内容を表します。例えば、次のように使います。

Animation

スプライトアニメーションを作成して、実行することもできます。

Scheduler

スケジューラー(Scheduler)は、スケジュールの実行や停止を行います。スケージュールには、毎フレーム実行するものや秒数を指定するもの、秒数と繰り返し回数、遅延時間を指定するものが使えます。

EventManager

イベントマネージャ(Event Manger)は、ユーザのイベントに対応した処理を管理します。イベントには、タッチやキーボード、マウスによるものがあります。
イベント処理に重要なものには次のクラスがあります。
– EventListener・・・イベントを取り出して処理するためのクラス
– EventManager・・・ユーザイベントのリスナーを管理するクラス
– Event・・・イベントの内容

最初のシーンの作成

ビューのデザイン画面サイズの設定

ここでは、ゲーム画面を480×320のサイズで設定することにします。また、画面内にアスペクト比を変更することなくぴったり収めて、空いた部分は帯が入る設定にします。

メニューシーンの作成

  1. Visual StudioのプロジェクトエクスプローラーのParkourプロジェクトのClassesフォルダを右クリックして、「追加(D)」から「新しい項目(W)」を選択します。
    スクリーンショット 2014 08 18 17 07 13
  2. 開いたダイアログの一番下の、「場所(L)」の参照ボタンを押して、同じプロジェクトのClassesフォルダに変更します。
  3. 名前を「MenuScene.cpp」に変更します。
  4. 「追加(A)」ボタンで追加します。
  5. 同様にして、「MenuScene.h」ファイルも追加します。
  6. 「HelloWorldScene.h」の内容を「MenuScene.h」にコピーします。
  7. 「HELLOWORLD_SCENE」を「MENU_SCENE」にすべて置換します。
  8. クラス名を「MenuScene」にします。
  9. CREATE_FUNC()マクロの引数も「MenuScene」に変更します。
  10. 「HelloWorldScene.cpp」の内容を「MenuScene.cpp」にコピーします。
  11. 「HelloWorld」を「MenuScene」にすべて置換します。
  12. ヘッダファイルの指定を「MenuScene.h」に修正します。
  13. 「MenuScene.png」を「HelloWorld.png」に戻します。
  14. この状態で実行して、「Hello World」画面が表示されるのを確認します。
  15. 「helloBG.png」、「start_n.png」、「start_s.png」をResourcesフォルダに追加します。
  16. 「MenuScene.cpp」と「MenuScene.h」を書き換えます。

Resdirectory

Digiprove sealCopyright secured by Digiprove © 2014

Cocos2d-x v3 チュートリアル 2」への1件のフィードバック

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください