Skip to content
This repository has been archived by the owner on Mar 12, 2022. It is now read-only.

Creating an interstitial ad

Bruno D'Luka edited this page Jan 18, 2021 · 7 revisions

Interstitial Ads

Interstitial ads are full-screen ads that cover the interface of their host app. They're typically displayed at natural transition points in the flow of an app, such as between scrrens or during the pause between levels in a game. When an app shows an interstitial ad, the user has the choice to either tap on the ad and continue to its destination or close it and return to the app.

Creating an ad object

To create an interstitial ad, use the class InterstitialAd:

InterstitialAd interstitialAd = InterstitialAd();

A single InterstitialAd object can be used to request and display multiple interstitial ads, so you only need to construct it once.

Load the ad

In order to show an ad, it needs to be loaded first. You can use load() to load the ad:

interstitialAd.load()

You can load an ad right when you initalize the ad:

InterstitialAd interstitialAd = InterstitialAd()..load();

Show the ad

Interstitial ads should be displayed during natural pauses in the flow of an app. Between levels of a game is a good example, or after the user completes a task. To show an interstitial, use the isLoaded method to verify that it's done loading, then call show(). The interstitial ad from the previous code example could be shown in a button's onPressed like this:

FlatButton(
  child: Text('Open interstitial ad'),
  onPressed: () async {
    // Load only if not loaded
    (!interstitialAd.isLoaded) await interstitialAd.load();
    (interstitialAd.isLoaded) interstitialAd.show();
  },
),

Ad events

To further customize the behavior of your ad, you can hook onto a number of events in the ad's lifecycle: loading, opening, closing, and so on. You can listen for these events using interstitialAd.onEvent.listen((_) {...}):

interstitialAd.onEvent.listen((e) {
  final event = e.keys.first;
  switch (event) {
    case InterstitialAdEvent.loading:
      print('loading');
      break;
    case InterstitialAdEvent.loaded:
      print('loaded');
      break;
    case InterstitialAdEvent.loadFailed:
      final errorCode = e.values.first;
      print('loadFailed $errorCode');
      break;
    case InterstitialAdEvent.opened:
      print('ad opened');
      break;
    case InterstitialAdEvent.closed:
      print('ad closed');
      break;
    case InterstitialAdEvent.clicked;
      print('clicked');
      break;
    default:
      break;
  }
});

Using an AdListener to reload

InterstitialAdEvent.closed is a handy place to load a new interstitial after displaying the previous one:

interstitialAd.onEvent.listen((e) {
  final event = e.keys.first;
  switch (event) {
    case InterstitialAdEvent.closed:
      interstitialAd.load();
      break;
    default:
      break;
  }
});

Do NOT show a new ad in InterstitialAdEvent.closed, because it'll become infinite.

You can find a complete example here