With the current focus on cleaning up old logic and planning for the game Alpha, the game UI is generally the first on the list because it is the first viewable window into the game. Navigating a proper UI is more satisfying and easy to work with than something not yet ready for real-world usage.
To get the UI to work in the way it is intended to and support various inputs( Keyboard/mouse, gamepad, touchscreen ), some logic had to be cleaned up and implemented to allow further development. However, implementing this was not as simple as initially conceptualized. An essential part of the UI obstacle was that creating manual UI pathing within Unity is time-consuming, prone to human error, and not easily modifiable in a complex UI nested structure.
The solution to the UI was to create a component class that would dynamically create structured UI pathing that follows a specific pattern and logical flow that is intuitive to navigate the nested structure with a keyboard and or gamepad. For this to work, there had to be multiple scenarios that it needed to work within and function in any orientation( Horizontal, Vertical ) and any direction( Up, Right, Down, Left ) while supporting different formations( List, Grid ) of nested children.
Here is what the prototype looks like with a complex pathing structure, with all pathing dynamically created, including nested pathing.
It is fantastic to see it in action when applied to the game UI. What would have taken me hours to path correctly is done in a matter of clicks.
Of course, another challenge was a task that I had continuously put off for some time but now needed to be addressed. This was the Unity Scrollview not having the integral functionality to scroll to the selected list object when it is outside of the viewable mask area. Surprisingly this was relatively simple to solve; initially, seeing solutions online, I thought the correct way was to go through the Unity Scrollbar component. This method is not something I would suggest as there is a much simpler solution. That solution uses the Mask Transform Rect and the selected nested child object Transform Rect. Use the top border of each Transform Rect to see if the child's top border is above the Mask top border. Apply the difference between the two Y positions to the content container that holds all the children. The same logic applies to the bottom border. Make sure to also take the Padding( Top, Bottom ) into account, and you will have a perfect result.
Furthermore, the 12th anniversary of CSK will be on June 7th; please join the other players and me online. I will be online during these approximate times.
My time zone
June 7th, 1200-1300
June 7th, 1830 - 2030
One last thing worth mentioning is that I will be multi-streaming the regular game development on both Twitch and YouTube moving forward.
Have a great day :)