■初心者が、メニュー画面を自作しようとする過程の記録その１。
今回は、以下のようなメニュー画面を表示して
上下キー操作で、カーソルが動くところまで作ってみました。
この画面は、３つのピクチャーの表示で作られています。
一つ目は、茶色のウィンドウベース。
（素材は、A. （ア・ドット） 様）
二つ目は、アイテム～相談までの文字をピクチャー化したもの。
三つめは、選択カーソルの赤い色の画像。
また、以下の２サイトの講座と、コモン４４を参考にしながら作ってます。
YADOT 様
【Wolf RPG エディター】 ウディタ技術解説Wiki 様
ちょっと長いですが、今回書いたソースとその意味を合わせて以下に書きます。
無駄がけっこう多いと思いますが
自分で理解できる範囲でソースを作ることを目標に書いてみました。
※ピンク部分はブログ説明用に加筆しております。
なお、このメニューコモンは、コモン４４とは別に
イベントから呼び出しでテストしているので、そのまま流用すると不具合があるかもしれません。
①３種類のピクチャーを表示している部分
ピクチャーの番号は、一つ一つ違う番号にする必要があります。
ピクチャー表示の行にある「X:2 Y:2」で、そのピクチャーの表示位置を設定しております。
▼ ●メニュー欄Ａの設定
▼ ピクチャー1はカーソル用
▼ ピクチャ0はメニュー欄Ａの枠
▼ ピクチャー２はメニュー欄Ａの項目名
■ピクチャ表示：0 [左上]ウィンドウ「SystemGraphic/WindowBase.png」サイズ[65,120] X:2 Y:2 0(0)フレーム
■ピクチャ表示：2 [左上]文字列[ アイテムn 特殊能] X:5 Y:7 0(0)フレーム
メニューを文字ピクチャーとして打っていますが、ソース上に内容が表示しきれていないようです
■変数操作: このコモンEvセルフ2 = 6 + 0 コモンセルフ２を、カーソルのＹ座標に利用
■ピクチャ表示：1 [左上]ウィンドウ「SystemGraphic/CursorBase.png」サイズ[55,14] X:7 Y:このコモンEvセルフ2 0(0)フレーム
■変数操作: V9-39[メニュカーソル位置] = 1 + 0
変数V9-39を、カーソルを表示する位置の判断用に利用
一番上の位置を、１として考え、初期位置１から動かします。
②キー入力に対し、カーソルをどの方向に動かすか決めている部分
▼ カーソル移動処理
●ラベル地点「カーソル選択」 ラベルを設置
■キー入力：このコモンEvセルフ変数1 / [入力待ち] 4方向 決定(10) キャンセル(11)このソースでは、キー入力は、セルフ１に格納しました。
■条件分岐(変数): 【1】このコモンEvセルフ1が2と同じ 【2】このコモンEvセルフ1が8と同じ 【3】このコモンEvセルフ1が11と同じ
コモン１に格納したキー入力により条件分岐。今回は、上下方向に動くカーソルを作っているので、↓↑キーで入力されてる数字２と８で条件分岐
◇分岐： 【1】 [ このコモンEvセルフ1が2と同じ ]の場合↓ つまり、↓キーを押されたとき
｜■サウンド：SE 変数[Sys18:選択肢SE番号：選択(Sys3)] 再生 / 遅延：0フレーム カーソル選択音をならす
｜■条件分岐(変数): 【1】V9-39[メニュカーソル位置]が5と同じ 【2】V9-39[メニュカーソル位置]が5以外
｜ ◇分岐： 【1】 [ V9-39[メニュカーソル位置]が5と同じ ]の場合↓
｜｜■変数操作: V9-39[メニュカーソル位置] = 1 + 0
｜｜■
※今回のメニュー欄は５項目です。五番目の位置にカーソルがあるとき、
↓キーを押されたら、一番上の項目に戻るように変数に１を代入するよう、条件分岐で行ってます。
｜ ◇分岐： 【2】 [ V9-39[メニュカーソル位置]が5以外 ]の場合↓
｜｜■変数操作: V9-39[メニュカーソル位置] += 1 + 0
｜｜■
｜◇分岐終了◇◇
｜■
◇分岐： 【2】 [ このコモンEvセルフ1が8と同じ ]の場合↓ つまり、↑キーを押されたとき
｜■サウンド：SE 変数[Sys18:選択肢SE番号：選択(Sys3)] 再生 / 遅延：0フレーム
｜■条件分岐(変数): 【1】V9-39[メニュカーソル位置]が1と同じ 【2】V9-39[メニュカーソル位置]が1以外
｜ ◇分岐： 【1】 [ V9-39[メニュカーソル位置]が1と同じ ]の場合↓
｜｜■変数操作: V9-39[メニュカーソル位置] = 5 + 0
｜｜■
｜ ◇分岐： 【2】 [ V9-39[メニュカーソル位置]が1以外 ]の場合↓
｜｜■変数操作: V9-39[メニュカーソル位置] -= 1 + 0
｜｜■
｜◇分岐終了◇◇
｜■
◇分岐： 【3】 [ このコモンEvセルフ1が11と同じ ]の場合↓ つまりキャンセルキーを押したとき
｜■サウンド：SE ファイル[SE/Cancel.wav] 音 0％ 周 0％ 再生 / 遅延：0フレーム
｜●ラベル「終了」に飛ぶ
｜■
◇分岐終了◇◇
③実際に、カーソルの表示位置を決める部分
■条件分岐(変数): 【1】V9-39[メニュカーソル位置]が1と同じ
カーソルが１番上に来た時の表示
◇分岐： 【1】 [ V9-39[メニュカーソル位置]が1と同じ ]の場合↓
｜■変数操作: このコモンEvセルフ2 = 6 + 0
｜■ピクチャ表示：1 [左上]ウィンドウ「SystemGraphic/CursorBase.png」サイズ[55,13] X:7 Y:このコモンEvセルフ2 0(0)フレーム
ｙ座標を表すコモンセルフ２の変数を変更してから、再度ピクチャー表示処理をすることによって、カーソルが見掛け上動くようです。
｜■
◇分岐終了◇◇
■条件分岐(変数): 【1】V9-39[メニュカーソル位置]が2と同じ
◇分岐： 【1】 [ V9-39[メニュカーソル位置]が2と同じ ]の場合↓
｜■変数操作: このコモンEvセルフ2 = 15 + 6
二番目は、一番上の項目に対し、15ピクセル（？）低い位置にカーソルを設定してみました。
｜■ピクチャ表示：1 [左上]ウィンドウ「SystemGraphic/CursorBase.png」サイズ[55,13] X:7 Y:このコモンEvセルフ2 0(0)フレーム
｜■
◇分岐終了◇◇
■条件分岐(変数): 【1】V9-39[メニュカーソル位置]が3と同じ
◇分岐： 【1】 [ V9-39[メニュカーソル位置]が3と同じ ]の場合↓
｜■変数操作: このコモンEvセルフ2 = 30 + 6
｜■ピクチャ表示：1 [左上]ウィンドウ「SystemGraphic/CursorBase.png」サイズ[55,13] X:7 Y:このコモンEvセルフ2 0(0)フレーム
｜■
◇分岐終了◇◇
■条件分岐(変数): 【1】V9-39[メニュカーソル位置]が4と同じ
◇分岐： 【1】 [ V9-39[メニュカーソル位置]が4と同じ ]の場合↓
｜■変数操作: このコモンEvセルフ2 = 45 + 6
｜■ピクチャ表示：1 [左上]ウィンドウ「SystemGraphic/CursorBase.png」サイズ[55,13] X:7 Y:このコモンEvセルフ2 0(0)フレーム
｜■
◇分岐終了◇◇
■条件分岐(変数): 【1】V9-39[メニュカーソル位置]が5と同じ
◇分岐： 【1】 [ V9-39[メニュカーソル位置]が5と同じ ]の場合↓
｜■変数操作: このコモンEvセルフ2 = 60 + 6
｜■ピクチャ表示：1 [左上]ウィンドウ「SystemGraphic/CursorBase.png」サイズ[55,13] X:7 Y:このコモンEvセルフ2 0(0)フレーム
｜■
◇分岐終了◇◇
●ラベル「カーソル選択」に飛ぶ
ラベル「カーソル選択」から同じ処理を繰り返すために戻す
●ラベル地点「終了」
■ピクチャ消去：1 0(0)フレーム
■ピクチャ消去：2 0(0)フレーム
■ピクチャ消去：0 0(0)フレーム
■変数操作: このコモンEvセルフ2 = 0 + 0
■変数操作: このコモンEvセルフ1 = 0 + 0
■
キャンセルキーを押された場合、このラベルまで飛びます。
ピクチャーをすべて消去。
念のため、セルフ変数もすべて〇に戻しています。
「メニュー自作への挑戦２」へ
←目次に戻る
今回は、以下のようなメニュー画面を表示して
上下キー操作で、カーソルが動くところまで作ってみました。
この画面は、３つのピクチャーの表示で作られています。
一つ目は、茶色のウィンドウベース。
（素材は、A. （ア・ドット） 様）
二つ目は、アイテム～相談までの文字をピクチャー化したもの。
三つめは、選択カーソルの赤い色の画像。
また、以下の２サイトの講座と、コモン４４を参考にしながら作ってます。
YADOT 様
【Wolf RPG エディター】 ウディタ技術解説Wiki 様
ちょっと長いですが、今回書いたソースとその意味を合わせて以下に書きます。
無駄がけっこう多いと思いますが
自分で理解できる範囲でソースを作ることを目標に書いてみました。
※ピンク部分はブログ説明用に加筆しております。
なお、このメニューコモンは、コモン４４とは別に
イベントから呼び出しでテストしているので、そのまま流用すると不具合があるかもしれません。
①３種類のピクチャーを表示している部分
ピクチャーの番号は、一つ一つ違う番号にする必要があります。
ピクチャー表示の行にある「X:2 Y:2」で、そのピクチャーの表示位置を設定しております。
▼ ●メニュー欄Ａの設定
▼ ピクチャー1はカーソル用
▼ ピクチャ0はメニュー欄Ａの枠
▼ ピクチャー２はメニュー欄Ａの項目名
■ピクチャ表示：0 [左上]ウィンドウ「SystemGraphic/WindowBase.png」サイズ[65,120] X:2 Y:2 0(0)フレーム
■ピクチャ表示：2 [左上]文字列[ アイテムn 特殊能] X:5 Y:7 0(0)フレーム
メニューを文字ピクチャーとして打っていますが、ソース上に内容が表示しきれていないようです
■変数操作: このコモンEvセルフ2 = 6 + 0 コモンセルフ２を、カーソルのＹ座標に利用
■ピクチャ表示：1 [左上]ウィンドウ「SystemGraphic/CursorBase.png」サイズ[55,14] X:7 Y:このコモンEvセルフ2 0(0)フレーム
■変数操作: V9-39[メニュカーソル位置] = 1 + 0
変数V9-39を、カーソルを表示する位置の判断用に利用
一番上の位置を、１として考え、初期位置１から動かします。
②キー入力に対し、カーソルをどの方向に動かすか決めている部分
▼ カーソル移動処理
●ラベル地点「カーソル選択」 ラベルを設置
■キー入力：このコモンEvセルフ変数1 / [入力待ち] 4方向 決定(10) キャンセル(11)このソースでは、キー入力は、セルフ１に格納しました。
■条件分岐(変数): 【1】このコモンEvセルフ1が2と同じ 【2】このコモンEvセルフ1が8と同じ 【3】このコモンEvセルフ1が11と同じ
コモン１に格納したキー入力により条件分岐。今回は、上下方向に動くカーソルを作っているので、↓↑キーで入力されてる数字２と８で条件分岐
◇分岐： 【1】 [ このコモンEvセルフ1が2と同じ ]の場合↓ つまり、↓キーを押されたとき
｜■サウンド：SE 変数[Sys18:選択肢SE番号：選択(Sys3)] 再生 / 遅延：0フレーム カーソル選択音をならす
｜■条件分岐(変数): 【1】V9-39[メニュカーソル位置]が5と同じ 【2】V9-39[メニュカーソル位置]が5以外
｜ ◇分岐： 【1】 [ V9-39[メニュカーソル位置]が5と同じ ]の場合↓
｜｜■変数操作: V9-39[メニュカーソル位置] = 1 + 0
｜｜■
※今回のメニュー欄は５項目です。五番目の位置にカーソルがあるとき、
↓キーを押されたら、一番上の項目に戻るように変数に１を代入するよう、条件分岐で行ってます。
｜ ◇分岐： 【2】 [ V9-39[メニュカーソル位置]が5以外 ]の場合↓
｜｜■変数操作: V9-39[メニュカーソル位置] += 1 + 0
｜｜■
｜◇分岐終了◇◇
｜■
◇分岐： 【2】 [ このコモンEvセルフ1が8と同じ ]の場合↓ つまり、↑キーを押されたとき
｜■サウンド：SE 変数[Sys18:選択肢SE番号：選択(Sys3)] 再生 / 遅延：0フレーム
｜■条件分岐(変数): 【1】V9-39[メニュカーソル位置]が1と同じ 【2】V9-39[メニュカーソル位置]が1以外
｜ ◇分岐： 【1】 [ V9-39[メニュカーソル位置]が1と同じ ]の場合↓
｜｜■変数操作: V9-39[メニュカーソル位置] = 5 + 0
｜｜■
｜ ◇分岐： 【2】 [ V9-39[メニュカーソル位置]が1以外 ]の場合↓
｜｜■変数操作: V9-39[メニュカーソル位置] -= 1 + 0
｜｜■
｜◇分岐終了◇◇
｜■
◇分岐： 【3】 [ このコモンEvセルフ1が11と同じ ]の場合↓ つまりキャンセルキーを押したとき
｜■サウンド：SE ファイル[SE/Cancel.wav] 音 0％ 周 0％ 再生 / 遅延：0フレーム
｜●ラベル「終了」に飛ぶ
｜■
◇分岐終了◇◇
③実際に、カーソルの表示位置を決める部分
■条件分岐(変数): 【1】V9-39[メニュカーソル位置]が1と同じ
カーソルが１番上に来た時の表示
◇分岐： 【1】 [ V9-39[メニュカーソル位置]が1と同じ ]の場合↓
｜■変数操作: このコモンEvセルフ2 = 6 + 0
｜■ピクチャ表示：1 [左上]ウィンドウ「SystemGraphic/CursorBase.png」サイズ[55,13] X:7 Y:このコモンEvセルフ2 0(0)フレーム
ｙ座標を表すコモンセルフ２の変数を変更してから、再度ピクチャー表示処理をすることによって、カーソルが見掛け上動くようです。
｜■
◇分岐終了◇◇
■条件分岐(変数): 【1】V9-39[メニュカーソル位置]が2と同じ
◇分岐： 【1】 [ V9-39[メニュカーソル位置]が2と同じ ]の場合↓
｜■変数操作: このコモンEvセルフ2 = 15 + 6
二番目は、一番上の項目に対し、15ピクセル（？）低い位置にカーソルを設定してみました。
｜■ピクチャ表示：1 [左上]ウィンドウ「SystemGraphic/CursorBase.png」サイズ[55,13] X:7 Y:このコモンEvセルフ2 0(0)フレーム
｜■
◇分岐終了◇◇
■条件分岐(変数): 【1】V9-39[メニュカーソル位置]が3と同じ
◇分岐： 【1】 [ V9-39[メニュカーソル位置]が3と同じ ]の場合↓
｜■変数操作: このコモンEvセルフ2 = 30 + 6
｜■ピクチャ表示：1 [左上]ウィンドウ「SystemGraphic/CursorBase.png」サイズ[55,13] X:7 Y:このコモンEvセルフ2 0(0)フレーム
｜■
◇分岐終了◇◇
■条件分岐(変数): 【1】V9-39[メニュカーソル位置]が4と同じ
◇分岐： 【1】 [ V9-39[メニュカーソル位置]が4と同じ ]の場合↓
｜■変数操作: このコモンEvセルフ2 = 45 + 6
｜■ピクチャ表示：1 [左上]ウィンドウ「SystemGraphic/CursorBase.png」サイズ[55,13] X:7 Y:このコモンEvセルフ2 0(0)フレーム
｜■
◇分岐終了◇◇
■条件分岐(変数): 【1】V9-39[メニュカーソル位置]が5と同じ
◇分岐： 【1】 [ V9-39[メニュカーソル位置]が5と同じ ]の場合↓
｜■変数操作: このコモンEvセルフ2 = 60 + 6
｜■ピクチャ表示：1 [左上]ウィンドウ「SystemGraphic/CursorBase.png」サイズ[55,13] X:7 Y:このコモンEvセルフ2 0(0)フレーム
｜■
◇分岐終了◇◇
●ラベル「カーソル選択」に飛ぶ
ラベル「カーソル選択」から同じ処理を繰り返すために戻す
●ラベル地点「終了」
■ピクチャ消去：1 0(0)フレーム
■ピクチャ消去：2 0(0)フレーム
■ピクチャ消去：0 0(0)フレーム
■変数操作: このコモンEvセルフ2 = 0 + 0
■変数操作: このコモンEvセルフ1 = 0 + 0
■
キャンセルキーを押された場合、このラベルまで飛びます。
ピクチャーをすべて消去。
念のため、セルフ変数もすべて〇に戻しています。
「メニュー自作への挑戦２」へ
←目次に戻る
