読者です 読者をやめる 読者になる 読者になる

Flap◯ Birdを作ってみる。その1

会社から上記ゲームをつくってみなさいというお題が出されたのでcocos2d-xで挑戦中。Unityはなんか自分の感覚に合わなかったので...

まずはインストール

  1. cocos2d-x 自体のインストール
  2. http://www.cocos2d-x.org/download からダウンロード
  3. Androidのダウンロード https://developer.android.com/sdk/index.html からAndriod SDKと NDKをダウンロードする
  4. ant install(brew install ant)
  5. setup.pyを実行する。パスを聞かれるので適宜入力する

お約束のHelloWorld

cocos new -p com.hachiae.cocos.helloword -l cpp HelloWorld
cocos run -p ios

Andriodいれたものの案の定、エミュレータの起動が遅すぎるので一旦iOSで動作確認。

とりあえずここまではできた。

インストール時にチュートリアル的なものがあるのかなーと探してたけど探しきれなかったので、ゲーム作りながら必要な物を調べていく方針に変更。
となると、タスクを洗い出そうということで、洗い出しました。

  • #1: タップすると鳥を浮き上がらせる
  • #2: 障害物の当たり判定と通過判定を行う
  • #3: ゲームオーバー時に得点を表示する
  • #4: 背景をスクロールして動いている感じに見せる
  • #7: 土管画像を表示する
  • #5: ステージを無限に見せる
  • #6: 背景画像を表示する

背景画像の表示

cocosコマンドを実行して作成されたHelloWorldScene.cppに記載していく。
cocos2d-xのx,y座標の開始位置は左下から開始というところを念頭に置きつつ,positionで中央座標を設定。
大学時代にC++を勉強してたけどなんかだいぶ違うw

    Size visibleSize = Director::getInstance()->getVisibleSize(); // 画面解像度
    Vec2 origin = Director::getInstance()->getVisibleOrigin();      // 0座標
    auto backGround = Sprite::create("background.png");
    backGround->setPosition(Vec2(origin.x + visibleSize.width/2, origin.y + visibleSize.height/2));
    this->addChild(backGround, 0);

鳥の動いているアニメーションを表示

ShoeBoxを使って複数の画像(ここではbird000.png〜bird.002.png)を1つの画像にまとめた後にアニメーションの設定をおこなう。

    // 鳥のアニメーションの動き
    auto birdCache = SpriteFrameCache::getInstance();
    birdCache->addSpriteFramesWithFile("birds.plist");
    
    auto birdSprite= Sprite::create();
    birdSprite->setPosition(Vec2(origin.x + visibleSize.width/2, origin.y + visibleSize.height/2));
    this->addChild(birdSprite,1);
    
    auto birdAnimation = Animation::create();
    for (int i = 0; i < 3; i++) {
        auto str = __String::createWithFormat("bird00%d.png",i);
        SpriteFrame *sprite = birdCache->getSpriteFrameByName(str->getCString());
        birdAnimation->addSpriteFrame(sprite);
    }
    birdAnimation->setDelayPerUnit(0.25f);
    birdAnimation->setRestoreOriginalFrame(true); // 画像を元に戻す
    
    auto birdAnimate = Animate::create(birdAnimation);
    birdSprite->runAction(RepeatForever::create(birdAnimate)); // 繰り返す

色んなところから情報あつめて来て理解しながらやると、やっぱり開発速度遅くなるなー