1. Roblox StudioのUIPageLayoutとは
Roblox Studioには、UIPageLayoutというGUIの機能があります。UIPageLayoutを使うことで、UIオブジェクトに複数ページを実装することができます。
以下では、実際にUIPageLayoutを使用してみます。
2. 使用する機能
・UIPageLayout
3. UIPageLayoutの簡単な使い方
まず、Roblox Studioを起動します。今回は、テンプレート「Baseplate」を使用します。
今回使用するUIPageLayoutは、Explorerのプラスボタンから追加することができます。
UIPageLayoutを使用するための準備をしていきます。
まず、HOMEタブにあるUIをクリックします。
次に、ScreenGUIをクリックします。
次に、Frameをクリックします。
Frameを画面全体に表示されるようにします。
Frameの中にUIPageLayoutを追加します。
UIPageLayoutと同じ階層にTextLabelを2つ追加します。
現状、1つのTextLabelしか見えていません。
2つのTextLabelを見分けるために、色を変更します。
この状態で、ゲームをプレイし、スクロールしてみます。
スクロールすると2つ目のTextLabelが現れました。このように、UIが2つのページで構成されていることが分かります。
UIPageLayoutのプロパティを変更してみます。
まず、FillDirectionをVerticalに変更して、ゲームをプレイしてみます。
すると、先ほどとは違い、ページが縦方向に構成されています。
次は、HorizontalAlignmentをCenterに変更してみます。すると、TextLabelの横の位置が真ん中になりました。
次は、VerticalAlignmentをCenterに変更してみます。すると、TextLabelの縦の位置が真ん中になりました。
次は、TweenTimeを2から5に変更してみます。
すると、ページ移動が遅くなりました。
最後に、EasingStyleをBounceに変更してみます。
すると、ページ移動した際にバウンドするようなアニメーションに変更されました。EasingStyleには他にも複数の項目(アニメーション)が用意されています。
コメント