【Godot4.2】スマートなUI作成!Simple GUI Transitionsの使用方法 3/22
楽にノードの遷移が出来るようになるアセットSimple GUI Transitions(SGT)
を紹介します。
1.ダウンロード方法
ダウンロード方法はGodot無いのAssetLibを用いてダウンロードする方法、
又はGitHubから直接ダウンロードする方法があります。
次にプロジェクト設定からプラグインのタブを選び、該当するプラグイン(今回ではSimpleGUITransitions)のステータスを有効にし、Godotの再起動を行います。
そうしたら新たにGuiTransitionのノードが追加されています
2.GTノードのプロパティ
AutoStart:自動で始まるかどうか
Fade Layout:有効にすると、個々のコントロールの選択したアニメーションとともにレイアウト全体がフェードする。
Animation Enter/Leave:フェード/左右上下スライド/スケールチェンジが
選べる
Duration:遷移時間の合計時間
Delay:各ノードの遷移時間の遅延率。0.0で同時、1.0で前ノードが終わるまで待機
Transition Type:遷移の遷移曲線
Ease Type:遷移のイーズカーブ
Layout:メインのレイアウトノード。これに応じて表示・非表示が決まる。シーン内の最上位ノードでなければいけない。又Controlノードを含む必要がある。
LayoutID:シングルトンで用いる際の識別ID
Controls:遷移アニメーションを適応させるノードを割り当てる必要がある
Group:アニメーション化される子ノードを持つ親ノードを指定する。Vboxなどに入ったノードをまとめて遷移したい場合に便利。
ControlsかGroupは設定しなければいけない
Centerpivot:スケールチェンジアニメーションの場合中央にピボットするかどうか
3.使用例
今回は最初に載せたGifの様に動作する遷移アニメーションを作成します。
今回はこのようなテストシーンを作成しました。
プロパティもこんな感じです。
1.始まった際に遷移が起動して欲しい
プロパティのAutoStartをTrueにすれば解決する問題ですが、以下の様なスクリプトでも起動することが出来ます。
func _ready():
GuiTransitions.show("test")
ここで初めて出るGuiTransitionsとはGuiTransitionをまとめるシングルトンであり、.show(LayoutID)を用いると指定したIDの遷移アニメーションを表示する事が出来ます
2.ボタンを押した際に消えて欲しい
以下の様なスクリプトを追加し、実施しました。
func _on_button_button_down():
GuiTransitions.hide("test")
勿論ボタンをコネクトして、今度はGuiTransitionsのhideを用いました。
これは現在表示されているモノをアニメーションと共に非表示にする事が出来ます。
これで可能なはずです。
GuiTransitionsには他にも、show_completedのシグナルや、
go_to、update、is_shown,is_hiddenのメソッドも存在します。
詳しくはGitHubのシングルトンの記述を
これでまた少し楽でクオリティが高く見えるものが出来ますね(*^^*)
それでは(つ∀-)オヤスミー
この記事が気に入ったらサポートをしてみませんか?