Inspector Grid Information

Update #1 - 2024-05-25 11:34PM

After a few hours of trial and error I have finally finished the line gizmo I wanted to create for the grid in the inspector. The idea was to take the two points from the grid,(x1,y1) and (x2,y2), and draw a line that extends to the edge the of the screen as well as connects the two points, but do not extend past the area the camera can see. This way the two yellow endpoints would still be visible while in the Game view.

I accomplished this by drawing two lines that extended in opposite directions from one point to the other. The tricky part was trying to check if the endpoint was within the screen and if so, then using the slope to find a point further along the line until an edge is reached. Since the slope was a float and could sometimes be precise decimal numbers I couldn't simply take a point (x1,y1) and add or subtract the slope to get a new point, otherwise the line would sometimes snap to whole numbers when changing the graph. I fixed this by dividing the slope by 100 when finding the next point to check, which gave me an equation like point.x + (1 / mod) and point.y - (Mathf.Abs(slope) / mod) where mod is equal to 100. I then just had to check whether I wanted to draw up the line or down, in order to give me two lines to make a whole.

Update #2 - 2024-05-26 3:55AM

After a bit of a break, and some time working to make my life a little easier, I have turned the grid visual element into a custom control so I can reuse it for other UI in my projects. The goal being to clean up the code and create my first package for the Unity Asset Store. I have to learn the process one way or another so now is as good a time as any. I started by making a new UIDocument in order to clone the asset for use later.

It took plenty of re-watching other creators YouTube videos and a bit of trial and error but I eventually got the grid to a point where I can drag and drop it into different UXML documents. I think I'll still have to do some initialization or setup but at least for now it's appearing as expected.

https://video.wixstatic.com/video/7d8d28_28ad674515f94cf29816e99d7eef6c50/1080p/mp4/file.mp4

Update #3 2024-05-26 11:57AM

I have lunch plans with family soon so I decided to work on something small and easily achievable. It's nice to start the day off on a little victory. Since I don't know how much time I'll have to work on projects today, I decided to create a simple toggle in the inspector to show or hide the drawing of the line gizmo. It's just bool value bound to a toggle element, you can see it in action below.