【第一章编辑器开发基础第二节编辑器布局_3间距控制（4/4）】

死也不注释2025-07-15 10:56

间距控制

用途：精确控制UI元素间隔

核心类：GUILayout

调用位置：布局容器内

两种空间类型：

csharp 复制代码

// 1. 固定像素间距
GUILayout.Space(20f); // 20像素间隔

// 2. 弹性填充空间
GUILayout.FlexibleSpace();
经典布局应用：

// 左右按钮居中布局
GUILayout.BeginHorizontal();
GUILayout.FlexibleSpace(); // 左侧弹性空间
GUILayout.Button("确定");
GUILayout.Space(10);       // 固定间距
GUILayout.Button("取消");
GUILayout.FlexibleSpace(); // 右侧弹性空间
GUILayout.EndHorizontal();

// 底部按钮固定
GUILayout.BeginVertical();
// ... 主内容 ...
GUILayout.FlexibleSpace(); // 压到最下方
GUILayout.Button("提交");
GUILayout.EndVertical();

经验原则：

FlexibleSpace会占用所有可用空间

多个Space会线性累计

适用于按钮组对齐等精细布局

示例代码和效果图

csharp 复制代码

using UnityEngine;
using UnityEditor;

/// <summary>
/// 创建自定义编辑器，作用于Example组件
/// </summary>
[CustomEditor(typeof(Example))]
public class ExampleEditor : Editor
{
    

    // ================= 核心方法 - 绘制编辑器界面 =================
    public override void OnInspectorGUI()
    {
        // 1. 先绘制默认Inspector内容
        base.OnInspectorGUI();

        // 2. 依次绘制各种自定义控件
        Space();       // 间距控制

      
    }



    // ================= 10. 间距控制 =================
    private void Space()
    {
        // 水平布局中的固定间距
        GUILayout.BeginHorizontal();
        GUILayout.Button("btn1", GUILayout.Width(80f));
        GUILayout.Space(100f); // 100像素的水平间距
        GUILayout.Button("btn2", GUILayout.Width(80f));
        GUILayout.EndHorizontal();

        // 垂直布局中的弹性间距
        GUILayout.BeginVertical();
        GUILayout.Button("btn3", GUILayout.Width(80f)); // 顶部按钮

        /*
        弹性空间说明：
        1. btn3会固定在顶部
        2. FlexibleSpace会占据所有剩余垂直空间
        3. btn4会固定在底部
        */
        GUILayout.FlexibleSpace();

        GUILayout.Button("btn4", GUILayout.Width(80f)); // 底部按钮
        GUILayout.EndVertical();
    }
}