top of page

013-Serialized Object and Serialized Property Exercise

1.1 Exercise 1

1. Open Folder 13 from the project folder

2. Here we have a car MyCar013 script

3. Tasks:

- Design an custom editor script for the class and call it as MyCar013Editor

- Make sure to draw all the properties using the serializedproperties 

- Make sure that the health  stays between 0 and 100

- Make sure that the carAge stays between 0 and 70.

(Hint: try figuring out the last two parts on your own)

1.2 Exercise 1 Solution

2. Let us open up the MyCar013 script and take a look at its content

image.png
1.3 Custom Editor for MyCar013

1. First let us make a custom editor for MyCar013 and call it as MyCar013Editor.

2. Make sure that this inherits from Editor and has CustomEditor attribute on top of it pointing to MyCar013 script.

3. Let us override the OnInspectorGUI() method and this time we will not use the base.OnInspectorGUI() to draw the default inspector.

4. Make sure to use [CanEditMultipleObjects] attribute to allow multi object editing.

image.png
image.png
1.4 Making SerializedObjects and SerializedProperties

1. Now we are going to be making serializedProperties and make them point to MyCar013 class using serializedObject.

2. We will use OnEnable() method to point the reference to the properties whenever the inspector is selected.

image.png
image.png

4. Currently none of the property is getting drawn.

5. To draw them let use EditorGUILayout.PropertyField() method to draw these properties.

6. Make sure to use serializedObject.Update() at the start and serializedObject.ApplyModifiedProperties() at the end to make sure the changes are applied.

​

image.png
image.png
1.5 Clamping Values

1. Currenlty values are not getting clamped. 

2. To perform clamping operation let us get the value of carAge and health and then clamp them.

3. We can get int and float values from serializedProperty itself by doing 

serializedProperty.floatvalue or serializedProperty.intValue.

image.png
image.png

Now our health and carAge value are getting clamped. We can also use a custom drawn slider about which we will learn in future tutorials

1.6 Exercise-2 Drawing gun

1. We have a gun class  class MyGun013 which has properties related to gun and its settings.

2. Design an editor with a toggle that toggles between its properties and its settings.

1.6 Exercise-2 Solution

1. Let us open the MyGun013 script and take a look at its member variables.

image.png
image.png

2. Let us now make a custom editor for this script and call it as MyGun013Editor.

3. Make this inherit from Editor and let us make it point to MyGun013 using CustomEditor attribute.

4. Add OnInspectorGUI() method and make it blank so it doesn't draw anything.

image.png
image.png
1.7 Drawing Custom Editor

1. Let us get reference to the variables of MyGun013 using serializedobject and serializedProperties in the custom editor as soon as the custom editor is enabled.

image.png

2. To draw them in the inspector use EditorGUILayout.PropertyField() method to draw them

3. To draw them correctly use serializedObject.Update() before all properties and serializedObject.ApplyModifiedProperties() after all the fields for the given serializedObject.

End

Kindly support me through my Patreon account if you find these tutorials useful. Feel free to connect with me on Twitter. This support enables me to create more educational content.

bottom of page