【Unity】Inspector排版扩展学习初探

一、简单的Unity Inspector扩展

[SerializeField]

SerializeField\] 作用:让private属性也可以显示在面板上 ### \[Range(x , y)

Range(x , y)\] 作用: 让参数从输入框变为范围滑条 ### \[Header(" 标题 ")

Header(" 标题 ")\]作用:在属性前面加上标题 ### \[Tooltip(" 解释")

Tooltip(" 解释")\]作用: 在鼠标停留在属性名上时显示解释 ### \[TextArea(a ,b)

TextArea(a ,b)\]作用: 让文本输入框可以输入不止1行,为最小a行,最大b行 ### \[Space(N)

Space(N)\]作用:控制两个属性在Inspector面板上显示的间隔大小N ### \[HideInInspector

HideInInspector\] 作用: 让public属性不会显示在面板上 以上可以满足基本需求,但更复杂的排版需要代码实现,需要扩展Editor类。 ## 二、使用IMGUI框架扩展 ### 1.添加参数 扩展的Editor类必须放在Editor文件夹 ![](https://img-blog.csdnimg.cn/direct/ffb6184867e942919163c7378a9c0944.png) 然后在脚本中使用UnityEditor,并且继承Editor类,同时在初始需要写\[CustomEditor(typeof(Class))\],来指明是为哪个脚本添加的扩展 ![](https://img-blog.csdnimg.cn/direct/d1d2ce22dab54f1e84d7086701e93959.png) 在IMGUI框架下,我们需要覆盖OnInspectorGUI()来实现扩展。 ![](https://img-blog.csdnimg.cn/direct/71113f6bcd054e749b6247d21abe6f61.png) 如图所示,在覆盖时会自动调用父类的方法OnInspectorGUI,如果去掉该方法则原脚本则不会有任何属性显示。 ![](https://img-blog.csdnimg.cn/direct/da8b7ee9eecd43b0b04777d7998e3bc6.png) 我们先定义一个2D纹理,然后调用ObjectField函数,输入名称,值等信息。 该函数返回值是一个Object所以在前面加上强制转换。然后就可以看到原脚本的面板上有了新的属性。 ![](https://img-blog.csdnimg.cn/direct/3f7ea35e19134e8493c20c2d78f20cf6.png) ### 2.添加按钮\&调整样式 我们还可以添加按钮: ![](https://img-blog.csdnimg.cn/direct/3f762fc4365842e8a91c80276a3ae93a.png) GUILayout.Button用来添加按钮,如果按钮被点击,则该方法会返回一个True。如下图所示。 ![](https://img-blog.csdnimg.cn/direct/ed7174f80f694645a0eaeb0af6c9dd27.png) IMGUI框架也可以调整样式,如下图,为按钮添加高度参数,可以让按钮变大。 ![](https://img-blog.csdnimg.cn/direct/cdb76fe1d07540d4a4a4c882ad7fe94d.png) ![](https://img-blog.csdnimg.cn/direct/67c2f855cfe940dbaf6a0ed90505e8ae.png) ## 三、使用UI Elements扩展 ![](https://img-blog.csdnimg.cn/direct/ce2f9e3864dc44c78222ccc490301d39.png) 使用UI Elements框架需要添加相应的命名空间。 ![](https://img-blog.csdnimg.cn/direct/73ff801cfe644744bc15b2b210e0d1c1.png) 同样的覆盖父类的方法,如上图。此时返回Unity窗口,我们发现我们原本脚本的之前用IMGUI框架添加的属性全部消失了。原因是当CreateInspectorGUI的返回值不为空的时候,它的优先级是最高的,所以无视了之前IMGUI框架下的方法。 其中VisualElement是该框架下最基本的显示对象,可以添加最基本的任何其它子显示对象。 ### 1.添加参数 ![](https://img-blog.csdnimg.cn/direct/e6beab2719d64dd3a5a679da2ad7c785.png) 以上三行代码显示了如何像IMGUI框架一样为原脚本添加一个纹理的参数。 ![](https://img-blog.csdnimg.cn/direct/28b5d93a3dc14b9d881f89c3ace109d4.png) ### 2.添加按钮\&调整样式 接着我们添加一个按钮,如下图代码所示,我们可以为按钮设置相应的调用方法。 ![](https://img-blog.csdnimg.cn/direct/7a04617a6434432d94fcf0faac078134.png) 可以看到,按下按钮后,打印出了相应的字符串。 ![](https://img-blog.csdnimg.cn/direct/21acf42df14944058590030adabb5afa.png) 我们同样可以用Button.style.height来更改样式高度,如下图所示。 ![](https://img-blog.csdnimg.cn/direct/301a0c78720c476fba2ee1fadbfd4e67.png) ![](https://img-blog.csdnimg.cn/direct/01768b40b1474d0586fd9ceb95d10ad6.png) ### 3.注册回调 我们还可以检测属性注册来执行回调自定方法,如下图所示。 ![](https://img-blog.csdnimg.cn/direct/e99d6316e1aa4061a83919dd48a32205.png) 可以看到,当我们指定了一张纹理后,回调函数被调用,打印出了字符串。![](https://img-blog.csdnimg.cn/direct/8cf6be49ffef44c3be38d0b7a76e219f.png) ![](https://img-blog.csdnimg.cn/direct/f8e53a36ccee45f8be1c505dfca4b0c6.png) 如果我们想对更改后的纹理或其他属性做一些操作,如打印新纹理的名字,那么要在回调函数中执行如上图所示。 ### 4.调用原脚本方法 那么如果我们想在扩展脚本里调用原脚本的函数该怎么办呢?比如按下按钮,调用原脚本的函数。我们先在原脚本中写一个函数,打印一个字符串。 ![](https://img-blog.csdnimg.cn/direct/ec1e69934ce745cc8f429e1d3a883564.png) 然后在扩展Editor的脚本里更改按下按钮的方法,这里把原来的打印注释掉。 ![](https://img-blog.csdnimg.cn/direct/a0ae32eef98c4e1eab4311d76ac52872.png) Unity提供了target指向原来的脚本。当然我们需要把它强制转换成原脚本的类。然后调用即可。如上图所示。 ![](https://img-blog.csdnimg.cn/direct/2d6252364f4946a6ab656e881d1ec58f.png) 按下按钮,可以看到,打印成功了。

相关推荐
qq_428639612 小时前
虚幻基础:安装插件
游戏引擎·虚幻
qq 180809514 小时前
从零构建一个多目标多传感器融合跟踪器
unity
平行云5 小时前
实时云渲染支持在网页上运行UE5开发的3A大作Lyra项目
unity·云原生·ue5·webgl·虚拟现实·实时云渲染·像素流送
AA陈超5 小时前
虚幻引擎5 GAS开发俯视角RPG游戏 P07-18.生成火球术
c++·游戏·ue5·游戏引擎·虚幻
鹏飞于天5 小时前
Shader compiler initialization error: Failed to read D3DCompiler DLL file
unity
wonder135797 小时前
UGUI重建流程和优化
unity·游戏开发·ugui
Doc.S9 小时前
多无人机任务自定义(基于ZJU-FAST-Lab / EGO-Planner-v2)
游戏引擎·无人机·cocos2d
那个村的李富贵11 小时前
Unity打包Webgl后 本地运行测试
unity·webgl
nnsix12 小时前
Unity OpenXR开发HTC Vive Cosmos
unity·游戏引擎
nnsix12 小时前
Unity OpenXR,扳机键交互UI时,必须按下扳机才触发
unity·游戏引擎