Question How to draw a grid inside custom Editor?

I'm trying to draw a grid of black squares inside custom editor script. The thing is, all my grid cells are too close to each other even though I tried to simulate padding between them.



Code:

Code (CSharp):

1.  
2. using UnityEditor;
3. using UnityEngine;
4.  
5. [CustomEditor(typeof(Pattern))]
6. public class PatternEditor : Editor
7. {
8.     private int gridSize = 10;
9.     private float cellSize = 7f;
10.  
11.     public override void OnInspectorGUI()
12.     {
13.         serializedObject.Update();
14.  
15.         for (int r = 0; r < gridSize; r++)
16.         {
17.             for (int c = 0; c < gridSize; c++)
18.             {
19.                 EditorGUI.DrawRect(new Rect(c * cellSize + 10f, r * cellSize + 10f, cellSize, cellSize), Random.ColorHSV());
20.             }
21.         }
22.  
23.         serializedObject.ApplyModifiedProperties();
24.     }
25.    
26. }
27.  
28.  

What am I missing?

 

I think you'll want to use something like GUILayoutUtility.GetRect within a GUILayout.BeginHorizontal to get and draw a bunch of rects in a row.

 

Mind providing an example? I can't get it working.

 

As far as I can tell from the code you're not adding any padding in there - you're only adding margin to the entire area. The +10 will be a constant 10 offset to all squares.
If you want to add padding you'll need your X and Y positions to be different to your Width And Height, something like

Code (CSharp):

1.  
2.         float margin = 10.0f;
3.         float padding = 2.0f;
4.  
5.         for (int row = 0; row < gridSize; row++)
6.         {
7.             for (int column = 0; column < gridSize; column++)
8.             {
9.                 float x = column * ( cellSize + padding ) + margin;
10.                 float y = row * ( cellSize + padding ) + margin;
11.  
12.                 EditorGUI.DrawRect( new Rect( x, y, cellSize, cellSize ), Random.ColorHSV() );
13.             }
14.         }
15.  

So you could trace the values and see that
When Column=0, X = 0 * ( 7 + 2 ) = 0, Cell is between 0 and 7
When Column=1, X = 1 * ( 7 + 2 ) = 9, Cell is between 9 and 16
When Column=3, X = 2 * ( 7 + 2 ) = 18, Cell is between 18 and 25
etc.
And you can tell that each cell begins padding distance away from where the previous cell ended.

 

Oh, that's a silly mistake of mine. Thanks for pointing out