Menu disappearance

Now that our main menu appears smoothly, let's make sure it disappears smoothly before it exits the game.

UIPlay Tween

In order to make this window scale down, we can simply request the tween to play in reverse. That's where the UIPlay Tween component comes in: it lets us play any other tween in the scene on a specified event, with different behaviors.

Usage

Add the UIPlay Tween component to our Exit button:

  1. In Hierarchy, select our Button | Exit GameObject.
  2. Click on the Add Component button.
  3. Type play with your keyboard to search for components with that word.
  4. Select Play Tween and hit Enter or click on it with the mouse.

Ok, we just added the UIPlay Tween component to our exit button. Let's see what its parameters are before we configure it.

Parameters

Now added to our exit button, the UIPlay Tween component has nine parameters, as shown in the following screenshot:

Parameters
  1. Tween Target: Drag here the GameObject on which your tween component is attached.
  2. Include Children: If checked, the Play Tween will search for tween components in the Tween Target children and play them too.
  3. Tween Group: Specify which tween group you want to play on the target. All tween components with this group ID found on the target will be played.
  4. Trigger condition: Here, you can choose on which condition you want to play the target's tween.
  5. Play direction: Select one of these three play direction behaviors:
    • Toggle: Tween is played in the opposite direction each time
    • Forward: The tween will only play in a forward direction
    • Reverse: The tween will only be played in reverse
  6. If target is disabled: Choose what to do if the Tween Target (1) is disabled:
    • Do Nothing: If the target is disabled, no tween will be played
    • Enable Then Play: If the target is disabled, it will be enabled before the tween is played
    • Ignore Disabled State: If the target is disabled, the tween will still be played even though the target will remain invisible
  7. On activation: This is the behavior if the tween is already playing on target:
    • Continue From Current: Continue playing the current tween
    • Restart Tween: Interrupt current tween and restart it now
    • Restart If Not Playing: Restart the tween only if it's not playing
  8. When finished: Choose a behavior for when the tween is finished:
    • Do Not Disable: When the tween is finished, nothing happens
    • Disable After Forward: Disable the target at the end of the tween when played in a forward direction
    • Disable After Reverse: Disable the target when the tween ends when played in reverse
  9. On Finished: Choose here which method to call when the tween is finished.

Note

Tween Scale is played as soon as it's enabled. If you disable it in the editor and enable it during runtime (through code or Inspector), it will play instantly.

Now, we can configure it to request the main menu window to play Tween Scale in the reverse direction to make it disappear on click.

Configuration

Set our Exit GameObject's UIPlay Tween parameters as follows:

Configuration

We can see that our UIPlay Tween on our Exit button requests our Main GameObject to play in Reverse its attached tweens of group 0. Also, the target (Main), will be disabled automatically when the tween finishes.

Hit Unity's play button. Now, our main menu window scales down from {1, 1, 1} to {0, 0, 0} when the Exit button is clicked!

OK. Now, let's make sure we quit the game when the tween is finished.

Game exit

For the game to exit, we will create a new C# script called MenuManager.cs in which an Exit() function will be added. This new Exit() method will be called at the end of the tween we just created.

MenuManager Script

Let's start by creating a new MenuManager.cs script that will hold useful methods:

  1. Select our UI Root GameObject.
  2. In the Hierarchy view, click the Add Component button.
  3. Type MenuManager on your keyboard. No match will be found.
  4. With the New Script option selected, hit Enter on your keyboard.
  5. In the next dialog box, make sure Language is in CSharp and hit Enter.

OK, now open our new MenuManager.cs script, and add this new Exit() method:

// Method called when we want to exit
public void Exit ()
{
  // If currently in Unity Editor
  #if UNITY_EDITOR
  // Stop play mode
  UnityEditor.EditorApplication.isPlaying = false;
  #endif
  // Exit the game
  Application.Quit();
}

This Exit() method exits the game on its last line. The fourth—highlighted—line of code is only executed in Unity Editor. It makes sure the editor stops playing so that we still have feedback without having to build to check if the Exit() method works.

Linking the tween to Exit()

Now that we have our Exit() function, let's link it to the tween's OnFinished event:

  1. Select our Exit button.
  2. Drag our UI Root GameObject in the OnFinished event's Notify field.

Now that we have dragged a GameObject in the Notify field, we can select which method to assign within its attached components. Select the Exit method of MenuManager:

Linking the tween to Exit()

Hit Unity's play button. As soon as the Exit button is pressed, the window disappears and the Exit() method is called at the end of the tween, exiting the game or play mode! Now, let's move on to see how we can show the options.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
18.118.139.224