ウディタで「オブジェクトに近づくと吹き出しが出る」を実装した記録

ゲ制コラム
※この記事にはアフィリエイトリンクが含まれています※

ATTENTION

この記事は
[CYAN PROJECT]今日、人魚を拐う事にした
制作記録でもあります。
よろしくね!

この記事にはコードやコモンが付いてきますが、自由に使ってくれて構いません。

まずは実装したものを御覧ください

特定の場所に近づくとテキストがポップアップするシステムです。

最近の任天堂…一番メインで考えているのはバナンザなのですがNPCや看板に近づくだけでテキストがでてくるんですよね。
クリックするのは手間が増える。

ヴォイスが無くてもゲームを賑やかに出来るところもGOOD⭕️

今回はこのシステムを実装した時の記録です。

考え

プログラムなんもわからん……

って人なので、こういうシステムを組む時の基本がわかっていません。
その上で10年以上作ってきたんで、経験則と又聞きで得た「こうしたら良いのでは?」と言う知恵があります。

その知恵はどんなものかと言うとだいたい以下の通り。

  • 「近づいたら文字が出る」という共通の内容なので出来るだけコモンで一箇所で管理したい
    • マップイベント1個1個に埋めていくとバグが発生しやすい(経験則)
    • 特に条件分岐はヤバい。
  • コモン1行呼び出しは素晴らしいけど、そこに入力が発生するとミスりやすい(経験則)
    • 後、ミスってた時の修正が「クリックして」「編集ウィンドウが出て」「小さい入力欄を弄る」になるのであまり良くない
    • (1個1個に作るよりは圧倒的にマシ)
  • 出来るだけ自動的に数字を取得して手入力を減らす
  • テキストはcsvで一括管理が良い(好みによるかも)
    • ウディタ備え付けのDBは非常に使いやすいのでそのまま使っても良い
    • 特にプルダウンとか作ったりね、数字とか入れたりね
    • 逆に文字だけなら入力欄が小さいので(一覧性とのトレードオフ)CSVで別ソフトでやったほうが良いかも

これに気がつくのに年数を要したのをどう評価するか……
車輪の再発明な気がするし、実感を得て良いとも言えるし、あと学問を修めて仕事にしたわけじゃないしなっても思うし。

マップイベント

  • 起動条件を「プレイヤーから接触」にする
    • イベント接触でも動くけれど、プレイヤーから接触の方が無駄な起動を行ってないようなので。デバッグウィンドウ便利だね。
  • 吹き出しが出て欲しいサイズに合わせて範囲を拡張する
  • コモンを呼び出す(設定する要素はなし)
  • (オプション)わかりやすいイベント名をつける。
    今回はいっぱい仕込むことも考え、この要素を行うためのマップイベントには全て【✕】をつけることに。

かなりわかりやすいと思うんですがどうでしょうか!
私的には綺麗にできてごきげんです。
記事にしちゃうくらいです。

キーボードで入力しないといけないのはマップイベント名くらいなので、マウスで適当にコピーしてだだだっと配置していけるのが最高に楽です。

接触範囲で範囲を決めるのも直感的でヨシ!

こんな感じです。

コモンイベントの紹介

呼び出しているコモンイベント

▼ 範囲内に居るかの確認
■イベントの挿入[名]: CSelf14[範囲内に居るかな?] = ["接触範囲にいるかな?"] <コモンEv 76> 
■条件分岐(数値):  【1】 CSelf14[範囲内に居るかな?]  が   1 と同じ  【2】 CSelf14[範囲内に居るかな?]  が   0 と同じ 
-◇分岐: 【1】  [ CSelf14[範囲内に居るかな?]  が  1 と同じ  ]の場合↓
 |▼ ■■■範囲内に居た!=表示!■■■
 |▼ ■表示するテキスト作り■
 |■変数操作+: CSelf10[マップ番号] = [マップ]現在のマップID
 |■変数操作+: CSelf11[イベント番号] = 呼出マップイベント の イベントID ※[一時消去]後もID返す
 |▼ DBから読み込む
 |■DB読込(可変): CSelf9[表示する文字列] = 可変DB[ "mapテキスト":CSelf10[マップ番号]:CSelf11[イベント番号] ] (6:-:-) 
 |▼  
 |■イベントの挿入[名]: ["★フキダシ会話文表示"] <コモンEv 5>  / -1:呼び出し元 / 0:表示 / V8-0[MAP文字サイズ] / 0 / CSelf9[表示する文字列]
 |■
-◇分岐: 【2】  [ CSelf14[範囲内に居るかな?]  が  0 と同じ  ]の場合↓
 |▼ ■■■範囲内に居ない!=消去!■■■
 |■イベントの挿入[名]: ["★フキダシ会話文表示"] <コモンEv 5>  / -1:呼び出し元 / -1:消去 / V8-0[MAP文字サイズ] / 50 / 
 |■
◇分岐終了◇

割と短い。
短いということは良いこと。

やってることは、

主人公がマップイベントの範囲にまだいるかどうかの判定コモンを呼ぶ

  • 居なかったら
    • (吹き出しコモンで)消す
  • 居たら
    • マップとイベントの番号を調べて表示するテキストを引き出す
    • (吹き出しコモンで)表示する

と言う内容です。

【接触範囲にいるかな?】 コモン

【ウディタ解説】近づくと起動して離れると停止するコモンを作る【自作】
レビニアです! 今回作るのは「近づくと起動して離れると停止するコモン」よ。マップイベントの接触範囲に入ったら処理が実行、接触範囲から出ると処理が停止するようなコモンを作るという事ね。近づくと起動するっていうのはウディタじゃ日常茶飯事な処理で

こちらのサイトさんの記事を丸々真似しています!!!!!!!

作りたい人は向こうの記事に飛ぶとむちゃくちゃ丁寧なので簡単に作れると思います!!

▼ ■■■変数計算■■■
■変数操作+: CSelf10[呼び出しx座標] = 呼出マップイベント の X座標(精密) *キャラ左側位置
■変数操作+: CSelf11[呼び出しy座標] = 呼出マップイベント の Y座標(精密) *キャラ足下-1位置
■変数操作+: CSelf12[範囲拡張x] = 呼出マップイベント の 接触範囲拡張X
■変数操作+: CSelf13[範囲拡張y] = 呼出マップイベント の 接触範囲拡張Y
■変数操作+: CSelf14[主人公x] = 主人公 の X座標(精密) *キャラ左側位置
■変数操作+: CSelf15[主人公y] = 主人公 の Y座標(精密) *キャラ足下-1位置
▼  
■変数操作: CSelf16[イベントとの距離x] 絶対値= CSelf14[主人公x] - CSelf10[呼び出しx座標] 
■変数操作: CSelf17[イベントとの距離y] 絶対値= CSelf15[主人公y] - CSelf11[呼び出しy座標] 
▼  
▼  
▼  
■デバッグ文:絶対値x \cself[16]\n絶対値y \cself[17]\n \n主人公x \cself[14]\nイベントx \cself[10]\n \n範囲x \cself[12]\n範囲y \cself[13]\n-------------------
▼ ■■■範囲外■■■
■条件分岐(数値):  【1】 CSelf16[イベントとの距離x]  が   CSelf12[範囲拡張x] 以上  【2】 CSelf17[イベントとの距離y]  が   CSelf13[範囲拡張y] 以上 
-◇分岐: 【1】  [ CSelf16[イベントとの距離x]  が  CSelf12[範囲拡張x] 以上  ]の場合↓
 |■変数操作: CSelf20[返り値/状態] = 0 + 0 
 |■イベント処理中断
 |■
-◇分岐: 【2】  [ CSelf17[イベントとの距離y]  が  CSelf13[範囲拡張y] 以上  ]の場合↓
 |■変数操作: CSelf20[返り値/状態] = 0 + 0 
 |■イベント処理中断
 |■
◇分岐終了◇
▼  
▼  
▼  
▼ ■■■返り値の調整■■■
▼ 範囲内だったら数字を数字をいじらないといけない
■条件分岐(数値):  【1】 CSelf20[返り値/状態]  が   0 と同じ  【2】 CSelf20[返り値/状態]  が   1 と同じ 
-◇分岐: 【1】  [ CSelf20[返り値/状態]  が  0 と同じ  ]の場合↓
 |▼ 新しく入った
 |■変数操作: CSelf20[返り値/状態] = 1 + 0 
 |■
-◇分岐: 【2】  [ CSelf20[返り値/状態]  が  1 と同じ  ]の場合↓
 |▼ 継続中
 |■変数操作: CSelf20[返り値/状態] = 2 + 0 
 |■
◇分岐終了◇

【フキダシ】コモン

吹き出し会話文表示コモン / ポルゼンヌ小林さん
https://silversecond.com//WolfRPGEditor/CommonList/html/tdv252.html#13914918103901

吹き出しは公式掲示板に投稿されているコモンをお借りしています。
ただし、魔改造済み。

使いたい内容に合わせて……というのもありますが、結構古いコモンなので今だともっとスムーズに計算できたり、出来ることが増えてたりと改変の余地が大きかったのもあります。

▼ ■■■重要設定項目■■■
▼ 基本となるピクチャ番号を指定してください。この値プラス1000だけピクチャ番号を使用します。
■変数操作: CSelf10[ピクチャ番号] = 2005 + 0 
▼ 決定キー入力の際に使用されるカーソルピクチャ画像を指定してください。
■文字列操作:CSelf7[カーソルピクチャ] = "BasicData/Text_Pause.png"
▼ カーソルピクチャの分割数とパターン合計を指定してください。
■変数操作: CSelf50[カーソル分割数横] = 1 + 0 
■変数操作: CSelf51[カーソル分割数縦] = 6 + 0 
■変数操作: CSelf52[パターン数合計] = 6 + 0 
▼  
▼ ■■■細部設定項目■■■
▼ 行間隔の設定です。増やせば行の間隔が広くなります。
■変数操作: CSelf25[行間] = 3 + 0 
▼ フキダシの上下左右の余白の大きさの設定です。
■変数操作: CSelf40[上下余白] = 10 + 0 
■変数操作: CSelf41[左右余白] = 20 + 0 
▼ 人物からフキダシまでの距離の調整です。増やせば吹き出しがより上に出現します。
■変数操作: CSelf42[表示位置調整] = 60 + 0 
▼ 自動消去の際、文字数が少ないときの最低表示フレームです。0文字でもこの長さだけ表示されます。
■変数操作: CSelf14[最低表示時間] = 40 + 0 
▼ 自動消去の際、消去にかかるフレームです。
■変数操作: CSelf97[消去にかかるフレーム] = 10 + 0 
▼ 透明度
■変数操作: CSelf99[透明度] = 170 + 0 
▼  
▼  
▼ -------------------------------------------------
▼  
▼  
▼ ■■■必須だから先に計算■■■
■変数操作: CSelf12[文字ピクチャ番号] = CSelf10[ピクチャ番号] + 0 
■変数操作: CSelf13[四角ピクチャ番号] = CSelf10[ピクチャ番号] + -3 
■変数操作: CSelf16[ページ送り番号] = CSelf10[ピクチャ番号] + 3 
▼  
▼  
▼ ■■■消去処理■■■
■条件分岐(数値):  【1】 CSelf1[種別]  が   -1 と同じ 
-◇分岐: 【1】  [ CSelf1[種別]  が  -1 と同じ  ]の場合↓
 |■ピクチャ消去:CSelf13[四角ピクチャ番号] ~ CSelf16[ページ送り番号]  / CSelf97[消去にかかるフレーム](CSelf3[ディレイ])フレーム
 |■イベント処理中断
 |■
◇分岐終了◇
▼  
▼  
▼  
▼  
▼  
▼  
▼ ■■■位置の計算■■■
■変数操作+: CSelf36[四角X座標] = 呼出マップイベント の 画面X座標(キャラ中央/マップズーム反映)
■変数操作+: CSelf37[四角Y座標] = 呼出マップイベント の 画面Y座標(足下/マップズーム反映)
▼ チョット上に上げる
■変数操作: CSelf37[四角Y座標] -= CSelf42[表示位置調整] + 0 
▼ 文章が画面外に出ないよう調整
■変数操作: CSelf36[四角X座標] 下限= 0 + 0 
■変数操作: CSelf37[四角Y座標] 下限= 0 + 0 
▼ 右端確認
■条件分岐(数値):  【1】 CSelf38[四角X座標終端]  が   Sys116:[読]画面サイズX 超 
-◇分岐: 【1】  [ CSelf38[四角X座標終端]  が  Sys116:[読]画面サイズX 超  ]の場合↓
 |■変数操作: CSelf39[ずらすX座標] = CSelf38[四角X座標終端] - CSelf53[X座標最大] 
 |■変数操作: CSelf36[四角X座標] -= CSelf39[ずらすX座標] + 0 
 |■変数操作: CSelf36[四角X座標] 下限= 0 + 0 
 |■
◇分岐終了◇
■変数操作: CSelf44[文字X座標] = CSelf36[四角X座標] + 0 
■変数操作: CSelf45[文字Y座標] = CSelf37[四角Y座標] - CSelf40[上下余白] 
▼  
■ピクチャ[ディレイ内容リセット]:CSelf12[文字ピクチャ番号] 
■ピクチャ[ディレイ内容リセット]:CSelf13[四角ピクチャ番号] 
▼  
▼  
▼  
▼ ■■■文字表示■■■
▼   ※最大値を取るために最初に確認
■ピクチャ表示:CSelf12[文字ピクチャ番号] [中央下]文字列[\f[\cself[2]]\sp] X:CSelf44[文字X座標] Y:CSelf45[文字Y座標] / 0(0)フレーム  / パターン 1 / 透 255 / 通常  / 角 0 / 拡 100% / カラー R[100] G[100] B[100]
▼  
▼  
▼ ■■■ここからwindow■■■
■変数操作+: CSelf32[Xサイズ] = ピクチャ:CSelf12[文字ピクチャ番号] の 画像サイズ(横)
■変数操作+: CSelf33[Yサイズ] = ピクチャ:CSelf12[文字ピクチャ番号] の 画像サイズ(縦)
■変数操作: CSelf32[Xサイズ] += CSelf41[左右余白] * 2 
■変数操作: CSelf33[Yサイズ] += CSelf40[上下余白] * 2 
■ピクチャ表示:CSelf13[四角ピクチャ番号] [中央下]ウィンドウ「<SQUARE>」サイズ[CSelf32[Xサイズ],CSelf33[Yサイズ]] X:CSelf36[四角X座標] Y:CSelf37[四角Y座標] / 0(0)フレーム  / パターン 1 / 透 CSelf99[透明度] / 通常  / 角 0 / 拡 100% / カラー R[0] G[30] B[35]
▼  
▼  
▼ ■■■ページ送り■■■
■変数操作: CSelf46[ページ送りX座標] = CSelf36[四角X座標] + 0 
■変数操作: CSelf46[ページ送りX座標] += CSelf32[Xサイズ] / 2 
■変数操作: CSelf46[ページ送りX座標] -= CSelf2[文字サイズ] * 2 
■変数操作: CSelf47[ページ送りY座標] = CSelf37[四角Y座標] + 0 
▼  
▼  
▼ ■■■カーソル待ち■■■
■チェックポイント■■■■■■■■■■■■■■■■■■■■■■■■
▼ 今回は使わないので消しておく
■回数付きループ [ 0 ]回
 |■ピクチャ表示:CSelf16[ページ送り番号] [中央下]ファイル(CSelf7[カーソルピクチャ]) X:CSelf46[ページ送りX座標] Y:CSelf47[ページ送りY座標] / 5(0)フレーム  / パターン 1 / 透 255 / 通常  / 角 0 / 拡 75% / カラー R[100] G[100] B[100]
 |■ピクチャエフェクト:CSelf16[ページ送り番号] [自動パターン切替(ループ)] 開始パターン[1] → 終了パターン[CSelf52[パターン数合計]]  間隔[5]フレーム
 |■
◇ループここまで◇◇
■【特】チェックポイント■■■■■■■■■■■■■■■■■■■■■■■■
▼  
▼  
▼ ■■■表示(&消去)処理■■■
■条件分岐(数値):  【1】 CSelf1[種別]  が   1 と同じ  【2】 CSelf1[種別]  が   2 と同じ 
-◇分岐: 【1】  [ CSelf1[種別]  が  1 と同じ  ]の場合↓
 |▼ ■自動消去■
 |■ピクチャ消去:CSelf13[四角ピクチャ番号] ~ CSelf16[ページ送り番号]  / CSelf97[消去にかかるフレーム](CSelf3[ディレイ])フレーム
 |■
-◇分岐: 【2】  [ CSelf1[種別]  が  2 と同じ  ]の場合↓
 |▼ ■キー取得■
 |■キー入力:CSelf0[表示先Ev] [入力待ち【!】]  決定(10) キャンセル(11)
 |■ピクチャ消去:CSelf13[四角ピクチャ番号] ~ CSelf16[ページ送り番号]  / CSelf97[消去にかかるフレーム](CSelf3[ディレイ])フレーム
 |■
◇分岐終了◇

加工1 三角の尻尾は要らないので消す

ズレが気になりがちなので、潔く消しました。
シンプルな方が管理しやすいし……

加工2 ウィンドウサイズの計算方法を変更

文字速度を決める都合などがあると思うのですが、文字数のカウントをしてサイズを制作してらっしゃいました。
これを

  • 文字列をピクチャ表示
  • そのピクチャの横幅を変数+で得る
  • そのサイズに合わせてwindowを生成する

に変更。

加工3 中央下配置を活用

このコモンが投稿された頃にはなかった機能ですね。
ピクチャの基準位置に中央下や中央上が追加されました。
便利!!!!

加工4 強制消去を追加

一定時間すぎると消えるのと、クリック待ちで消えるの2パターンの消去方法があったのですが追加しました。
所定範囲を離れたら消すために、任意のタイミングで消したかったもので。

テキストの管理

csvを使ってるよ

因みにテキストですが、コレはcsvで管理しています。
縦軸がマップ番号、横軸がイベントIDです。
これで全てのマップの全てのイベントが1つのcsvで管理できるわけですね。

csvで管理すると何が良いかと言うと、

  • ウディタのDBは(使いやすいけれど)入力欄が小さい
  • 修正する時、マップイベントを探してコモンの行を押して……だとクリック数が増えるから
  • 翻訳する時便利
    • 起動exeを変えずに言語を変えれるようにする時この方式だと楽だから
  • できるだけ一元管理すればするほど後で全体の修正がしやすい
    • 例えば種類ごとに記号入れたくなった!とか

こんな感じです。

可変DBも使ってるよ

■DB書込:可変DB [タイプ "mapテキスト"(6) を初期化]
■CSVファイルからDBに読込: ファイル "\cself[5]" → 可変DB[ "mapテキスト":0 ](mapテキスト:タイトル) から [ 50 ]データ

こんな感じで読み込んでいます。

現在のウディタではcsvの指定のマスの内容を読み込むことがデキないので……
可変にするとDB操作でむっちゃ楽に色々出来るので、まあ、全然損じゃないです。

やるかわからないのですが、この読み込むcsvを変えるだけで別言語に変えることも出来ると思います。

文字サイズの拡大

おまけですが、雰囲気とドットフォントの都合でかなり小さい文字表示となっています。

……でも見えないですよね??

という事でオプションで2倍表示も付けました。

ゲーム中で使ってる素材の紹介

マップエフェクト

ぴぽや http://blog.pipoya.net/blog-entry-562.html

マップチップ

ねくらマップチップ https://nekuramap.wixsite.com/nekuramap
マップチップ【水底の其処のソコ】 https://ccremo527.booth.pm/items/3909213

フォント

x0y0pxFreeFont https://hicchicc.github.io/00ff/

送信中です

×

※コメントは最大200文字、3回まで送信できます

送信中です送信しました!
タイトルとURLをコピーしました