Tutorial 5.D. – Add Animation to the menu block
What you will learn in this section:
- How to apply animation properties to a menu block using Actions
- How the On Show and On Hide events for a menu block work
There are two types of Actions that cause a menu block to animate. The first type can only be applied to the On Show and On Hide events for the menu block. Animation actions that are applied to the On Show / On Hide events of a menu block will cause the menu block to animate on and off screen anytime it is shown or hidden from the screen. This could be when the user presses the pop-up menu button on the remote control, or when you use a Show Menu action.
The second type of Action that causes a menu block to animate can be found in the Action list under “Animation Actions”. Animation actions will animate a menu block on and off screen only when that Action is executed. In most cases, you will add the animation actions to the On Show and On Hide events for the menu block.
To add animation actions to the On Show and On Hide events for the main menu block:
- Expand the Main Menu block in the menu Elements tree by clicking the gray arrow next to the icon.
- Click the On Show Event for the Main Menu block.
- Right-click in the Actions window in the Control Panel and select Menu Block Animation Actions > Animate this Menu Block from the Bottom.
- Type the number 30 in the field for “Number of pixels per Frame”, this defines the speed of the animation. You can play with different values to see what speed you like best.
This will cause the main menu to animate up from the bottom of the screen whenever the Pop-up menu button on the remote control is pressed, or when you cause the Main menu to appear using Actions. When the Main Menu hides, it will just disappear instantly. if you want to add animation to the menu block when it hides, simply add a Menu Block Animation Action to the On Hide event.
