Using an automated Screen Flow

Use case

Here’s a simple use case :

  • You created two screens inside your UI: Screen1 and Screen2
  • You created a Show sequence and a Hide sequence for both screens
  • You want a button to go from Screen1 to Screen2
  • You want a back button to go from Screen2 to Screen1

UI Timeline Animations includes a complete screen flow with history to allow easy sequencing and the creation of back buttons.

Declaring screens

Here’s an example of hierarchy of an UI:

In our Main UI canvas, we have two sub-canvases MainScreen and Screen2 corresponding to each screen:

On each screen, just add a UTAScreen component:

In the component, you can then fill both the Show and Hide directors, corresponding to the Show and Hide sequences you want to trigger when the screen should be shown or hidden.

To have a functionning history behaviour, you will need to check the « Is First Screen » toggle on what is to be the first screen of your scene.

Declaring buttons

You can now instantiate UTA History Buttons inside your scene. A History Button is a button that will take a destination screen as a parameter, trigger the hide sequence of the current screen and the show sequence of the destination screen:

The Mode can either be Go To or Go Back, in Parallel or Sequence

  • The Go To mode will take the player from the current screen to the screen linked in the Destination field
  • The Go Back mode will take the player from the current screen back to the previous screen
  • The Parallel mode means that both the show and hide sequences will be triggered at the same time
  • The Sequence mode means that the hide sequence will be triggered and *then* the show sequence will trigger, waiting for the hide sequence to complete