Unity?UGUI的VerticalLayoutGroup垂直布局組件介紹使用
Unity UGUI的VerticalLayoutGroup(垂直布局)組件的介紹及使用
1. 什么是VerticalLayoutGroup組件?
VerticalLayoutGroup是Unity UGUI中的一種布局組件,用于在垂直方向上自動(dòng)排列子對(duì)象。它可以根據(jù)子對(duì)象的大小和布局設(shè)置,自動(dòng)調(diào)整子對(duì)象的位置和大小,實(shí)現(xiàn)垂直布局效果。
2. VerticalLayoutGroup組件的工作原理
VerticalLayoutGroup組件通過以下步驟實(shí)現(xiàn)垂直布局:
- 獲取所有子對(duì)象的RectTransform組件。
- 根據(jù)子對(duì)象的大小和布局設(shè)置,計(jì)算子對(duì)象的位置和大小。
- 調(diào)整子對(duì)象的位置和大小,使其按照垂直方向上的布局要求進(jìn)行排列。
3. VerticalLayoutGroup組件的常用屬性
- Padding:內(nèi)邊距,控制子對(duì)象與VerticalLayoutGroup之間的間距。
- Spacing:子對(duì)象之間的間距。
- Child Force Expand:子對(duì)象是否自動(dòng)擴(kuò)展以填充VerticalLayoutGroup的寬度。
- Child Control Height:子對(duì)象是否自動(dòng)調(diào)整高度以適應(yīng)VerticalLayoutGroup的高度。
- Child Alignment:子對(duì)象的對(duì)齊方式。
4. VerticalLayoutGroup組件的常用函數(shù)
- CalculateLayoutInputHorizontal():計(jì)算垂直布局的水平方向上的布局要求。
- CalculateLayoutInputVertical():計(jì)算垂直布局的垂直方向上的布局要求。
- SetLayoutHorizontal():設(shè)置垂直布局的水平方向上的布局。
- SetLayoutVertical():設(shè)置垂直布局的垂直方向上的布局。
5. 例子代碼
例子1:創(chuàng)建一個(gè)垂直布局的面板
using UnityEngine; using UnityEngine.UI; public class VerticalLayoutExample : MonoBehaviour { public VerticalLayoutGroup verticalLayoutGroup; private void Start() { verticalLayoutGroup.spacing = 10f; verticalLayoutGroup.childForceExpandWidth = false; verticalLayoutGroup.childForceExpandHeight = false; verticalLayoutGroup.childControlHeight = true; verticalLayoutGroup.childAlignment = TextAnchor.UpperCenter; } }
操作步驟:
- 創(chuàng)建一個(gè)空物體,并將VerticalLayoutGroup組件添加到該物體上。
- 將需要進(jìn)行垂直布局的子對(duì)象添加到VerticalLayoutGroup物體下。
- 將VerticalLayoutExample腳本添加到VerticalLayoutGroup物體上。
- 在Inspector面板中,將VerticalLayoutGroup的spacing設(shè)置為10,childForceExpandWidth和childForceExpandHeight設(shè)置為false,childControlHeight設(shè)置為true,childAlignment設(shè)置為UpperCenter。
例子2:動(dòng)態(tài)添加子對(duì)象
using UnityEngine; using UnityEngine.UI; public class AddChildExample : MonoBehaviour { public VerticalLayoutGroup verticalLayoutGroup; public GameObject childPrefab; private void Start() { for (int i = 0; i < 5; i++) { GameObject child = Instantiate(childPrefab, verticalLayoutGroup.transform); child.GetComponentInChildren<Text>().text = "Child " + (i + 1); } } }
操作步驟:
- 創(chuàng)建一個(gè)空物體,并將VerticalLayoutGroup組件添加到該物體上。
- 創(chuàng)建一個(gè)子對(duì)象的預(yù)制體,并將其賦值給AddChildExample腳本的childPrefab變量。
- 將AddChildExample腳本添加到空物體上。
- 在Inspector面板中,將VerticalLayoutGroup的spacing和其他布局設(shè)置進(jìn)行適當(dāng)調(diào)整。
例子3:動(dòng)態(tài)刪除子對(duì)象
using UnityEngine; using UnityEngine.UI; public class RemoveChildExample : MonoBehaviour { public VerticalLayoutGroup verticalLayoutGroup; private void Start() { for (int i = 0; i < verticalLayoutGroup.transform.childCount; i++) { Destroy(verticalLayoutGroup.transform.GetChild(i).gameObject); } } }
操作步驟:
- 創(chuàng)建一個(gè)空物體,并將VerticalLayoutGroup組件添加到該物體上。
- 將RemoveChildExample腳本添加到空物體上。
- 在Inspector面板中,將VerticalLayoutGroup的spacing和其他布局設(shè)置進(jìn)行適當(dāng)調(diào)整。
- 運(yùn)行游戲,所有子對(duì)象將被刪除。
例子4:動(dòng)態(tài)調(diào)整子對(duì)象的大小
using UnityEngine; using UnityEngine.UI; public class ResizeChildExample : MonoBehaviour { public VerticalLayoutGroup verticalLayoutGroup; private void Start() { for (int i = 0; i < verticalLayoutGroup.transform.childCount; i++) { RectTransform childRectTransform = verticalLayoutGroup.transform.GetChild(i).GetComponent<RectTransform>(); childRectTransform.sizeDelta = new Vector2(childRectTransform.sizeDelta.x, 100f); } } }
操作步驟:
- 創(chuàng)建一個(gè)空物體,并將VerticalLayoutGroup組件添加到該物體上。
- 將ResizeChildExample腳本添加到空物體上。
- 在Inspector面板中,將VerticalLayoutGroup的spacing和其他布局設(shè)置進(jìn)行適當(dāng)調(diào)整。
- 運(yùn)行游戲,所有子對(duì)象的高度將被調(diào)整為100。
例子5:動(dòng)態(tài)調(diào)整子對(duì)象的對(duì)齊方式
using UnityEngine; using UnityEngine.UI; public class AlignChildExample : MonoBehaviour { public VerticalLayoutGroup verticalLayoutGroup; private void Start() { verticalLayoutGroup.childAlignment = TextAnchor.MiddleCenter; } }
操作步驟:
- 創(chuàng)建一個(gè)空物體,并將VerticalLayoutGroup組件添加到該物體上。
- 將AlignChildExample腳本添加到空物體上。
- 在Inspector面板中,將VerticalLayoutGroup的spacing和其他布局設(shè)置進(jìn)行適當(dāng)調(diào)整。
- 運(yùn)行游戲,所有子對(duì)象的對(duì)齊方式將被調(diào)整為MiddleCenter。
注意事項(xiàng)
- VerticalLayoutGroup組件只能用于垂直布局,如果需要水平布局,請(qǐng)使用HorizontalLayoutGroup組件。
- 在使用VerticalLayoutGroup組件時(shí),確保子對(duì)象的RectTransform組件的錨點(diǎn)和位置設(shè)置正確,以便正確計(jì)算子對(duì)象的位置和大小。
參考資料
Unity官方文檔:VerticalLayoutGroup
Unity官方教程:Layout Groups
以上就是Unity UGUI的VerticalLayoutGroup垂直布局組件介紹使用的詳細(xì)內(nèi)容,更多關(guān)于Unity UGUI垂直布局組件的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章!
- Unity UGUI的ContentSizeFitter內(nèi)容尺寸適應(yīng)器組件使用示例
- Unity?UGUI的StandaloneInputModule標(biāo)準(zhǔn)輸入模塊組件使用示例
- Unity?UGUI的TouchInputModule觸摸輸入模塊組件介紹使用示例
- Unity UGUI的EventTrigger事件監(jiān)聽器組件介紹使用示例
- Unity UGUI Shadow陰影組件的介紹使用示例
- Unity?UGUI的GraphicRaycaster射線投射組件介紹使用
- Unity?UGUI的PointerEventData的介紹及使用
- Unity UGUI Button按鈕組件使用示例
相關(guān)文章
使用Deflate算法對(duì)文件進(jìn)行壓縮與解壓縮的方法詳解
本篇文章是對(duì)使用Deflate算法對(duì)文件進(jìn)行壓縮和解壓縮的方法進(jìn)行了詳細(xì)的分析介紹,需要的朋友參考下2013-06-06C#如何實(shí)現(xiàn)監(jiān)控手機(jī)屏幕(附源碼下載)
這篇文章主要介紹了C#如何實(shí)現(xiàn)監(jiān)控手機(jī)屏幕(附源碼下載),文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-10-10C#由當(dāng)前日期計(jì)算相應(yīng)的周一和周日的實(shí)例代碼
這篇文章介紹了C#由當(dāng)前日期計(jì)算相應(yīng)的周一和周日的實(shí)例代碼,有需要的朋友可以參考一下2013-09-09C#查詢SqlServer數(shù)據(jù)庫并返回單個(gè)值的方法
這篇文章主要介紹了C#查詢SqlServer數(shù)據(jù)庫并返回單個(gè)值的方法,涉及C#操作SQLServer數(shù)據(jù)庫查詢的相關(guān)技巧,需要的朋友可以參考下2015-06-06UGUI實(shí)現(xiàn)隨意調(diào)整Text中的字體間距
這篇文章主要為大家詳細(xì)介紹了UGUI實(shí)現(xiàn)隨意調(diào)整字體間距的方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-03-03C#/VB.NET實(shí)現(xiàn)PPT或PPTX轉(zhuǎn)換為圖像功能
由于大多數(shù)便攜式設(shè)備支持瀏覽圖片而不支持瀏覽PowerPoint 文件,所以相比較而言,圖像對(duì)于用戶而言更加友好。本文將利用C#/VB.NET實(shí)現(xiàn)PPT或PPTX轉(zhuǎn)換為圖像功能,需要的可以參考一下2022-08-08WPF實(shí)現(xiàn)類似ChatGPT逐字打印效果的示例代碼
前一段時(shí)間ChatGPT類的應(yīng)用十分火爆,這類應(yīng)用在回答用戶的問題時(shí)逐字打印輸出,像極了真人打字回復(fù)消息,本文就來利用WPF模擬一下這種逐字打印的效果吧2023-08-08C#通過標(biāo)簽軟件Bartender的ZPL命令打印條碼
這篇文章介紹了C#通過標(biāo)簽軟件Bartender的ZPL命令打印條碼,對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-01-01