名前入力システム

名前入力システム(ーなまえ)はWWA Wingに組み込みできるWWAギミックの1つです。

こんな感じに動きます

謎めいた機械を追い求めて 闇組織の争奪で試すことができます。

導入方法

「謎めいた機械を追い求めて 闇組織の争奪」では文字テーブルの枠や入力欄に専用の画像を使用していますが、今回の解説では導入手順を簡略化するため省略します。パーツの配置を工夫したり、ピクチャ機能を活用したりして、色々カスタマイズしてみてください。

必要なもの

• 不安定版のWWA Wing(v4.1.0-unstable.based-on.3.12.15.p1 以降)
• WWA Scriptのユーザー定義関数ファイルを取り扱えるスキル
• WWAイメージ画像を組み合わせて編集できるスキル

WWA Scriptファイルの取得

名前入力システムのWWA Scriptページより、WWA Scriptのコードをコピーします。

取り入れたいWWAのフォルダーを開き、scriptフォルダーに先ほど新規ファイルを作成します。そしてその中身にコピーしたコードをそのまま貼り付けます。

同じフォルダーにあるscript_file_list.jsonに"./script/nameinput.js"と追加します。追加後の中身は以下のようになると思います。

[
  "./script/index.js",
  "./script/defined.js",
  "./script/lib.js",
  "./script/nameinput.js"
]

data-wwa-user-defined-scripts-fileを定義している場合はその定義を指している JSON ファイルを編集してください。JSONのルール上、最後の行末には,(カンマ)は含めないでください。

イメージ画像の用意

イメージ画像ファイルを編集します。以下のイメージ画像をあらかじめ用意してください。

• 左矢印
• 右矢印
• 文字入力モードを変更するアイコン
• ボタンを押下するアイコン
• 1文字消すアイコン
• 完了アイコン
• キャレットアイコン

アイテムパーツの追加

マップデータファイルを編集します。マップデータでそれぞれ以下の物体パーツを作成してください。

キャレットを前に戻すアイテム

• イメージ画像は「左矢印」
• 「アイテム」「使用してもなくならない」

<script>
nameInputMoveCaretBack();

キャレットを後ろに進むアイテム

• イメージ画像は「右矢印」
• 「アイテム」「使用してもなくならない」

<script>
nameInputMoveCaretForward();

文字入力モードを変更するアイテム

• イメージ画像は「文字入力モードを変更するアイコン」
• 「アイテム」「使用してもなくならない」

<script>
nameInputChangeMode();

文字入力をするアイテム

• イメージ画像は「ボタンを押下するアイコン」
• 「アイテム」「使用してもなくならない」

<script>
nameInputInsertChar();

1文字消すアイテム

• イメージ画像は「1文字消すアイコン」
• 「アイテム」「使用してもなくならない」

<script>
nameInputDeleteChar();

文字入力を完了するアイテム

• イメージ画像は「完了アイコン」
• 「アイテム」「使用してもなくならない」

<script>
nameInputApply();

名前入力でおすすめの名前を選出するメッセージパーツ

• イメージ画像は透明。
• 「メッセージ」

<script>
nameInputSetRecommend();

名前入力でおすすめの名前を選出する二者択一パーツ

• イメージ画像は透明。
• 「二者択一」「YESを選択したとき」には、前の「名前入力でおすすめの名前を選出するメッセージパーツ」の番号を記載する。

おすすめの名前を自動で入力します。
よろしいですか？

名前入力を完了するメッセージパーツ

• イメージ画像は透明。
• 「メッセージ」

<script>
nameInputFinish();

名前入力を終わらせる二者択一パーツ

• イメージ画像は透明。
• 「二者択一」「YESを選択したとき」には、前の「名前入力を完了するメッセージパーツ」の番号を記載する。

この名前でよろしいですか？

名前入力領域の確保

キャラクターの部分は無くてもいいけど、あるといい演出になる

パーツが用意できたら次に名前入力の空間を確保します。縦1画面、横2画面の領域を見つけて、その一番左上の座標をメモしてください。

そしてその左上の座標から下4マス、右1マス進んだところに道パーツを隣の画面端まで、縦5マス分敷き詰めます。その上の空間も、入力した名前を表示するために右図のように5マス分設けます。

設定

「WWA Scriptファイルの取得」で保存したnameinput.jsを編集します。

nameInputInitの実装の中で、コメントの記載した変数をそれぞれ記入します。

// 名前入力をする画面の一番左上の座標
v["nameinput_map_x"] = 60;
v["nameinput_map_y"] = 0;
// 入力できる文字数上限
v["nameinput_max"] = 5;
// おすすめの名前を選出する二者択一パーツの番号
v["nameinput_show_recommend_parts"] = 12;
// 名前入力を完了するかたずねる二者択一パーツの番号
v["nameinput_finish_parts"] = 17;
// キャレットのイメージ座標
v["nameinput_caret_img_x"] = 6;
v["nameinput_caret_img_y"] = 25;
// キャレットを前に戻るアイテムの番号
ITEM[7] = 9;
// キャレットを後に進むアイテムの番号
ITEM[8] = 10;
// 入力文字を変更するアイテムの番号
ITEM[9] = 11;
// 入力操作アイテムの番号
ITEM[10] = 6;
// 取消操作アイテムの番号
ITEM[11] = 7;
// 決定操作アイテムの番号
ITEM[12] = 8;

最後に、以下のユーザー定義関数を追加します。すでに同じユーザー定義関数がある場合は、関数の中身だけ取ってきて追加してください。

function CALL_CAMERA_MOVE() {
    if (
        CX >= v["nameinput_map_x"] && CX <= v["nameinput_map_x"] + 10 &&
        CY == v["nameinput_map_y"]
    ) {
        nameInputDrawChars();
    }
}

これで名前入力システムの完了です！

任意のパーツで以下の構文を実行すると、名前入力システムが起動します！

<script>
nameInputInit();

注意事項

既存の7番～12番のアイテムはシステムのアイテムに上書きされてしまいます。既存のWWAに取り入れる場合は、あらかじめダミーのアイテムを確保させておくか、起動時に手持ちのアイテムを一度別の場所に退避させるか、などの対策が必要です。