おでんブログ

ゲームデザイナーな自分がUE4でつまづいたところを記録していくブログ

UVスクロールする

[Ver 4.26.0]

シンプルな2Dアクションゲーム用に背景をスクロールさせる。

UVスクロールでやるけど、便利そうに見えたPannerは等速でしか使えないらしく、断念。

UV座標を直接入力することでみんな回避しているらしいのでそうしてみる。

【準備】
  • プロジェクトはテンプレートから2Dサイドスクロールを選択
  • テンプレートで用意されている背景とプレイヤーキャラクターを使用

f:id:marutoku-oden:20210115105228p:plain

2Dサイドスクロールのテンプレートの初期画面
【もくじ】
  1. マテリアルを新規作成してUVスクロールする設定にする
  2. マテリアルパラメータを外部(ブループリント)から変更できるようにする
  3. ブループリントからパラメータを変更してスクロールさせる

 

1.マテリアルを新規作成してUVスクロールする設定にする

コンテンツブラウザ上で右クリックしてマテリアルを新規作成する。

適当に名前を付ける。ここでは[BackGround_M]とした。

↓作成したマテリアルを開いてBlendModeとShadingModelを設定。

f:id:marutoku-oden:20210115113150p:plain

 

マテリアルの設定を下記のように設定。

f:id:marutoku-oden:20210115112318p:plain

TextureSampleはお好みの背景テクスチャで。ここではテンプレートの[2DBackground]を使用。

TexCoordはUV座標の基本的な値を出力してくれて、これを加工するとUVスクロールさせることができるらしい。

 

【つまづきポイント】

  • [0]のノードはどうやって出すのか…?

☞右クリック→「constant」と入力/選択すると出てくる

【いまだにわからないポイント】

  • Constant2つをAppendするとVec2で出力されるであってる?
  • なぜTexCoordにVec2を足すとUV座標が動くのか?
2.マテリアルパラメータを外部(ブループリント)から変更できるようにする

f:id:marutoku-oden:20210115112559p:plain

AppendのAにつながっているConstantを右クリックしてパラメータに変換。

これでブループリントから値を入力することができる。

名前も分かりやすく「PosX」に変更しておく

f:id:marutoku-oden:20210115112822p:plain

次に、 背景オブジェクト[Background_Sprite]をブループリントとして開く。

f:id:marutoku-oden:20210115170317p:plain

↓コンストラクションスクリプトにこちらを追加

f:id:marutoku-oden:20210115171454p:plain
[CreateDynamicMaterialInstance]はマテリアルインスタンスを作成するノード。さっき作った[Background_M]を指定する。

作ったマテリアルは変数に格納しておく。

[SetMaterial]で自分自身にマテリアルインスタンスを設定する。

これで作ったマテリアルがオブジェクトに反映されるはず。

3.ブループリントからパラメータを変更してスクロールさせる

まずは簡単にこんな感じ。

f:id:marutoku-oden:20210115171840p:plain

[SetScalarParameterValue]でマテリアルに値を入力する。

ParameterNameを忘れずに[PosX]に変更

GetWorldDeltaSeconds(TickのDeltaSecondsでもいい)を素直に足していってValueに入力。

これで背景がスクロールする。

UVPosの値を変化させればPannerでできなかった加速度的なスクロールができる。

 

参考

UV座標系 | CG用語辞典 | CGWORLD Entry.jp

もんしょの巣穴blog [UE4] マテリアルノードの解説 その2

Panner Speed Control - Unreal Engine Forums