【第一章编辑器开发基础第二节编辑器布局_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();
    }
}
相关推荐
huangfuyk21 小时前
前端使用Cursor编辑器方面遇到的问题及注意细节
前端·编辑器·ai编程·cursor
Codiggerworld1 天前
Neovim vs Vim:该不该“跳槽”?
编辑器·vim·跳槽
权、狐妖2 天前
【Vscode安装ESlint插件、下载ESLint包以及他们之间的关系和使用】
ide·vscode·编辑器
摇滚侠2 天前
VScode 需要安装的插件和修改的设置
ide·vscode·编辑器
Molesidy2 天前
【VSCode】VSCode+Claude Code插件+DeepSeek API Key的环境搭建
ide·vscode·编辑器·deepseek·claude code
☆MOON2 天前
Microsoft Visual Studio快捷键大全
编辑器
小贺儿开发3 天前
Unity UGUI 可视化热区编辑与交互系统
unity·编辑器·游戏引擎·交互·工具·适配·ugui
我命由我123453 天前
VSCode - VSCode 自定义折叠区域
前端·javascript·ide·vscode·前端框架·编辑器·js
π同学3 天前
ESP-IDF+vscode开发ESP32第十四讲——UHCI
ide·vscode·编辑器
纪伊路上盛名在3 天前
Vscode LLM备用方案
ide·vscode·编辑器