Use edge-based UI animations to show or hide UI that originates from the edge of the screen. Either the user or the app can bring this UI into view. The UI can either overlay the app or be part of the main app surface. If the UI is part of the main app surface, you might need to resize the rest of the app to make room for the new UI when it appears.
This set of animations consists of the following APIs:
There are two types of edge-based elements, each with their own set of animation APIs: edge UI and panel UI.
The following video demonstrates the animations that show and hide edge-based UI:
The following video demonstrates the animations that show and hide panels:
- Use edge UI animations with smaller edge-based UI, such as the app's command bar or a UI surface for errors and warnings.
- Use panel UI animations with edge-based UI that is generally larger and covers more of the screen, such as the soft keyboard.
Important The app bar control provided by Windows includes the edge UI animations. If you are using that control, you do not need to provide those animations yourself.
To use these animations, you'll need to know:
- The object that will slide in or out.
- The distance (offset) that the object will slide. This will be the final distance between the inner edge of the UI and the edge of the screen.
Other resources
See the Using the Animation Library animations sample for code examples that demonstrate the use of the edge-based UI animation APIs.
See Guidelines and checklist for edge-based UI animations for design best practices in the use of these animations.
Related topics
Build date: 3/5/2013
