Unity UGUI的GridLayoutGroup网格布局组件使用详解

 更新时间:2023年07月11日 09:29:48   作者:AlianBlank  
这篇文章主要介绍了Unity UGUI的GridLayoutGroup网格布局组件使用详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪

1. 什么是GridLayoutGroup组件?

GridLayoutGroup是Unity UGUI中的一种布局组件,用于在UI界面中创建网格布局。

它可以根据指定的行数、列数和间距自动排列子物体,使它们按照网格的形式排列。

2. GridLayoutGroup的工作原理

GridLayoutGroup组件会根据指定的行数和列数,将子物体按照从左到右、从上到下的顺序排列。

它还可以设置间距,控制子物体之间的间隔。

当子物体的数量超过网格的容量时,GridLayoutGroup会自动创建新的行或列来容纳多余的子物体。

3. GridLayoutGroup的常用属性

  • Cell Size:指定每个单元格的大小。
  • Spacing:指定子物体之间的间距。
  • Start Corner:指定网格的起始角落。
  • Start Axis:指定网格的起始轴线。
  • Constraint:指定网格的约束方式,可以是按行约束或按列约束。
  • Constraint Count:指定每行或每列的最大子物体数量。

4. GridLayoutGroup的常用函数

  • CalculateLayoutInputHorizontal():计算水平方向上的布局。
  • CalculateLayoutInputVertical():计算垂直方向上的布局。
  • SetLayoutHorizontal():设置水平方向上的布局。
  • SetLayoutVertical():设置垂直方向上的布局。

5. 示例代码

示例1:创建一个2x2的网格布局

using UnityEngine;
using UnityEngine.UI;
public class GridLayoutExample : MonoBehaviour
{
    public GridLayoutGroup gridLayout;
    public GameObject prefab;
    void Start()
    {
        gridLayout.constraint = GridLayoutGroup.Constraint.FixedColumnCount;
        gridLayout.constraintCount = 2;
        for (int i = 0; i < 4; i++)
        {
            Instantiate(prefab, transform);
        }
    }
}

操作步骤:

  • 创建一个空的GameObject,并将GridLayoutExample脚本挂载上去。
  • 在Inspector面板中,将GridLayoutGroup组件拖拽到gridLayout变量上。
  • 创建一个预制体,将其拖拽到prefab变量上。
  • 运行游戏,可以看到预制体按照2x2的网格布局排列。

注意事项:

  • 需要提前创建好预制体,并将其拖拽到prefab变量上。

示例2:创建一个3x3的网格布局,并设置间距

using UnityEngine;
using UnityEngine.UI;
public class GridLayoutExample : MonoBehaviour
{
    public GridLayoutGroup gridLayout;
    public GameObject prefab;
    void Start()
    {
        gridLayout.constraint = GridLayoutGroup.Constraint.FixedColumnCount;
        gridLayout.constraintCount = 3;
        gridLayout.spacing = new Vector2(10, 10);
        for (int i = 0; i < 9; i++)
        {
            Instantiate(prefab, transform);
        }
    }
}

操作步骤:

  • 创建一个空的GameObject,并将GridLayoutExample脚本挂载上去。
  • 在Inspector面板中,将GridLayoutGroup组件拖拽到gridLayout变量上。
  • 创建一个预制体,将其拖拽到prefab变量上。
  • 运行游戏,可以看到预制体按照3x3的网格布局排列,并且有间距。

注意事项:

  • 需要提前创建好预制体,并将其拖拽到prefab变量上。

示例3:创建一个自适应的网格布局

using UnityEngine;
using UnityEngine.UI;
public class GridLayoutExample : MonoBehaviour
{
    public GridLayoutGroup gridLayout;
    public GameObject prefab;
    void Start()
    {
        gridLayout.constraint = GridLayoutGroup.Constraint.Flexible;
        gridLayout.spacing = new Vector2(10, 10);
        for (int i = 0; i < 10; i++)
        {
            Instantiate(prefab, transform);
        }
    }
}

操作步骤:

  • 创建一个空的GameObject,并将GridLayoutExample脚本挂载上去。
  • 在Inspector面板中,将GridLayoutGroup组件拖拽到gridLayout变量上。
  • 创建一个预制体,将其拖拽到prefab变量上。
  • 运行游戏,可以看到预制体按照自适应的网格布局排列,并且有间距。

注意事项:

  • 需要提前创建好预制体,并将其拖拽到prefab变量上。

示例4:动态改变网格布局的行数和列数

using UnityEngine;
using UnityEngine.UI;
public class GridLayoutExample : MonoBehaviour
{
    public GridLayoutGroup gridLayout;
    public GameObject prefab;
    void Start()
    {
        gridLayout.constraint = GridLayoutGroup.Constraint.FixedRowCount;
        gridLayout.constraintCount = 2;
        for (int i = 0; i < 4; i++)
        {
            Instantiate(prefab, transform);
        }
        Invoke("ChangeConstraintCount", 3f);
    }
    void ChangeConstraintCount()
    {
        gridLayout.constraintCount = 3;
    }
}

操作步骤:

  • 创建一个空的GameObject,并将GridLayoutExample脚本挂载上去。
  • 在Inspector面板中,将GridLayoutGroup组件拖拽到gridLayout变量上。
  • 创建一个预制体,将其拖拽到prefab变量上。
  • 运行游戏,可以看到预制体按照2x2的网格布局排列。
  • 3秒后,网格布局的列数会变为3,预制体会按照3x2的网格布局排列。

注意事项:

  • 需要提前创建好预制体,并将其拖拽到prefab变量上。

示例5:动态改变网格布局的间距

using UnityEngine;
using UnityEngine.UI;
public class GridLayoutExample : MonoBehaviour
{
    public GridLayoutGroup gridLayout;
    public GameObject prefab;
    void Start()
    {
        gridLayout.constraint = GridLayoutGroup.Constraint.FixedColumnCount;
        gridLayout.constraintCount = 2;
        gridLayout.spacing = new Vector2(10, 10);
        for (int i = 0; i < 4; i++)
        {
            Instantiate(prefab, transform);
        }
        Invoke("ChangeSpacing", 3f);
    }
    void ChangeSpacing()
    {
        gridLayout.spacing = new Vector2(20, 20);
    }
}

操作步骤:

  • 创建一个空的GameObject,并将GridLayoutExample脚本挂载上去。
  • 在Inspector面板中,将GridLayoutGroup组件拖拽到gridLayout变量上。
  • 创建一个预制体,将其拖拽到prefab变量上。
  • 运行游戏,可以看到预制体按照2x2的网格布局排列,并且有间距。
  • 3秒后,网格布局的间距会变为(20, 20),预制体会按照2x2的网格布局排列,并且间距变大。

注意事项:

  • 需要提前创建好预制体,并将其拖拽到prefab变量上。

参考资料

以上就是Unity UGUI的GridLayoutGroup网格布局组件使用详解的详细内容,更多关于Unity UGUI GridLayoutGroup的资料请关注脚本之家其它相关文章!

相关文章

  • C#实现的json序列化和反序列化代码实例

    C#实现的json序列化和反序列化代码实例

    这篇文章主要介绍了C#实现的json序列化和反序列化代码实例,本文讲解了两种实现方法,并直接给出代码示例,需要的朋友可以参考下
    2015-06-06
  • C#检查指定对象是否存在于ArrayList集合中的方法

    C#检查指定对象是否存在于ArrayList集合中的方法

    这篇文章主要介绍了C#检查指定对象是否存在于ArrayList集合中的方法,涉及C#中Contains方法的使用技巧,需要的朋友可以参考下
    2015-04-04
  • 基于WPF实现绘制地铁路线图

    基于WPF实现绘制地铁路线图

    经常坐地铁,却不知道地铁多少条线路?哪个站下车?本文就来带大家利用WPF绘制深圳地铁路线图,从而带大家掌握WPF在图形绘制方面的一些知识,希望对大家有所帮助
    2023-06-06
  • C#条件编译、内联函数、CLS介绍

    C#条件编译、内联函数、CLS介绍

    这篇文章介绍了C#的条件编译、内联函数、CLS,文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-03-03
  • Unity ScrollRect实现轨迹滑动效果

    Unity ScrollRect实现轨迹滑动效果

    这篇文章主要为大家详细介绍了Unity ScrollRect实现轨迹滑动效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-09-09
  • C#实现验证字符串的长度的方法详解

    C#实现验证字符串的长度的方法详解

    这篇文章主要为大家详细介绍了C#如何使用正则表达或者计算字符数组长度或字符串的长度来验证验证字符串的长度,感兴趣的小伙伴可以学习一下
    2024-02-02
  • C#难点逐个击破(5):类的访问类型

    C#难点逐个击破(5):类的访问类型

    类的访问类型有时也叫访问级别,使用以下访问修改符:Public、Protected、Private、internal、protected internal。
    2010-02-02
  • C#实现餐饮管理系统完整版

    C#实现餐饮管理系统完整版

    这篇文章主要为大家详细介绍了C#实现餐饮管理系统的完整版,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-01-01
  • C#控制台程序中使用官方依赖注入的实现

    C#控制台程序中使用官方依赖注入的实现

    这篇文章主要介绍了C#控制台程序中使用官方依赖注入的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-04-04
  • C#中foreach实现原理详解

    C#中foreach实现原理详解

    这篇文章主要为大家详细介绍了C#中foreach实现原理,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-09-09

最新评论