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

间距控制

​​用途​​:精确控制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();
    }
}
相关推荐
bryant_meng2 小时前
【VSCode】Visual Studio Code
ide·vscode·编辑器·ssh·debug
wulaladamowang15 小时前
日常踩雷系列-vscode无法输入中文
ide·vscode·编辑器
徐归阳1 天前
DevEco Studio安装
编辑器·harmonyos
HBR666_1 天前
AI编辑器(FIM补全,AI扩写)简介
前端·ai·编辑器·fim·tiptap
夫唯不争,故无尤也2 天前
安装好vscode后,缺少vscode打开文件或文件夹选项
ide·vscode·编辑器
‍。。。2 天前
vscode 一键导出导入所有插件
ide·vscode·编辑器
Strinkin_2 天前
Windows11配置MSYS2+vscode+cpp+cmake环境
ide·vscode·编辑器
加油_Yeah2 天前
cursor使用之没有正常的编辑器中的运行箭头
编辑器·cursor
HBR666_2 天前
AI编辑器(二) ---调用模型的fim功能
前端·ai·编辑器·fim·tiptap
馨谙2 天前
vim保姆级使用,操作详解,快捷键大全总结
linux·编辑器·vim