画面切替後、キャラクター画像が表示されない問題に対応【RPGツクールMZプラグイン】

2021年07月20日

 画面切替後、キャラクター画像が表示されない問題に対応します。


 RPGツクールMZでは、場所移動時やセーブデータのロード時に、キャラクター画像がわずかな時間だけ表示されないことがあります。
 ※ツクールMVでは発生しない模様です。

 この現象は一つのマップで多くのキャラクター画像を使用するほど顕著になります。
 例えば、1マップで30程度の画像を読み込ませた場合、0.2〜0.3秒程度の間、キャラクター画像が表示されないこともありえます。
 ※一度、ロードした画像はゲームを再起動するまで発生しなくなります。

 通常の場所移動ではフェード処理があるので目立ちません。ですが、フェードなしで場所移動した場合や、セーブデータのロードをした場合は、はっきりとプレイヤーにも分かってしまいます。
 ※ロードに関しては通常はフェードイン処理が行われるので目立ちません。エディタで編集した直後のマップの場合のみ、フェードなしになる模様です。(2021/12/06)

 現象が起こる原因は、キャラクター画像の描画処理のタイミングが安定していないことにあります。

 このプラグインでは画面切替後、確実にキャラクターの描画処理を行うことで、マップ画面とキャラクター画像が同時に表示されるように改善します。

 以下が適用後です。キャラクター画像がマップ画面と同時に表示されています。



目次


導入方法(Install)

更新履歴(History)

使用方法(Usage)


導入方法(Install)


 以下のファイルをダウンロードし 、[プロジェクト]\js\plugins に放り込みます。ツクールのプラグイン管理から機能をONにしてください。
 ※このプラグインはMZでのみ有効です。

 NRP_FixLoadCharacter.js ver1.00(2021/07/20)

更新履歴(History)


2021/07/20(ver1.00)

  • 公開!

使用方法(Usage)


 適用するだけでOKです。
 パラメータも何もありません。

 なお、ロード時間に悪影響を与えることも恐らくありません。
 というのも、キャラクター画像のロード完了自体は元から実施されているためです。
 (問題はその後の描画処理にあります。)

 >RPGツクールMZ&MV目次に戻る
posted by 砂川赳 at 18:20 | RPGツクールMZ&MV | このブログの読者になる | 更新情報をチェックする

DynamicAnimation&Motion マップ用サンプル【RPGツクールMZ&MVプラグイン】

2021年07月10日

 このページはDynamicAnimationをマップ上で起動するプラグインおよびDynamicMotionをマップ上で起動するプラグインの解説の一部です。

 基本的な使用法は戦闘時と同じなので、DynamicAnimation未体験の方は本体の情報(MVMZ)も参照してください。
 ここでは特に、マップ上で役に立ちそうなサンプルをまとめていきます。

 処理負荷の現実性から、基本的にはMV用アニメを使っていきます。MVを持ってない人はごめんなさい。
 必然的にMZでは、DynamicAnimationMZからMVアニメを呼び出すプラグインが必要です。

事前準備


 MZからMVアニメを使っていく都合、公式のAnimationMv.jsは最新にしておくと便利です。MZのテストプレイ起動時にMVのアニメーションデータを自動取得してくれます。

目次


DynamicAnimation


DynamicMotion


射撃


 始点から対象へ向かって移動するアニメーションを放ちます。


 事前準備として、こちらのページを参考に矢のMVアニメーションを用意してください。別に矢でなくとも、左向きのアニメーションであれば何でも構いません。
 そして、用意した矢のアニメーションを、スキルへ設定してください。
 ※正確にはMVで用意したアニメーションと同じ番号のアニメーションをスキルへ設定します。

 次にスキルのメモ欄へDynamicAnimationの動作を記入していきます。
 一つ問題となるのは、戦闘時と異なりマップ上の対象は360度どの方向にいるか不明なことです。
 そこでlookCourseテンプレートを使います。これを指定すると常にアニメーションが進行方向を向くようになります。
<D-Setting:MV> // MVアニメ

<D-Animation:shot&lookCourse>
arrival = 4 // 到達フレーム
</D-Animation>

 ※到達フレーム(arrival)については、基本的な使用法をご参照ください。

 後はプラグインコマンドからアニメーションの表示を呼び出せばOKです。設定した始点から対象へ向かって矢が飛んでいきます。

 ※<D-Setting:MV>の記載はMVでは不要です。ただし、そのまま追加しても動作に影響はありません。

ランダム炎


 画面全体に炎を表示します。主人公の故郷の村を焼きたい時などに便利です。


<D-Setting:MV>

<D-Animation:screen>
repeat = 10
interval = 1/2
sxRandom = Graphics.boxWidth / 2 * 1.5
syRandom = Graphics.boxHeight / 2 * 1.5
scale = 0.5
limitSound = 0
limitFlash = 0
wait = repeat * interval
</D-Animation>

 screen型テンプレートによって、対象が画面中央になります。これによって、プレイヤーの位置に関係なく画面に対してアニメーションが表示されます。

 repeat=10で炎を10回繰り返しています。interval=1/2は1/30秒毎を意味しています。
 これを並列処理のイベントからプラグインコマンドで実行します。オプションの『完了までウェイト』をオンにすると、アニメーションがループします。screen型の場合、対象は無意味になるので何でも構いません。

 ポイントはwait(ウェイト)です。
 この指定がない場合、アニメーションは全て終了してからループします。場合によってはそれでも構いませんが、一瞬だけ炎が途切れてしまいます。
 そこで終了するよりも短い時間をウェイトで指定することで、ループタイミングを早めています。これによってスムーズに炎がループするようになります。
 時間を計算して数値を入力してもいいですが、『wait = repeat * interval』を指定してしまうのが楽です。これは10回目の繰り返しが始まるタイミングと同じです。最後の炎が表示されると同時に、ループに入るって感じですね。

 また、sxRandomおよびsyRandomで指定したランダム幅(×2)が炎を表示する範囲になります。Graphics.boxWidth, Graphics.boxHeightは画面の横幅、縦幅に相当します。それに1.5をかけているのは、プレイヤーの移動を考慮しているためです。

炎の雨 2021/04/09更新


 画面全体に炎の雨を降らします。


 まず『射撃』の矢と同じように、着弾する炎の玉のアニメーションを作ります。ただし、今度は下向きにしてください。
 ※面倒なら『射撃』と同じ矢でも構いません。ただし、rain&lookCourseというように向きを補正しないと下を向いてくれません。

 次に以下のように記入します。
<D-Setting:MV>

<D-Animation:rain&screen>
repeat = 100
interval = 1/4
arrival = 10
sy = -250 // 画面外の上側を始点に
sxRandom = Graphics.boxWidth / 2 * 1.5 // 始点ランダム横幅
syRandom = Graphics.boxHeight / 2 * 1.5 // 始点ランダム縦幅
exRandom = 200 // 終点ランダム横幅
wait = repeat * interval
</D-Animation>

 ※2021/04/09 プレイヤーが画面端にいるとアニメが片寄る問題があったため、赤字部分を修正しました。

 上の『ランダム炎』と要領はほぼ変わりません。exRandomによって、着弾点を変化させています。

 他にも水の雨、氷の雨、矢の雨、槍の雨……。使い方は様々です。
 rain型については過去の記事もどうぞ。以下では雨を斜めに降らせる記述もあります。
 http://newrpg.seesaa.net/article/473606870.html#rain

海底バブル


 泡によって海底のような演出を行います。『82:水/単体2』のアニメーションをスキルに設定しています。
 炎の雨と同じく並列処理のイベントからプラグインコマンドで実行します。『完了までウェイト』をオンにすることも忘れずに。


<D-Setting:MV>

<D-Animation:screen>
sxRandom = Graphics.boxWidth / 2 * 1.5 // 始点ランダム横幅
syRandom = Graphics.boxHeight / 2 * 1.5 // 始点ランダム縦幅
exRandom = 25 // 終点ランダム横幅
ey = sy - 200 // 終点Y:上に200移動
scale = 0.2 + da.startRandom() * 0.3 // 大きさ20~50%
opacity = 128 // 不透明度
limitSound = 0 // 効果音なし
limitFlash = 0 // フラッシュなし
wait = Math.randomInt(10) // ウェイト0~9
</D-Animation>

 ※2021/04/09 プレイヤーが画面端にいるとアニメが片寄る問題があったため、赤字部分を修正しました。

 『82:水/単体2』のアニメをそのまま使用すると効果音やフラッシュがついてくるので、『limitSound = 0』『limitFlash = 0』の設定によって消しています。

 『scale = 0.2 + da.startRandom() * 0.3』は泡の大きさです。大きさを20~50%の範囲でランダムに決定しています。
 『da.startRandom()』は0~1.0の間の数値をランダムで生成する独自関数です。詳しい人は『Math.random()』じゃダメなのと思うかもしれませんが、あちらでやると毎フレームサイズが変動するのでカオスになります。

 『wait = Math.randomInt(10)』は終了時間をランダムで0~9に決定しています。これによって、泡の発生する間隔をバラつかせています。ちなみに、こちらはツクールの標準関数です。

 終点の移動先や不透明度は好きなようにアレンジしてください。

 ※scaleはMV版だとDynamicAnimation ver1.17より有効となります。それより古いバージョンだとscaleX, scaleYを使う必要があります。

背景光


 背景に流れる光を表示します。
 光はMVの『Light4』の素材で適当に作ったものです。
 『120:放射線』からフラッシュや効果音を消すだけでもよいと思います。その場合、サイズ(scale)が大きいので適当に調整してください。


<D-Setting:MV>

<D-Animation:screen>
repeat = 10
interval = 2
sx = Graphics.width
syRandom = Graphics.height / 2
ex = 0
eyRandom = Graphics.height / 2
scale = da.startRandom(0) * 1 + 0.5
color = [da.startRandom(1) * 255, da.startRandom(2) * 255, da.startRandom(3) * 255, 255]
wait = repeat * interval
z = -1
</D-Animation>

 『sx = Graphics.width』は画面右端から開始の意味です。『ex = 0』は画面左端で終了の意味ですね。
 『syRandom = Graphics.height / 2』『eyRandom = Graphics.height / 2』は画面の縦幅でランダム移動するという意味です。
 なお、プレイヤーが移動する場合はもう少し大きな範囲を指定したほうがよいかもしれません。さもないと、画面スクロールによってアニメーションが途切れてしまう場合があります。

 『color = [da.startRandom(1) * 255, da.startRandom(2) * 255, da.startRandom(3) * 255, 255]』は色調変更をランダム指定したものです。
 左から赤、緑、青、強さとなります。
 ただし、色調変更は結構重いので注意です。不要ならcolorの行を削除してください。

 『da.startRandom(1)』というのはランダム値の生成処理にキー(1)を指定したものです。つまり『da.startRandom(1)』を複数回使っても必ず同じ値を返します。このキー値はランダム値の取る範囲ではありません。ややこしいので注意です。

 『z = -1』はZ座標を変更しています。-1を指定すれば背景だけに表示されます。
 ちなみに各要素のZ座標は以下の通りです。

  • 0 : 下層タイル
  • 1 : 通常キャラの下
  • 3 : 通常キャラ
  • 4 : 上層タイル
  • 5 : 通常キャラの上
  • 6 : 飛行船の影
  • 7 : 吹き出し
  • 8 : アニメーション
  • 9 : 目的地

 例えば『下層タイル』と『通常キャラの下』の間に表示をしたい場合は『z = 0.5』などの値を設定します。
 ※Z座標は小数も指定可能です。

セルフバーニング(2020/10/21)


 ステートにDynamicAnimationを付加する機能を使って、体に炎がまとわりつくような演出を行います。
 スキルには単純な炎のアニメーションを設定してください。


<D-Setting:MV>

<D-Animation:follow> // 対象を追尾
repeat = 10
interval = 4
addX = -50 + 100 * da.random(1) // X座標の分散
addY = -50 + 100 * da.random(2)
// Y座標の分散
scale = 0.2
opacity = 200
wait = repeat * interval
</D-Animation>

 『follow』型の機能によって、アクターが移動しても炎が追尾するようになります。

 ただしそれだけだと炎の位置が固定されてしまうので、『addX』『addY』にランダム値を設定して位置を分散させています。
 『-50 + 100 * da.random(1)』で-50〜+50までの数字という意味ですね。
 なお『da.startRandom(1)』と『da.random(1)』は全く同じです。最近のバージョンで省略できるようになりました。

 間隔や大きさ、不透明度などは好きなようにアレンジしてください。

太陽光(2021/04/24更新)


 太陽光っぽい演出を行います。
 比較的処理は軽いはずです。


 あらかじめMVエディタ上で、太陽光のアニメーションを作成しておきます。


 内容は『Light4』の固定パターンを中央に貼り付けているだけです。アニメーションも不要なので、最初の1フレームをコピペするだけで終わります。
 今回の例では120フレームとしています。
 パターンは適当に7番目のものを使用しています。(1だと小さいので注意)

<D-Setting:MV>
<D-StartTiming:30> // 開始時間を早める

<D-Animation>
sx = -48
sy = -48
scale = 12

opacity = 100 * Math.sin(Math.PI * t/et)
rotation = 0.2 * t / et + 2 * Math.PI * da.random()
wait = 50
//color = [255, 255, 255, 255]

</D-Animation>

 やっていることは、画面左上にアニメーションを貼りつけて回転させているだけです。赤字部分をお好みで調整してください。
 以下詳細です。
 ※青字部分は上級者向けの解説なので、基本スルーで構いません。

 『<D-StartTiming:30>』によって開始タイミングを調整します。これによって、画面切り替え直後でもすぐに光が差した状態にできます。
 ※マップ版DynamicAnimationを最新にする必要があります。(2021/04/24)

 『sx = -48』『sy = -48』がアニメの位置です。別に0でも良いのですが、中央を隠して光線だけを見せたいので左上に移動させています。

 『scale = 12』でアニメを12倍に拡大しています。これは光線の長さに影響します。

 『opacity = 100 * Math.sin(Math.PI * t/et)』の『100』の部分が最大不透明度です。このままだとまぶしいかもしれないので、お好みで調整してください。
 『Math.sin(Math.PI * t/et)』によって、アニメが透明状態で出現→不透明→透明状態で消滅となるようにしています。これは切れ目を目立たないようにするための措置です。

 『rotation = 0.2 * t / et + 2 * Math.PI * da.random()』の『0.2』が1つのアニメが消滅するまでの回転量です。約6.28(2π)で消滅するまでに一回転するようになります。
 『2 * Math.PI * da.random()』は初期の角度をランダム化する調整です。

 『wait = 50』はアニメ同士の表示間隔です。
 1つのアニメが消滅する前に次のアニメを表示することで、切れ目を目立たなくしています。この値を小さくすると、光線が増えてまぶしくなっていきます。

 『//color = [255, 255, 255, 255]』は色調の変更です。
 数値は順に[赤, 緑, 青, 強さ]です。0〜255で値を調整できます。
 この処理は少し重いので初期状態では無効化しています。『//』を外すと有効になります。
 なお、上記のサンプル画像はこれを有効にした状態のものです。初期状態だと赤い夕日っぽい雰囲気になります。
 「色調変更したいけど重さが気になる」という場合は『Light4』の画像自体を色調変更して、別ファイルを作ってしまうのがオススメです。自分はPhotofiltre7というソフトを使っています。


 後はスキルを並列処理からプラグインコマンドで呼び出します。
 オプションを開き『完了までウェイト』および『スクロールしない』をオン。対象を『-1:プレイヤー』に『有効範囲』を0に設定すればOKです。

霧(2021/07/10)


 怪しい霧を立ち込めさせます。


 例によって、MVエディタ上で霧のアニメーションを作成しておきます。


 今回は『Mist』の固定パターン(先頭のパターン)です。それを60フレーム分コピペしただけです。
 この60フレームが1つの霧の固まりが消えるまでの長さになります。

<D-Setting:MV>
<D-StartTiming:50> // 開始時間を早める

<D-Animation:randomAll&screen>
repeat = 60
interval = 1
sxRandom = Graphics.width / 2 * 2
syRandom = Graphics.height / 2 * 2
ex = sx + (r % 2 == 0 ? -800 : 800)

scaleX = 4 + 4 * da.random(1) // 横幅を4~8倍
scaleY = 2 + 2 * da.random(1) // 縦幅を2~4倍
opacity = 128 * Math.sin(Math.PI * t/et) // 不透明度を0 -> 128 -> 0に
wait = repeat * interval
</D-Animation>

 『ex = sx + (r % 2 == 0 ? -800 : 800)』は偶数回のアニメは左に移動、奇数回は右に移動の意味です。800が移動幅ですね。
 通常、この種のアニメーションはプレイヤーの移動によって画面スクロールすると切れ目が目立ってしまいます。そこで左右から交差させることによって誤魔化しています。

 『sxRandom = Graphics.width / 2 * 2』『syRandom = Graphics.height / 2 * 2』によって、画面幅の1.5倍の範囲に霧をランダムで出現させています。
 これもやはり画面スクロールを考慮した結果です。数値を小さくすると霧の密度が上がりますが、上下スクロール時に切れ目が目立つようになります。

注意点

  • 性質上、プレイヤーの移動が速いと切れ目が目立ちやすいです。
  • 大量のアニメーションを表示しているため、比較的に処理が重いです。
    intervalが短く、scaleが大きく、アニメーションが長い(エディタの設定)ほど重くなりやすいのでご注意ください。
  • サンプル用に分かりやすくしたため、霧が濃いかもしれません。
    『opacity = 128』の数値を下げると薄くなります。

ぶっ飛ばし


 DynamicMotionを使ってキャラクターをぶっ飛ばします。


<D-Setting:MV>

<D-Animation/>
<D-Motion:roll&wait>
frame = 8 // ぶっ飛び時間
exRandom = Graphics.width / 2 // 画面横幅にランダム移動
eyRandom = Graphics.height / 2 // 画面縦幅にランダム移動
rotation *= 1 // 回転数
scale = 1 + 9 * t/et // 1から10倍まで拡大
z = 10 // 表示優先度
</D-Motion>
<D-Motion:soon&invisible/> // 瞬時に透明化

 詳細は注釈の通りなので、さほど難しいことはありません。
 ただし、動作を実行するのはプラグインコマンドで始点(行動主体)側に指定したイベントであることに注意してください。
 反対に、アニメーションの表示対象は通常だと対象側です。今回の場合は単純に対象と始点の両方を同じイベントにしています。

 なお、この動作は単にキャラクターを透明化しているだけであり、イベント自体はどこかの座標に依然として存在しています。すり抜けなどの処置をしてイベントを再実行できないようにする必要があります。

ダッシュアタック


 対象に走り寄って攻撃します。その後、元の位置へ戻ります。


<D-Motion:turnToward&near/> // 対象を向いて接近
<D-Animation/>
<D-Motion:return/>

 ほとんどの処理は戦闘中の記述と変わりません。
 唯一異なるのは『turnToward』による対象を向く機能だけです。これにより、どの位置関係にあっても自動的に対象の方角を向いてくれます。

 なお『turnToward』は戦闘中に使用すると無効になります。逆に『attack』などマップ上では無効となる動作もあります。
 この性質に加え、『ifBattle』『ifMap』といった場面を限定するテンプレートを利用すれば、戦闘とマップでスキルを共有させることも可能となります。

 >DynamicAnimationをマップ上で起動に戻る
 >DynamicMotionをマップ上で起動に戻る
 >RPGツクールMZ&MV目次に戻る
posted by 砂川赳 at 10:54 | RPGツクールMZ&MV | このブログの読者になる | 更新情報をチェックする