During this week of development, I encountered an issue with our UI for the abilities. Specifically, when attempting to dynamically toggle the visibility of UI elements representing character suits and abilities, I realized that disabling a parent UI element did not disable its child/children elements. The code had the functionality to enable or disable individual Image components in our BackgroundDisplayImage array to reflect different game states. However, toggling the visibility of a parent Image (e.g., BackgroundDisplayImage[0].enabled = false;) did not affect its children, leading to a scenario where only the top-level image was turned off, leaving child elements (borders and icons within a hierarchical structure) still visible. This inconsistency in UI visibility not only confused players by presenting misleading information but also detracted from the visual and interactive quality of the game, making a coherent and intuitive UI experience a crucial fix.

To resolve this, the solution required a more comprehensive approach than merely toggling the enabled property of a single Image component. The core issue was that the enabled property of an Image component does not propagate its state to child components. Therefore, disabling a parent Image does not automatically disable the Image components of its child objects in the Unity hierarchy. Recognizing this, I developed a method to recursively disable all Image components within a specified parent object's hierarchy, including the parent itself.

I introduced a new method, DisableImages(Game obj), which would first disable the Image component of the parent object specified by an index in the BackgroundDisplayImage array. It then recursively traverses the child objects of the specified parent, disabling their Image components as well. This ensures that not only is the targeted parent Image component disabled but all related UI elements in its hierarchy are also turned off, achieving a consistent and clear UI state reflective of the game's current context.

Implementing this solution should now significantly improve the user experience by ensuring that the UI consistently represents the game state. Players no longer encounter confusing remnants of active UI elements of things that should not be on screen yet.

author: Fraser Paterson

Posted on 3/28/2024