Banner Integration for Flutter

Banners are a rectangular, system-initiated ads that can be either static or animated, and are served in a designated area around your live app content. 

Create Banner Ad Object and Set Size

The creation of the banner ad object should be done after receiving onInitSuccess callback.

LevelPlayBannerAdView? _bannerAdView;
@override
void initState() {
	super.initState();
	_createBannerAdView();
}
void _createBannerAdView() {
	final _bannerkey = GlobalKey<LevelPlayBannerAdViewState>();
	_bannerAdView = LevelPlayBannerAdView(
		key: _bannerKey,
		adUnitId: [YOUR_AD_UNIT_ID],
		adSize:[YOUR_AD_SIZE],
		listener: [YOUR_LISTENER],
		placementName: [YOUR_PLACEMENT], // optional
		onPlatformViewCreated:[YOUR_LOAD_BANNER_METHOD] // optional
	);
}

Banner Sizes

To create the ad size follow one of these options:

Adaptive ad size that adjusts to the screen width (recommended):
This option replaces the “SMART” integration, as it will return BANNER or LEADERBOARD according to the device type. Networks that support adaptive features (Google, Yandex) will return a height based on their optimization logic.

LevelPlayAdSize adSize = await LevelPlayAdSize.createAdaptiveAdSize();

Adaptive ad size using fixed width ad size:
This option allows you to set a specific width. Networks that support adaptive- banner feature (Google, Yandex) will return a height based on their optimization logic based on the provided width. All other networks will return the fallback size (either BANNER or LEADERBOARD) according to the width provided.

LevelPlayAdSize adSize = await LevelPlayAdSize.createAdaptiveAdSize(width: 400);

Specific banner size:
This option allows you to set specifically a banner size: banner, large, medium.

LevelPlayAdSize adSize = LevelPlayAdSize.MEDIUM_RECTANGLE;

Placements

We support placements in banners for reporting only. Placements should be set before the loadAd, to affect all reloaded ads.

Set Banner Listener 

Implement the LevelPlayBannerAdViewListener in your code to get informed of ad delivery.

• It is recommended to set the listener before loading the banner ad.
• Please note that each banner ad should have its own listener implementation.
• Callbacks run on the main thread.

/**
 Called after a banner has been loaded.
 @param adInfo The info of the ad.
 */ 
@override
void onAdLoaded(LevelPlayAdInfo adInfo) {}
/**
 Called after a banner has failed to load.
 @param error The information about the error.
 */ 
@override
void onAdLoadFailed(LevelPlayAdError error) {}
/**
 Notifies the screen is displayed.
 @param adInfo The info of the ad.
 */ 
@override
void onAdDisplayed(LevelPlayAdInfo adInfo) {}
/**
 Notifies the screen failed to display.
 @param adInfo The info of the ad.
 @param error The information about the error. 
 */ 
@override
void onAdDisplayFailed(LevelPlayAdInfo adInfo, LevelPlayAdError error) {}
/**
 Invokes when the user clicks on the banner ad.
 @param adInfo The info of the ad.
 */ 
@override
void onAdClicked(LevelPlayAdInfo adInfo) {}
/**
 Ad is opened on full screen.
 @param adInfo The info of the ad.
 */ 
@override
void onAdExpanded(LevelPlayAdInfo adInfo) {}
/**
 Ad is restored to its original size.
 @param adInfo The info of the ad.
 */ 
@override
void onAdCollapsed(LevelPlayAdInfo adInfo) {}
/**
 User pressed on the ad and was navigated out of the app.
 @param adInfo The info of the ad.
 */ 
@override
void onAdLeftApplication(LevelPlayAdInfo adInfo) {}

Load Banner Ad

To load a banner ad use loadAd.

// Load the banner ad 
_bannerAdView?.loadAd();

Pause and Resume Banner Refresh 

You can pause banner refresh in your code if the refresh value was defined in the platform. Use the following methods to stop the automatic refresh of the banner ad, or re-enable it after pausing. 

• pauseAutoRefresh – pauses auto-refresh of the banner ad.
• resumeAutoRefresh – resumes auto-refresh of the banner ad after it has been paused.

// Pause refresh 
bannerAdView?.pauseAutoRefresh(); 
// Resume refresh 
bannerAdView?.resumeAutoRefresh();

Destroy Banner Ad

To destroy a banner, call the destroy method.

A destroyed banner can no longer be shown again. To display more ads, create a new LevelPlayBannerAdView object. 

bannerAdView?.destroy();

Full Implementation Example of Banner Ads

Here is an example for creating and loading a banner ad using standard banner size.

// Start of the widget...
final _bannerKey = GlobalKey < LevelPlayBannerAdViewState > ();
final adSize = LevelPlayAdSize.BANNER;
@override
Widget build(BuildContext context) {
    return SizedBox(
        width: adSize.width.toDouble(), // Get actual banner layout width size
        height: adSize.height.toDouble(), // Get actual banner layout height size
        child: LevelPlayBannerAdView(
            key: _bannerKey,
            adUnitId: 'YOUR_AD_UNIT_ID',
            adSize: adSize,
            listener: this,
            placementName: 'YOUR_PLACEMENT',
            onPlatformViewCreated: () {
                // In this implementation we call loadAd on the key,
                // it is also possible to store the LevelPlayBannerAdView widget
                // in a variable and call loadAd on it as described above in the docs.
                _bannerKey.currentState ? .loadAd();
            },
        ),
    );
}
@override
void onAdClicked(LevelPlayAdInfo adInfo) {
    // Implement your logic here...
}
@override
void onAdCollapsed(LevelPlayAdInfo adInfo) {
    // Implement your logic here...
}
@override
void onAdDisplayFailed(LevelPlayAdInfo adInfo, LevelPlayAdError error) {
    // Implement your logic here...
}
@override
void onAdDisplayed(LevelPlayAdInfo adInfo) {
    // Implement your logic here...
}
@override
void onAdExpanded(LevelPlayAdInfo adInfo) {
    // Implement your logic here...
}
@override
void onAdLeftApplication(LevelPlayAdInfo adInfo) {
    // Implement your logic here...
}
@override
void onAdLoadFailed(LevelPlayAdError error) {
    // Implement your logic here...
}
@override
void onAdLoaded(LevelPlayAdInfo adInfo) {
    // Implement your logic here...
}
// End of widget...

LevelPlay Mediation Demo App

The Integration Demo application demonstrates how to integrate banner Ad Unit APIs in your app.

Download Flutter Demo Application

Done!
You are now all set up to serve banner ads in your application. Verify your integration with our Integration Test Suite.