Adaptive sticky banner

That is a small, automatically updated ad placed at the top or bottom of the app screen. It does not overlap the main app content and is often used in game apps.

Adaptive sticky banners provide maximum efficiency by optimizing the size of the ad on each device. This ad type lets developers set a maximum allowable ad width, though the optimal ad size is still determined automatically. The height of the adaptive sticky banner shouldn't exceed 15% of the screen height.

Appearance

This guide shows how to integrate adaptive sticky banners into Compose Multiplatform apps. In addition to code examples and instructions, it has offers format-specific recommendations and links to additional resources.

Prerequisite

  1. Follow the process in Quick start to integrate the Yandex Mobile Ads Compose Multiplatform Plugin.
  2. Make sure you're running the latest Yandex Mobile Ads Compose Multiplatform Plugin version. If you're using mediation, make sure you're running the latest version of the unified build.

Implementation

Key steps for integrating adaptive sticky banners:

  • Add the Banner composable and pass BannerAdSize.Sticky with the container width.
  • Register lifecycle callbacks through BannerEvents.

Features of adaptive sticky banner integration

  1. We strongly advise against attempting to load a new ad when receiving an error in the onAdFailedToLoad callback. If you need to load an ad after a failure, restrict ad load retries to avoid recurring failed ad requests due to network connection constraints.

  2. Adaptive sticky banners work best when using all the available width. In most cases, that's the full width of the device screen. Make sure to include all padding and safe display areas applicable to your app.

  3. To describe the banner size, use BannerAdSize.Sticky(width), passing the available width of the ad container.

  4. For a given device class, sticky banners use stable width and height chosen by the SDK. Validate the layout once on representative devices, then rely on the same size class.

  5. The height of the adaptive sticky banner shouldn't exceed 15% of the screen height and should be at least 50 dp.

Adding a banner to the layout

Place the Banner composable where the sticky placement should stay visible (often pinned to the bottom of the screen).

Example:

@Composable
fun StickyBannerBar(adRequest: AdRequest, containerWidth: Int) {
    Banner(
        adRequest = adRequest,
        adSize = BannerAdSize.Sticky(width = containerWidth),
        modifier = Modifier.fillMaxWidth(),
        events = BannerEvents(
            onAdLoaded = { /* ad loaded */ },
            onAdFailedToLoad = { error -> /* handle error */ },
            onAdClicked = { /* ad clicked */ },
            onImpression = { data -> /* impression tracked */ },
        ),
    )
}

Loading and rendering ads

The Banner composable loads the ad when it enters composition.

Use BannerAdSize.Sticky(width) with the width of the parent or the screen, including padding and safe areas. You can read the width from BoxWithConstraints or your layout:

BoxWithConstraints(modifier = Modifier.fillMaxWidth()) {
    val widthDp = maxWidth.value.toInt()
    Banner(
        adRequest = adRequest,
        adSize = BannerAdSize.Sticky(width = widthDp),
        modifier = Modifier.fillMaxWidth(),
        events = BannerEvents(/* ... */),
    )
}

To load an ad, you'll need the ad unit ID from the Yandex Advertising Network interface (adUnitId).

To notify when ads load or fail to load and to track the life cycle of adaptive sticky banners, use BannerEvents as shown above.

You can expand ad request parameters through AdRequest (for example targeting, parameters, preferredTheme). Delivering additional contextual data in the request can significantly improve your ad quality. Read more in the Ad Targeting section.

The following example shows how to load an adaptive sticky banner. After successfully loading, the banner will be displayed automatically:

@Composable
fun StickyBanner(adUnitId: String) {
    Banner(
        adRequest = AdRequest(adUnitId = adUnitId),
        adSize = BannerAdSize.Sticky(width = 320),
        modifier = Modifier.fillMaxWidth(),
        events = BannerEvents(
            onAdLoaded = {
                // The ad was loaded successfully and will be shown.
            },
            onAdFailedToLoad = { error ->
                // Ad failed to load with AdRequestError.
                // Attempting to load a new ad from the onAdFailedToLoad() method is strongly discouraged.
            },
            onAdClicked = {
                // Called when a click is recorded for an ad.
            },
            onImpression = { data ->
                // Called when an impression is recorded for an ad.
            },
        ),
    )
}

Use 'demo-banner-yandex' as adUnitId while integrating; replace it with your real unit before release.

Releasing resources

Remove Banner from composition when the placement is no longer needed. The SDK disposes the underlying view on leave. Avoid retaining old composable instances; create a new Banner when the placement becomes visible again.

Testing adaptive sticky banner integration

Using demo ad units for ad testing

We recommend using test ads to test your adaptive sticky banner integration and your app itself.

To guarantee that test ads are returned for every ad request, we created a special demo ad placement ID. Use it to check your ad integration.

Demo adUnitId: demo-banner-yandex.

Warning

Before publishing your app in the store, make sure to replace the demo ad placement ID with a real one obtained from the Yandex Advertising Network interface.

You can find the list of available demo ad placement IDs in the Demo ad units for testing section.

Testing ad integration

You can check your adaptive sticky banner integration using the SDK's built-in analyzer.

The tool makes sure your ads are integrated properly and outputs a detailed report to the log. To view the report, search for the “YandexAds” keyword in the Logcat tool for Android app debugging.

adb logcat -v brief '*:S YandexAds'

If the integration is successful, you'll see this message:

adb logcat -v brief '*:S YandexAds'
mobileads$ adb logcat -v brief '*:S YandexAds'
I/YandexAds(13719): [Integration] Ad type banner was integrated successfully

If you're having problems integrating banner ads, you'll get a detailed report on the issues and recommendations for how to fix them.

Using demo ad units for ad testing

We recommend using test ads to test your ad integration and your app itself.

To guarantee that test ads are returned for every ad request, we created a special demo ad placement ID. Use it to check your ad integration.

Demo adUnitId: demo-banner-yandex.

Warning

Before publishing your app to the store, make sure you replace the demo ad unit ID with a real one obtained from the Yandex Advertising Network interface.

You can find the list of available demo ad placement IDs in the Demo ad units for testing section.

Testing ad integration

You can test your ad integration using the native Console tool.

To view detailed logs, call the YMAMobileAds class's enableLogging method.

YMAMobileAds.enableLogging()

To view SDK logs, go to the Console tool and set Subsystem = com.mobile.ads.ads.sdk. You can also filter logs by category and error level.

If you're having problems integrating ads, you'll get a detailed report on the issues and recommendations for how to fix them.

Previous
Adaptive inline banner
Next
Interstitial ads