Mobile Games In Unity: Setting Up Shop

In this article, I’m going to go over setting up the shop panel. In this game, the player spends gems on items to help them progress through the level. Lets get into it!

This is our shopkeeper. Hes just hanging out in the cave. Hes got some pretty useful items that we’re going to need to beat this level. When the player collides with this game object’s collider, this panel is going to pop up.

This is comprised of buttons and images on a fundamental level. The “Buy Item” image is a button that allows the player to purchase whatever they select so long as they have enough gems. The way I have this set up is with a UI Panel. Panels are super useful for organizing UI elements in the inspector.

As you can see, I’ve got the shop panel where all the shop UI elements are housed. I have this automatically set to inactive when the game starts, but when the player collides with the shop keeper this panel becomes active.

To make this functionality work, all I have to do is create the Shop script, and create a public GameObject variable called shopPanel.

Activating this panel is stuff we’ve already done before. I have an OnTriggerEnter2D method set up and whenever the Player collides with the collider, shopPanel.SetActive(true); is called. Super easy! In the next article I want to get into the nitty gritty details of getting the buttons to function properly. Theres lots to take into consideration to get this stuff to work properly, so I wanted to break this up into separate articles. For example: how do we get the panel to pop up and display the correct amount of gold in the bottom right? What about this “click here for 100G” button at the top? Until then, this is what we’ve got so far!