Slide out menu items before a layout change
What we want to add now is: after clicking on our menu items, the menu items shall slide out before switching to another layout. This means we need to change quite some things.
This is in the second .capx
Construct 2 will constantly check in every tick for a variable's value. Depending on its value,
a) menu items will fly into or out of the window center and
b) layout change is done according to variable's value
When a menu item is clicked with the mouse (so menu items are visible!), the variable's value is changed and the "every tick"-event will send out the menu items. As soon as one of the menu item is outside the layout (or, you could check a certain x-position of this menu item), the layout is changed accordingly.
Let's get to work
In the event sheet 1 (for Layout 1), let's add a new variable called inOrOut.
These are the possible values:
0 = nothing happens
1 = info to move menu items out of the screen and change to layout IntroLayout
2 = info to move menu items out of the screen and change to layout GameLayout
On the start of layout condition, insert a new action:
System -> Set value of inOrOut to 0
This is just to be sure that the variable is reset after returning from another layout.
Change the mouse events accordingly
a) remove the "Go to layout xyz" actions
b) insert the inOrOut value change
Moving in or out?
The Every tick-event will check constantly for the inOrOut value, so add two sub events:
System -> Compare variable -> inOrOut is equal to 0
System -> Compare variable -> inOrOut is greater than 0
The "flying in"-actions are still directly under Every tick, so select and move these to the sub-event inOrOut=0. While still selected, copy them (CTRL-C) and paste them into the sub-event inOrOut>0. All those 320 have to be changed to -160 and 800, depending on the menu items.
Your code should now look like this:
If you run the game now, the title menu items will fly in and when click will fly out.
The missing code
You guessed correctly that we need to add the layout change event. We'll check if a menu item has left the window and if yes, check the inOrOut value and change to the corresponding layout.
Add a new event for the item sIntro:
Condition: sIntro -> Is outside layout
Add two sub-events:
System -> Compare variable -> inOrOut=1
Action: Go to IntroLayout
System -> Compare variable -> inOrOut=2
Action: Go to GameLayout
That's it. Have fun experimenting!!!
Also check How to make a menu title by Andeming..