【第一章编辑器开发基础第二节编辑器布局_1水平与垂直布局(1/4)】

基本布局系统(水平与垂直布局)

​​用途​​:控制UI元素排列

​​核心类​​:GUILayout

​​调用位置​​:OnInspectorGUI()

​​布局容器​​:

csharp 复制代码
GUILayout.BeginHorizontal(); // 开始水平布局
GUILayout.BeginVertical();   // 开始垂直布局
// ... UI元素 ...
GUILayout.EndHorizontal();   // 必须成对结束
GUILayout.EndVertical();
​​经典嵌套布局​​:

GUILayout.BeginHorizontal();

GUILayout.BeginVertical();
GUILayout.Button("左列按钮1");
GUILayout.Button("左列按钮2");
GUILayout.EndVertical();

GUILayout.BeginVertical();
GUILayout.Button("右列按钮1");
GUILayout.Button("右列按钮2");
GUILayout.EndVertical();

GUILayout.EndHorizontal();

​​黄金法则​​:

Begin/End必须严格配对

嵌套不得超过8层(Unity限制)

垂直和水平布局可自由组合

示例代码和效果图

csharp 复制代码
using UnityEngine;
using UnityEditor;

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


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

        // 2. 依次绘制各种自定义控件

        Layout();      // 基本布局示例

      
    }




    // ================= 8. 基本布局示例 =================
    private void Layout()
    {
        // 主水平布局
        GUILayout.BeginHorizontal();

        // 左侧垂直布局
        GUILayout.BeginVertical();
        GUILayout.Button("btn1");
        GUILayout.Button("btn2");
        GUILayout.EndVertical();

        // 右侧垂直布局
        GUILayout.BeginVertical();
        GUILayout.Button("btn3");
        GUILayout.Button("btn4");
        GUILayout.EndVertical();

        GUILayout.EndHorizontal(); // 结束主水平布局
    }


}
相关推荐
guslegend15 小时前
第2节:AI编辑器底层技术全景导览
人工智能·编辑器
OliverH-yishuihan20 小时前
【保姆级教程】Win11 下从零部署 Claude Code:本地环境配置 + VSCode 可视化界面全流程指南
ide·vscode·编辑器
TakeForge20 小时前
17天跑通交通行业SVG编辑器
编辑器
键盘飞行员21 小时前
macOS Trae 解决 Codex 插件不显示问题(官方适配版)
macos·编辑器·ai编程
Cloud_Shy6181 天前
解读《Effective Python 3rd Edition》:从练气到老魔(第二章 Item 10 - 12)
c语言·开发语言·网络·人工智能·windows·python·编辑器
木古古181 天前
搞一个高效的c/c++开发环境,工具VIm+自研vim插件+Shell脚本
linux·编辑器·vim
knighthood20011 天前
vscode插件开发的一些过程
ide·vscode·编辑器
小炉子的修炼手册2 天前
【配置Agent】VScode+claude code+codex+deepseek
ide·vscode·编辑器
knighthood20012 天前
vscode扩展中vscode版本号该如何填写?
ide·vscode·编辑器
互联网散修2 天前
鸿蒙实战:图片编辑器——高性能纹理马赛克画笔
华为·编辑器·harmonyos·纹理马赛克