COCOS道場DX
ホームに戻る
スポンサーリンク

画像を移動させる


今回はゲーム作成などでは欠かせない画像の移動について紹介します。まずはじめに、cocos2d-xの座標系についてお話します。cocos2d-xでは下図のように左下が 原点(0,0)となっています。なのでxを加算すると右に動きyを加算すると上に動きます。いきなり複雑な動きを頭の中で座標に置き換えて想像することは無理なのでまず最初はこの2点だけを抑えておけば大丈夫です。


では早速動かし方についてですがcocos2d-xではオブジェクトを動かす仕組みとしてアニメーションというクラスが存在します。基本的に複雑な動きのものでも基本パターンの組み合わせで表現できます、今回はシンプルに右端まで移動が終わったら左端に戻るを繰り返すことで往復するアニメーションをやってみたいと思います。

//画面サイズの取得
    Size size = Director::getInstance()->getVisibleSize();

    //インスタンス生成
    auto image = Sprite::create("HelloWorld.png");

    //初期位置を設定
    image->setPosition(Vec2(0,size.height/2));

    //1.5秒で画面右端まで行くアニメーション
    auto right_move=MoveTo::create(1.5f,Vec2(size.width,size.height/2));
    
    //1.5秒で画面左端まで行くアニメーション
    auto left_move =MoveTo::create(1.5f,Vec2(0,size.height/2));

    //動かす順番を指定
    auto s=Sequence::create(right_move,left_move,NULL);

    //アニメーションを繰り返し指定で実行(繰り返さない場合はrunAction(s);)
    image->runAction(RepeatForever::create(s));

    //貼り付け
    this->addChild(image);

実行結果:

アニメーションを使うことで画像はもちろん文字の移動などもできます、移動に関するアニメーションで代表的なものが今回使用したMoveToですが他にも同じようなものにMoveByというものがあります、しかしこれらは動作は同じで移動座標を相対的に見るか絶対的に見るかの違いです。アニメーションクラスには他にも回転、スケール変化、フェードイン、フェードアウトなどもあり多様な表現が身につきますので是非色々試してみることをお勧めします。

スポンサーリンク
このエントリーをはてなブックマークに追加
前の章へ ホームに戻る 次の章へ