シヴァのブログ

UnityやUE4や趣味とかいろいろ...

Cocos2d-xで文章を1文字ずつ表示してみた

Cocos2d-xで、
「getLetter()メソッド」を使用して、文章を1文字ずつ表示する方法をメモ。



※背景を黒色とする。
また、表示した文字を消す細かい処理などは書いていません。

//=========================================================================
//テキスト文
//=========================================================================
std::string gText[3] = {
    "ここはチュートリアルです。",
    "私たちが、簡単に操作方法とか教えちゃいます!",
    "どうです?聞いていきますか?",
};
    //=========================================================================
    //  ラベルの設定
    //=========================================================================
    Label* labelText = Label::createWithTTF(gText[textTouchCounter], FONT_FILE_UZURA, 18);
    labelText->setPosition(WINDOW_RIGHT * 0.5f, WINDOW_TOP * 0.2f);
    labelText->setColor(Color3B::WHITE);//文字色を白に設定
    labelText->setOpacity( 0 );//透明化
    this->addChild(labelText);

    //=========================================================================
    //	テキストを1文字ずつ表示
    //=========================================================================
    int textLength = labelText->getStringLength();//表示文字の長さ取得
    for (int i = 0; i < textLength; i++) {
        
        Sprite *sp = labelText->getLetter(i);//i番目の文字をスプライトに変換
        
        if (sp) {
            //アニメーション開始
            sp->runAction(Sequence::create(
                DelayTime::create(0.05f * i), //1文字0.05秒
                CallFunc::create([sp, i, textLength](){
                    sp->setOpacity( 255 );
                    SimpleAudioEngine::getInstance()->playEffect(SOUND_FILE_TEXT_SE); //文字表示の音
                }),
                NULL
            ));
        }
    }


参考サイト:
①:RPG風に文字を1文字ずつ表示 cocos2dx ver3.2 - Qiita
②:cocos2d-xで文字送り 今日も林檎の木を植える
③:【cocos2d-x v3】RPG風に文字を1文字ずつ表示 (「・ω・)「ガオー|杏z 学習帳


①②:プログラムの処理の流れが自分のプログラムとほぼ同じ。
③:「getLetter」がどういう動きをしているかがわかりやすく書かれている。