GameDevHQ Crash Course #36 onClick Events

Onclick events are a simple but powerful way to make your buttons impactful to your program.

Whether it is something simple as incrementing a counter or some longer functions that check other parts of your code to verify and execute other functions.

Today I am going to go over 2 different uses for onclick events, both involve UI elements.

First one we will be a menu item selection.

First we need some code for this, I will be having 3 menu items. My code also moves a menu bar just below.

This just helps us identify which item is currently selected. As we have 3 menu items here we can make a switch statement with limited selections. Our function asks for a int variable on call, so we will have to keep that in mind when we go to implement it.

With the code out of the way, we now have to make ourselves some interactable buttons. In unity you can make a UI button easily but right clicking in the hierarchy and going to UI then Button. Since our buttons do not want to have a outline component we simple remove the mesh on them and name the button with the correct infomation.

Once we have both the function created and our button, We have one more important thing to do before we make our onclick events.

We need to attach our script to a meaningful object so our buttons work. Since we made some button UI elements they will all have been created under a single Canvas object, for this will attach our script to this canvas object since all of our onclick button events will have that as its parent. Now that we have done that lets make some onclick events

In the inspector of our first button down at the button component you will see onclick.

We drag our canvas that has the script into the bottom left part where mine says Shop_K, this will allow you do select the public functions that this script has. For us we want to change our selection to 0, so we select the SelectItem Function, now remember our function required us to input an int as a call requirement, so we add a 0 to the bottom field, now when we click our first menu item , it will change our selection to the top menu option, moving our bar to below to to denote that we have it selected and in our script change the active variables to be relevant to the first menu item.

Do this for the remaining menu items. Now we have a working menu that allows us to scroll through each of the options.

For our second onclick option we are going to do one that calls a verify function to make sure our player has enough gems to buy a item, if it does buy the item, otherwise show a message stating that they do not have enough gems.

First we need a function to call. So lets make ourselves one. I am going to make a buy function.

in this case if the player has 100 gems they can purchase the key, which we then call our UImanager to verify that the player has enough gems to purchase the item, then calls the gamemanager static manager to give our player the key if they have enough gems.

Then same as before we drag out canvas that has the script on it onto the button, this time we are attaching the buy function to it, this function does not have argument required so the field is not there. With that we now have a menu that we can select different options and then attempt to buy them.