はじめまして、エンジニアブログを記事を担当させて頂きます、新卒の加藤です。
今回はCocos2dxでテキストボックスとして使える「CCEditBox」の、キーボードの紹介をしていきたいと思います。
日本語入力にも対応しているこのCCEditBoxですが、例えばパスワードを入力させるシーンや、招待コードの入力など、日本語がボックス内に打ち込めてしまうと逆に困ること、あると思います。
ユーザーに文字を入力させた後、テキスト内に入力されたものが日本語なのか、そうじゃないのかの判定処理を記述して、不適切な文字があればエラー処理を走らせるように作る…のもいいのですが、それはちょっと面倒…。
なによりそもそも想定外の文字を打ち込めてしまう作りはセーフティではありません。
そんなときに便利なのが、「setInputMode」メソッドです。
以下のようにEditBox生成部分にコードを追加すると、入力に使うキーボードタイプを指定することができます。
m_pEditTest = cocos2d::extension::CCEditBox::create(CCSizeMake(350, 40), cocos2d::extension::CCScale9Sprite::create(("Background_TestEdit.png")));
m_pEditTest->setFontColor(ccBLACK);
m_pEditTest->setPlaceholderFontColor(ccWHITE);
m_pEditTest->setPlaceHolder("テキスト入力欄");
m_pEditTest->setMaxLength(8);
//キーボードの入力タイプを設定
m_pEditTest->setInputMode(cocos2d::extension::※ここにパラメータ);
m_pEditTest->setReturnType(cocos2d::extension::kKeyboardReturnTypeDone);
m_pEditTest->setDelegate(this);
m_pEditTest->setPosition(ccp(getContentSize().width / 2, getContentSize().height / 2));
this->addChild(m_pEditTest, 2);
「setInputMode」には以下のようなパラメータが設定できます。
■kEditBoxInputModeAny
日本語を含む、あらゆるテキストの入力を許容し、改行も可能です。
※setInputModeを記述していない場合、デフォルトとしてこのパラメータが設定されます。
■kEditBoxInputModeSingleLine
日本語を含む、あらゆるテキストの入力を許容する点は「kEditBoxInputModeAny」と同じですが、改行はできません。
■kEditBoxInputModeEmailAddr
半角英数のみが入力可能で、記号の表示もE-MAILの入力を想定し、「kEditBoxInputModeAny」とは微妙に異なったものになっています。
■kEditBoxInputModeNumeric
キー配置はkEditBoxInputModeAnyと同一のものですが、テキストボックスをタップしたとき、最初に表示されるキー配置が数字になります。
■kEditBoxInputModePhoneNumber
電話をかける時に使用するキーボードと同じ物が表示されます。
なお、「pause」は「,」「wait」は「;」となります。
■kEditBoxInputModeDecimal
パラメータ名の通り、URLの入力に特化したキーボード。
どのキーボードに切り替えても使用頻度の高い「.」「/」「.com」が常に表示されています。
■kEditBoxInputModeDecimal
ご覧の通り、数字と「.」のみが入力可能で、英数/数字の切り替えはありません。
このメソッドが使えるシーンとして、先ほど挙げた例のようにパスワード入力をさせる場合、「kEditBoxInputModeDecimal」を指定すれば、ユーザーは数字しか打ち込めなくなります。
また、シーンにあったキーボードを設定することで入力が楽になり、ユーザーライクなアプリに近づきます。
これらを活用してより良いCCEditBoxライフを！