Mobile SDK
Display modes
How a placement's display format maps to a phone, how to override it in code, and how the call and the placement decide which one is used.
On the web a screen opens in one of seven formats. On a phone the SDK maps each format to what feels native. You set the format on the placement in the dashboard, or pass style in code.
Which one is used
For present:
stylefrom your call, if you pass one.- Otherwise the placement's format from the dashboard.
- Otherwise a full-screen cover.
Embedded screens ignore all of this: they are drawn inline.
Formats on a phone
| Display in the dashboard | On iOS | On Android | style in code |
|---|---|---|---|
| Popup | Full-height sheet (a form sheet on iPad) | Full-height sheet | modal |
| Full screen | Full-screen cover | Full-screen activity | fullscreen |
| Slide-in | Bottom sheet as tall as the screen's content | Bottom sheet as tall as the screen's content | sheet |
| Banner | Pinned to the top or bottom edge | Pinned to the top or bottom edge | banner (top or bottom) |
| Toast | Small card at the bottom that closes itself | Small card at the bottom that closes itself | toast (seconds) |
| Side drawer | Same as Popup | Same as Popup | modal |
| Launcher | Same as Popup, opened by the trigger (there is no floating button) | Same as Popup, opened by the trigger | modal |
Position and size settings of the dashboard apply to the web only. A banner uses its top or bottom position. A toast uses its duration.
Setting style
options.style = .banner(top: false)
options.style = .toast(seconds: 5)
options.style = .sheetAlso .fullscreen and .modal.
Behaviour
| The app behind | Closes with | |
|---|---|---|
| Full screen | Covered | A Close the screen button in the design; system back on Android |
| Popup (modal) | Covered by a sheet | Swipe down on iOS, tap outside or system back on Android; or a button in the design |
| Slide-in (sheet) | The sheet covers the lower part | Swipe down on iOS, tap outside or system back on Android; or a button in the design |
| Banner | Usable | A button in the design |
| Toast | Usable | By itself after its duration (3 to 60 seconds, default 6), or a button in the design |
- A toast closing by itself finishes with
closedand records acloseevent. - The SDK adds no close button. Give the screen one with the action Close the screen.
- Screens respect the safe areas: the notch, the home indicator and system bars.
- Animations follow the system setting for reduced motion.