本日はUnityの小ネタ枠です。
stretch設定のRectTransformで比率を基に幅や高さを変更する方法です。
stretch設定のRectTransformの幅と高さ
stretch設定のRectTransformの幅と高さは rect.width または rect.height で取得できます。
変更する際は offsetMin または offsetMax で設定できます。
docs.unity3d.com
サンプルシーンとサンプルスクリプト
以下のstretch設定のRectTransformで設定されたゲージバーを作成しました。
本シーンを使って、幅や高さが変わったstretchを一定の比率になるようスクリプトから再設定します。
以下のサンプルスクリプトを用意しました。
全体の幅を rect.width から取得し、offsetMin または offsetMax でそれぞれのゲージの幅を変更します。
・StretchGaugeTest.cs
using UnityEngine; public class StretchGaugeTest : MonoBehaviour { /// <summary> /// 全体のサイズ /// </summary> [SerializeField] private RectTransform _totalRectTransform; /// <summary> /// 青ゲージ /// </summary> [SerializeField] private RectTransform _blueRectTransform; /// <summary> /// 赤ゲージ /// </summary> [SerializeField] private RectTransform _redRectTransform; /// <summary> /// 青ゲージの比率 /// </summary> [SerializeField] private float _blueRatio = 50.0f; [ContextMenu("ChangeGauge")] private void ChangeGauge() { // 全体の幅を取得する var totalGaugeWidth = _totalRectTransform.rect.width; var blueGaugeWidth = totalGaugeWidth * _blueRatio / 100.0f; var redGaugeWidth = totalGaugeWidth - blueGaugeWidth; // stretchのLeft, Top, Right, Bottomを設定する _blueRectTransform.offsetMin = new Vector2(0, 0); _blueRectTransform.offsetMax = new Vector2(-1.0f * redGaugeWidth, 0); _redRectTransform.offsetMin = new Vector2(blueGaugeWidth, 0); _redRectTransform.offsetMax = new Vector2(0, 0); } }
動作確認
以下の通り、全体の幅を変更してみます。
stretchで設定した各ゲージは合わせて変形してしまうため、ゲージの比率が一時的に乱れます。
ChangeGauge関数を実行すると、全体の幅から各ゲージの幅を再計算して正しく再設定することができました。