Journal 106 — Unity 2D Mobile, Dungeon Escape Shop Setup Part 2
Objective: To set up the shop functionality to buy power ups
In this article, I will go over activating the shop and UI to make it so the player can select power ups to purchase. There will be a follow up article on implementing the purchase behavior.
We will first need to enable the shop when the player enters the shop area in the level.
We can add a collider and rigidbody to the shop keeper game object.
We can create a new C# script and attach it to the shop keeper game object to check for OnTriggerEnter2D, and set the shop panel active.
We can also add functionality to turn the shop panel off after leaving the shop keeper. We can use OnTriggerExit2D.
We can now create a UIManager to handle the updates to the shop items and gems collected. We can first make the script and turn it into a singleton and attach it to the Canvas. We can also include a text game object from the player gem count in the shop panel so this can be updated.
Since we have in the shop a collision with the player, we can get from the player the current diamonds it has.
Let’s see if this works in game.
OnClick Shop Events
Now let’s add an update to the shop panel to show a selected bar under each item.
We can get a reference to the selection bar, and also add a public method in the shop to select the item. We can access this item select function using the buttons we created for each power up.
Now let’s update the button click in the Inspector.
In the SelectItem() function, we can put a simple Debug.Log message to check that a button was selected. After testing, I found the button clicks are not registered. This is due to the buttons being a child of one of the panels. So to correct this, simply move the three buttons out of the Item_BG and re-position the buttons.
Now let’s test this.
Now that the button select works, let’s track which button was pressed. We can add a parameter in the SelectItem() function to pass in an integer and assign a value to each button.
Now that we know the button selected, we can update the selection bar by using a switch statement and modifying the Rect Transform y-value.
The next article will go over the purchase of the items.
Thank you for your time!