When an application imports a card, the BlackBerry 10 OS controls the visual transition on and off the screen, but it also controls the peek behavior that allows the user to look at the card under the card that's currently displayed. The BlackBerry 10 OS manages the transition and the peek behavior based on the card's style.
Composers, pickers, and previewers
You can use three different styles of card in your application: composers for creating and editing content, pickers for choosing existing content, and previewers for viewing existing content. The style of card you use determines how the BlackBerry 10 OS transitions between the application and the card, how peeking is handled, and determines the general task that a card performs. Each card style has associated visual style guidelines.
A card transitions on or off the screen in a beautiful animation. The cards appears on the screen as either sliding in from the bottom or from the right side. Previewers slide in from the right side, while composers and pickers slide in from the bottom of the screen.
Transition style of composers and pickers
Transition style of previewers
Peeking is the ability for a user to see under a card, by using a gesture. There are two ways in which a user can peek under the card:
Parent peek: The user slides a finger right to reveal the screen that lies immediately under the card.
Root peek: The user slides a finger right on the action bar to reveal the application at the bottom of the stack of cards.
Not all card styles support both peek types. Composer and picker cards support only parent peek, and previewer cards support both types.
UI consideration for cards
To verify a great user experience, here are some guidelines to consider if you want to use cards in your app:
|Button(s) in the title bar of the screen||Yes||No||Yes|
|Action bar at the bottom of the screen||No||Yes||Yes|
|Supports context menu||Yes||Yes||No|
To learn what the action bar, context menu, and buttons are, see the basics.
When you create a card, you must add support for both landscape and portrait orientation so that the card follows the orientation of your application.
Last modified: 2014-05-14