Toggle Panel for Key Cards

Objective: Create a User Interface (UI) Panel displaying collectable toggles.

Top: Player collects Yellow Key Card. Bottom: Panel updating Yellow card toggle and door opening.

Create a UI > Canvas and remove the Graphics Raycast component. Add a new script called UI Manager, which is described later. Set the Render Mode to Screen Space — Camera. Assign Main Camera to the the Render Camera.

Canvas Components

Next add a UI > Panel, setting the Rect Transform to stretch stretch. Select an image source image, here solid.

Yellow Card toggle within the Canvas Panel.

Create a UI > Toggle named Yellow Card and adjust the position, height and width so that it is within the Panel. Set the On Value Changed (Boolean) to access the Canvas UIManager Toggle Card method, shown below. Select the Label child object and change the Text to Yellow and center alignments.

The Hierarchy for the Canvas should be organized as shown below.

Canvas organization within Hierarchy window.

The UI Manager script on the Canvas is shown below, and has a toggle array which uses a [SerializeField] to assign the toggles in the inspector, shown above in the Canvas Components image. A public ToggleCard method allows the KeyCard script on Collectables to activate the toggle.

UIManager script on Canvas.

The KeyCard script was described previously, but the critical functions are shown below. If the Player triggers the Collectable then the GameManager.HasCards[0] is updated. The _uiManager.ToggleCard(0) turns on the check in the UI panel for yellow card, and the Collectable is destroyed.

Switch statement for yellow card on Collectable.

The Door script works similar to a mobile platform, previously described, and is shown below. If the GameManager.HasCards[0] is true and the bool _openDoor is false _openDoor is set to true. When _openDoor is true a Vector3.MoveTowards command is used to slide the Scifi_Door_01 to the open position.

Door script on Scifi_Door_01.

In summary, the Canvas of the UI provides a Panel view of tasks need to complete the level as toggles. When the Player collides with the Collectable, the KeyCard script communicates to the UIManager and GameManager singleton the toggle and key card status. The Door script monitors the GameManager for HasCards status. When the yellow card has been collected slides the door open.