Unity platformer - Mouse controlled menu

NME17AP

Lukuvuonna 2017-2018

Previously we did menu screen that was controlled with keyboard. This time we're going to make menu screen in which you can select to start or quit the game with a mouse click.

For this exercise you need to install NGUI and NGUI Playmaker events. You can find the install link for PlaymakerNgui package in here.

For the NGUI events to work, you need to find a prefab called NGUI Playmaker Proxy from the Playmaker NGUI folder. Drag and drop the prefab to the hierarchy window.

After installing these packages and adding NGUI Playmake Proxy to the hierarchy, select NGUI -> create -> label from the top toolbar.

You need to create 3 labels. One for the game name, one for starting the game and one for exiting the game.

Then select the start game label and create a new component called box collider for it. Make the collider same size as the start game widget. This will be the area that the player is able to click with mouse.

You'll also need to find a component called ngui playmaker events and after that create new FSM for the start label.

For the start FSM create two more states in addition to the start state. Click the first state in the FSM with right mouse button. Select add transition -> custom events -> NGUI -> on hover enter.

Second state has two transitions: on hover exit & on click. On hover transition means that the player can hover mouse over the label and it affects the label in some way. Link the transition according to the picture below.

In the first state you're going to set color for the label. This color will be shown when player is not over the label and it's not active. To select the color property lock the FSM so that it will always be active.

The go to the label from which you need to drag and drop the label to the state window. Grab the UI label (script) text and drag it to the first state of the start FSM.

Next select the color you want to be displayed when the player is not over the label from the property option.

Do the same for the second state but now choose a different color that you want to be displayed when the player is hovering over the label.

It the last state you'll need action called load level. Write the name of the level you want to load when player clicks the start label.

Now do the same thing for the exit label. In the last state choose application quit action so that the game closes when player clicks exit.