作品リストホームUnityUnityのRectTransform【使い方とスクリプト】UnityのRectTransform【使い方とスクリプト】Unity2019.12.20UnityのコンポーネントであるRectTransformについて詳しく解説していくページです。Mode<Canvasのスクリプトの使い方>anchoredPositionanchoredPosition3DanchorMaxanchorMinoffsetMaxoffsetMinpivotrectsizeDeltaForceUpdateRectTransformsGetLocalCornersGetWorldCornersSetInsetAndSizeFromParentEdgeSetSizeWithCurrentAnchors<RectTransformとは>RectTransformというのは、2Dでのレイアウトを便利に実装できるようにする為のコンポーネントです。UGIというUnityに置けるUIを使う時に使用されます。位置、回転、大きさの設定はもちろん、2D上でどのような位置を基準にするのか、UIの拡大縮小をどのようにするのかも決める事ができます。Canvas配下のオブジェクトにつけれられるコンポーネントです。Canvasについては↓の記事で解説しています。UnityのCanvas【使い方とスクリプト】UnityのCanvasの使い方について詳しく解説しています。ScalerやGraphicRaycaster、EventSystemなどの解説もあるのでぜひご覧ください。dkrevel.com2019.12.20<RectTransformのインスペクター>クリックすると展開しますインスペクターの詳細インスペクターの項目を上から順番に紹介したいところですが、設定によって項目の意味が変わってくるので、わかりやすい順番から紹介していきます。Pivotまず、ここを理解しておかないとその他のパラメータの意味がわからなくなるので、Pivotから紹介します。このPivotというのはこのゲームオブジェクトの中心点を表します。←のようにXとYの値で決定します。これで設定した位置を基準にこのオブジェクトの見え方を決定します。トランスフォームツールの2D用のボタンをクリックする事で、そのオブジェクトのPivotをみる事ができます。左下を(0,0)として、右上が(1,1)になってます。これはオブジェクトがどんな大きさであろうと正規化されて0〜1の範囲になります。↑の例ではPivotは(0.5,0.5)です。リングっぽいアイコンがPivotの位置を表しています。0.5,0.5でちょうど真ん中にきている事がわかると思います。どこに基準を置くのかを決めるパラメータだと覚えておいてください。ちなみに、UGUIでなくてもこのパラメータは反映されますが、3Dオブジェクトの場合、3Dの中心位置がPivotの位置と合致するようになっています。UGUIだとこのPivotを基準にしてその他のパラメータへの影響が変わるのですが、UGUIでない場合単なる中心位置が変わるだけなので注意してください。要はUGUIじゃなくても使えるけど、機能的な恩恵はほとんどないよという事です。このRectTransformは子オブジェクトに対しても効力を発揮するコンポーネントなので、UGUIでないものをRectTransformで置いて、子オブジェクトをUGUIにするといった使い方もできます。Anchors親オブジェクトのRectTransformのから判断して自身の位置と大きさを調整する為のパラメータです。↑のように2種類のXとYの値で決定されます。このanchorsはシーンビューで見ると↓のやつになります。MinのパラメータとMaxのパラメータを変更する事で↑の位置を変更する事ができます。↑このように4つのアンカーがある事が確認できます。X,Yの関係は↓のようになります。Minが緑でMaxが赤になっています。このMinとMaxは親オブジェクトのRectTransformの縦幅、横幅からの割合を表します。Max(0.7,0.7)とすると↓のようになります。Min,Maxは正規化された値なので、100倍すると%になります。このように親オブジェクトからの割合で表される事がわかります。ちなみに、インスペクターの左上にある画像をクリックするとAnchorのプレセットがでてきます。これで、UGUIの拡大縮小を表しているように見えますが、実はこれはただのプレセットです。このプレセットを選択するとMinとMaxの値が変わるだけなので惑わされないようにしましょう。赤の縦線はMinXとMaxXが同じ値、横線はMinYとMaxYが同じ値にするとなります。それ以外だと何も表示されません。Deltaさて、ここがRectTransformの一番ややこしいところかもしれません。上パラメータは状況によって表示が変わります。Yが一緒だったりするとインスペクターの表示が↓のように変わります。XとWidthになります。時パラメータがLeftとRightになります。YとHeightになります。Yの時パラメータがTopとBottomになります。このように全く違うパラメータが表示されている点に注意してください。MinとMaxによって表示されるパラメータが変わります。Maxというパラメータから計算されて出されています。本来はこれらの値を考えるべきなのですが、それではインスペクターを触れなくなってしまうので計算後のパラメータを変更するとどうなるのかを解説していきます。Zというパラメータは特に計算されないパラメータなのでそのまま表示されます。そもそもRectTransformが2D用なのでZ座標には特に何も行わないようです。これは単純に親オブジェクトから見た相対的なZ座標の位置になります。これをスクリプトから触ると実はlocalPositonのZになります。RectTransformなので違和感があるかもしれませんがスクリプトにはlocalPositionがあります。ちなみに、anchoredPosition3Dという変数でも変更する事ができます。・WidthとHeightMinとMaxが同じ値の時この表示になります。Xが同じだとWidth,Yが同じだとHeightです。そもそもMinとMaxは親オブジェクトから見た割合を示すものなのに、同一の値であるという事は本来幅、高さ「0」を表します。この値はMinとMaxによらない値になります。簡単に言うと、MinとMaxから割合で算出される幅、高さに単純に加算する値になります。MinとMaxが同一の時縦幅、横幅は「0」なので、単純にWidth、Heightが幅高さになるわけです。わかりやすいようにWidth,Heightと表記しているものと思われます。これをスクリプトで表すと変数sizeDeltaになります。YMinとMaxが同じ値の時この表示になります。MinとMaxが同じ値の時、X座標やY座標は「←→」のような範囲ではなく「点」になります。Yはその点からの相対的な位置を表します。点からの相対的な位置を計算するときに使用されるのはPivotの位置基準になります。Yと表記しているものと思われます。Xが違う値の時この表示になります。これはAnchorからの距離を表します。エディタで見ると↓のような感じです。アンカーからの距離150の位置にImageの右側が来ている事がわかります。Leftは左のアンカーからの距離になりますね。ちなみに値をマイナスにする事もできます。その場合はアンカーの位置からはみ出します。この値によって左右の位置が固定されるので、親オブジェクトの大きさによってUGUIが横に伸び縮みします。単純に親オブジェクトの幅高さを大きくしてみます。すると↓のようになりました。200」なので高さが200で固定されます。ところがMinXとMaxXは違う値な為、横幅は大きくなった分アンカーが親についていきます。アンカーの位置からLeftとRightを計算するので横に伸びたわけですね。offsetMax.xがRightになります。この辺もややこしくしている要因ですね。Yが違う値の時この表示になります。Leftが縦になっただけなので割愛します。Scaleこの2つのパラメータはTransformとだいたい一緒なのですが、基準がPivot中心になる点に注意してください。RotationはPivotを中心に回転します。2Dなので、ほとんどZしか回転させないと思います。ScaleもPivotを基準にして拡大縮小します。これはUIをRotationとScaleによらない状態で編集できるモードです。通常の状態BlueprintModeUGUIを編集する為の青点の矩形が違う事がわかると思います。このモードはシーンビューで編集しやすいようにするモードですので、インスペクターの値などは変わりません。Maxを変更した時にUGUIの大きさや位置をそれに合わせるモードです。↓の状態でUIを設置していたとします。Pivot(0,0.5)に変更した場合↓のようになります。Mode通常の状態だとアンカーの位置とピボットの位置が変わっただけでUI自体の見た目に変化はありません。Modeだとアンカーとピボットに合わせてUIが変化している事が見て取れます。ModeではないPivotの位置からの相対的な位置です。Modeにした時と同じ挙動になっているので注意してください。使い方UGUIの位置を変更したい場合に使用します。Vector2.zero;anchoredPosition3D↑のanchoredPositionにZ軸を合わせたものです。このクラスはTransformを継承しているのでlocalPositionでZ軸を変えることもできますが、こちらを使用することでPivotの位置を考慮に入れて座標を変える事ができます。使い方UGUIの位置を変更したい場合に使用します。Vector3.zero;anchorMaxインスペクターの項目で解説したanchorMaxのパラメータを変更します。アンカーの右上の部分にあたります。Modeにした時と同じ挙動になっているので注意してください。使い方UGUIのアンカーの位置とそれに合わせてUGUIの位置も変更したい場合に使用します。Vector2.zero;anchorMinインスペクターの項目で解説したanchorMinのパラメータを変更します。アンカーの左下の部分にあたります。Modeにした時と同じ挙動になっているので注意してください。使い方UGUIのアンカーの位置とそれに合わせてUGUIの位置も変更したい場合に使用します。Vector2.zero;offsetMaxインスペクターの項目で解説したRightとTopのパラメータを変更します。XがRightにあたり、YがTopにあたります。使い方UGUIの右上がアンカーからどれぐらいの位置の距離に設置されるかを決定します。マイナスにする事で親オブジェクトからはみ出します。Vector2.one;offsetMinインスペクターの項目で解説したLeftとBottomのパラメータを変更します。XがLeftにあたり、YがBottomにあたります。使い方UGUIの左上がアンカーからどれぐらいの位置の距離に設置されるかを決定します。マイナスにする事で親オブジェクトからはみ出します。Vector2.one;pivotインスペクターの項目で解説したpivotのパラメータを変更します。Modeにした時と同じ挙動になっているので注意してください。使い方UGUIの中心位置を変更すると同時にUGUIの位置を中心位置に合わせて動かします。Vector2.one;rectこのRectTransformを矩形で表した時のデータを読む事ができます。使い方UIをスクリプトから設置する時にUGUIの矩形の大きさの情報を得ることによってどのように設置するのか計算で出す事ができます。")です");sizeDeltaanchorMinとanchorMaxから割合で算出される幅、高さに単純に加算する値です。簡単に言うとUGUIの伸び縮みとは関係なしに存在する幅と高さです。インスペクターで言うとWidthやHeightがそのままこの値になります。Left,RightとTop,Bottomの値からもこの値が計算できますが、単純な距離ではなくアンカーからの距離です。使い方UGUIの大きさを変えたい時に使用します。100;関数ForceUpdateRectTransformsRectTransform内部の計算を再計算します。使い方スクリプトからRectTransformのパラメータを変更して、即座に反映してほしい場合にこのメソッドを呼び出します。//RectTransformのパラメータを即座に再計算しますGetLocalCornersRectTransformの各種パラメータからできる矩形の4つの点のローカル座標を得られます。配列は参照型なので引数に入れた配列に中身が入って返ってきます。4点なので配列の長さは4にする必要があります。使い方このUIの4隅のローカル座標を得て計算するのに使用します。v[i].ToString());}GetWorldCornersRectTransformの各種パラメータからできる矩形の4つの点のワールド座標を得られます。配列は参照型なので引数に入れた配列に中身が入って返ってきます。4点なので配列の長さは4にする必要があります。使い方このUIの4隅のワールド座標を得て計算するのに使用します。v[i].ToString());}SetInsetAndSizeFromParentEdge親オブジェクトのRectTransformの各種パラメータからできる矩形の1辺を基準にしてUGUIを変形させます。float型RectTransform.Edgeはenum型です。