Create a banner to announce messages without obstructing a user’s entire screen. This is great for communicating both urgent messages, such as updates, and non-urgent messages, such as events, promotions, rating requests, etc
Banners display and remain consistent when you navigate to another page.
Note: The ability to disable the backdrop is valid from SDK 2.19. A banner guide without a backdrop will not be served to any device with SDK version lower than 2.19.
How do I create a mobile banner?
There are two ways to create a mobile banner:
- Use the default mobile banner layout
- Use any popup guide by removing the backdrop and full-screen settings in the Styling tab
The default mobile banner layout comes with pre-defined settings. You can make any required changes or adjustments to match your design needs:
| Action | Details |
|
Remove the backdrop and full-screen settings in the Styling tab to use a popup guide.
The backdrop is disabled by default so users can continue to interact with the mobile app behind the banner. |
|
|
The banner position is bottom aligned by default. You can change the position in the Location tab. |
|
|
Define the banner’s width, either across all of the screen, or some of it, using the padding measurements or turn on the Limit Guide Width setting and set the required width. Tip: For a full-width banner, set the container's left and right margins to 0. In this case, you’ll probably want to assign right and left padding to any building block inside the banner. We recommend keeping bottom padding of at least 8-16 for mobile devices with a notch. |
|
|
Make the Banner move smoothly and more noticeable by adding Slide in and out Transitions. |
|
Frequently asked questions
On Android, why does the banner 'flicker' when I navigate to another page?
Android displays the banner consistently when navigating through fragments. When navigating to a new activity, the banner re-draws itself on the new activity, causing the 'flicker'.