Unity Custom Inspectors Tutorial: Getting Started

In this tutorial you will learn how to create Custom Inspectors in the Unity Editor. From editing how your components look, to adding Editor windows :] By Gur Raunaq Singh.

Leave a rating/review
Download materials
Save for later
Share

Introduction

Unity is an amazing game engine that’s been on top of the game for a little more than a decade.
It’s welcoming enough that students and indie game developers use it for learning the basics and working on small projects, yet it’s packed with enough features that full-fledged game studios use it too.

If you have been working with Unity for any amount of time or have worked on large Unity projects, you’ve no doubt realized how cumbersome it is when you have to perform repetitive tasks.

Something as simple as calling PlayerPrefs.DeleteAll() requires you to run the scene, which could take a couple of seconds when you’re working on a large scene that takes a while to load all the assets.

Even when you look for a 3rd-party tool in the Asset Store, either you can’t find something that’s within your budget, or the solution for your particular use case doesn’t exist.

It’s for these specific reasons, along with many others, that Unity comes with an Editor Scripting API. With the Unity Editor Scripting API, users can extend the capabilities of the editor by building tools and utilities as per their requirements.

Simply put, you can write an Editor Script that uses methods from the UnityEditor namespace to create or modify custom functionalities to the Unity editor according to your requirements.

There are many advantages to knowing the basics of editor scripting:

  • As the size and complexity of your project increases, you would want a way to manage the huge amount of information that’s displayed in the Inspector.
  • You might want to execute a part of the code without having to run a scene every few minutes.
  • You may want to give the designers a way to add or modify the assets that are manually integrated within the code.

In all these cases, having basic knowledge of editor scripting can save you and your team a lot of time and money!

The point is, as a developer, it’s good practice to know all of the various tools at your disposal that can help improve your workflow. Being able to modify an action so that the time spent doing it reduces from 20 seconds to 5 seconds can save you many hours during the entire development process.

Getting Started

Requirements

You’ll need Unity version 2018.2.10f1 or newer to load the starter project successfully. In case you don’t have it installed on your system, you can download it from unity3d.com.

This tutorial is intended for users who have basic scripting knowledge and are comfortable with the editor. If you’re new to Unity, you can review our beginner tutorials at https://www.raywenderlich.com/unity.

Once you have everything set up, Download the starter project using the “Download Materials” link at the top or bottom or this tutorial, and open the Starter Project folder with Unity.

Exploring starter Project

Look at the folder structure in the Project window.

The folders inside Assets \ RW contain the following:

  • Audio: Music and sound files for the project are kept here.
  • Editor: Scripts for Customizing the editor. This folder has a special meaning in the Unity editor; the scripts contained here are treated as editor scripts rather than runtime scripts, therefore are not available in builds at runtime.
  • Materials: The materials required for this tutorial.
  • Models: The models required for this tutorial.
  • Prefabs: The prefabs for the Main scene.
  • Scenes: The Main scene.
  • Scripts: The TankController script.
  • Sprites: The sprites used by the prefabs in this tutorial.
  • Textures: Contains the main textures for the project.

Open the Main scene from the Scenes folder.

Say you’re working on a reasonably complex 3D game with a few prefabs, with basic mechanics but a lot of variety concerning the design of the level. You might have a scene that looks something like this.

All of the logic for the current scene is in the TankController.cs script and is attached to Tank, which you can select from the Hierarchy window.

With Tank selected, look at the Inspector. You’ll see the following:

Notice there are a lot of public variables. All of this looks fine, but as your project gets bigger and more complex, the Inspector looks messy, and it’s more difficult to jump from one variable to another.

Being able to organize how Unity displays these items can help improve your overall workflow.

Basic Customizations

The CoreModule namespace implements basic classes that are used by the Unity editor. You can also use these same classes to create your own custom Inspector.

Up next, you’ll learn about some of these attributes and how they’ll help improve the look of your Inspector.

Header Attribute

When you have a lot of public fields in a script, you want a way to separate them. The HeaderAttribute allows you to display some bold text that works as a header so that you easily distinguish different groups of public fields in the Inspector.

Open the TankController.cs script in the Assets \ RW \ Scripts folder.

You can add a HeaderAttribute by adding [Header(“Header Text”)] right above the variable declaration.

Add the following Header Attributes after the given line comment numbers:

//1. 
[Header("Level Props")]

//2. 
[Header("Tank Movement")]

//7. 
[Header("Tank Shooting")]

//10. 
[Header("Tank Health")]

//16. 
[Header("Audio")]

Save your changes and look at the Inspector again.

You can already see how much better this looks.

Range Attribute

If you look at the Inspector window again, you’ll see that there are some public fields that store numerical values: Integers and Floats.

Most of the time during development, you have to fiddle with these values more than once, and using the default method (typing a new value and pressing Enter) gets cumbersome after a while.

The Range attribute converts a public field into a slider, which you can easily interact with using your mouse. It also lets you set a lower and upper bound to the values that you can assign for a specific variable.

Ready to try it out?

Add the Range Attributes after the respective line comment numbers in TankController.cs.

//3.
[Range(5f, 50f)]

//4.
[Range(90f, 150f)]

//5.
[Range(5f, 50f)]

//8.
[Range(1000f, 2000f)]

//11.
[Range(20f, 200f)]

Save the script, and take another look at the Inspector.

Not only are the numeric fields easy to distinguish from other public fields, but you can now modify their values within the user-specified limit.

Gur Raunaq Singh

Contributors

Gur Raunaq Singh

Author and Author

Ben MacKinnon

Tech Editor

Luke Freeman

Illustrator

Sean Duffy

Final Pass Editor

Over 300 content creators. Join our team.