【cocos2d-x 3.x】Action을 조합해, 페라펠러인 Sprite를 표현한다

cocos2d-x의 Action을 조합하는 것만으로, Sprite를 펠라페라풍으로 보여줍니다.



회전 표현



[포인트 A]
1. 좌우에서 붕괴(X축의 앵커 포인트를 중앙으로 한 상태에서 Scall을 0까지 작게 한다)
2. 그림을 반대로 한다
3. 좌우로 부풀린다(1과 반대의 일을 한다)

1~3을 차례로 하는 것으로, 빙글빙글 회전한 것처럼 보입니다.

Character.cpp
#define ANIM_TIME_TURN 0.4f
#define ANIM_TIME_JUMP 0.6f

//左右指定された方に方向転換する CHARA_DIRE_LEFT or CHARA_DIRE_RIGHT
void Character::turn(bool dir)
{
    //既にその方向を向いていたら何もしない
    if(dir == mDir)return;

    //ターン中やジャンプ中だったら何もしない
    if(kCharacterStateTurn == mCharaState || kCharacterStateJump == mCharaState)return;

    //回転中状態にする
    mCharaState = kCharacterStateTurn;

    //左向きになっていたら右向き(デフォルト)にする
    if(this->isFlippedX()){
        mDir = CHARA_DIRE_RIGHT;

    //右向きになっていたら左向き
    }else{
        mDir = CHARA_DIRE_LEFT;
    }

    //元々のスケールXを保存
    float defaultScaleX = this->getScaleX();
    //潰す
    auto scaleSmallAct = ScaleTo::create(ANIM_TIME_TURN/2, 0, this->getScaleY());
    //絵を逆にする
    auto callfuncTurnPng = CallFuncN::create([=](Node* sender) {
        this->setFlippedX(mDir);
    });
    //膨らませる(元のスケールに戻す)
    auto scaleBigAct = ScaleTo::create(ANIM_TIME_TURN/2,defaultScaleX,this->getScaleY());
    //状態を戻す
    auto callfuncSetState = CallFuncN::create([=](Node* sender) {
        mCharaState = kCharacterStateNone;
    });

    //[ポイントA]:
    auto seq = Sequence::create(scaleSmallAct, callfuncTurnPng, scaleBigAct,callfuncSetState, NULL);
    this->runAction(seq);
}


점프 표현



[포인트 B]
1. 위에서 깨기(Y축의 앵커 포인트를 아래로 한 상태에서 Scall을 수% 작게 한다)
2. 1의 상태로 몇 초 기다려, 모아를 표현
3. 점프&Scale을 되돌린다

1~3을 차례로 하는 일로, 종이가 굉장히 위에서 구부러져, 그대로 뛰어오른 느낌이 됩니다.

Character.cpp
void Character::jump(int distance)
{
    //ターン中やジャンプ中だったら何もしない
    if(kCharacterStateTurn == mCharaState || kCharacterStateJump == mCharaState)return;

    //ジャンプ状態にする
    mCharaState = kCharacterStateJump;

    //左向きの場合は左にジャンプする様に距離をマイナスに
    int l_dis = distance;
    if(mDir == CHARA_DIRE_LEFT)l_dis = -distance;
    //デフォルトのスケールYを保存
    float defaultScaleY = this->getScaleY();

    //上部をぐにゅっと少し潰す
    auto scaleSmallAct = ScaleTo::create(ANIM_TIME_JUMP * 0.2f, this->getScaleX(),defaultScaleY * 0.5f );

    //溜めを作る
    auto delayAct = DelayTime::create(ANIM_TIME_JUMP * 0.2f);

    //潰していたのを戻す
    auto scaleBigAct = ScaleTo::create(ANIM_TIME_JUMP * 0.1f, this->getScaleX(), defaultScaleY);
    //ジャンプ
    auto jumpAct = JumpBy::create(ANIM_TIME_JUMP * 0.5f, Vec2(l_dis, 0), distance * 1.2f, 1);
    //大きさ戻すのとジャンプは同時
    auto spawn = Spawn::create(scaleBigAct, jumpAct, NULL);

    //状態を戻す
    auto callfuncSetState = CallFuncN::create([=](Node* sender) {
        mCharaState = kCharacterStateNone;
    });

    //[ポイントB]:
    auto seq = Sequence::create(scaleSmallAct, delayAct, spawn, callfuncSetState, NULL);
    this->runAction(seq);
}

기타



캐릭터 주위에 하얀 테두리를 붙이면 종이의 느낌이 늘어나고, 펠라페라감이 더 나오는 느낌이 듭니다.

좋은 웹페이지 즐겨찾기