Flutter Ad Formats

After integrating the Start.io Flutter Plugin, you can go ahead and choose the Ad Formats that best suit your App monetization needs.

Ad Formats

Each instance of StartAppBannerAd is linked to an underlying native view. It refreshes automatically, so you must load it only once and keep an instance of StartAppBannerAd. Creating multiple banner instances is not prohibited, but this can affect the performance of your app.

class _MyAppState extends State < MyApp > {
    var startAppSdk = StartAppSdk();

    StartAppBannerAd ? bannerAd;

    @override
    void initState() {
        super.initState();

        // TODO make sure to comment out this line before release
        startAppSdk.setTestAdsEnabled(true);

        // TODO use one of the following types: BANNER, MREC, COVER
        startAppSdk.loadBannerAd(StartAppBannerType.BANNER).then((bannerAd) {
            setState(() {
                this.bannerAd = bannerAd;
            });
        }).onError < StartAppException > ((ex, stackTrace) {
            debugPrint("Error loading Banner ad: ${ex.message}");
        }).onError((error, stackTrace) {
            debugPrint("Error loading Banner ad: $error");
        });
    }

    @override
    Widget build(BuildContext context) {
        return Center(
            child: Column(
                children: [bannerAd != null ? StartAppBanner(bannerAd!) : Container()],
            ),
        );
    }
}

 

Interstitial

Unlike banners, each instance of StartAppInterstitialAd can be displayed only once. You have to load a new instance in order to shown an interstitial ad another time. You must assign null to the corresponding field after the ad was shown.


class _MyAppState extends State {
  var startAppSdk = StartAppSdk();

  StartAppInterstitialAd? interstitialAd;

  @override
  void initState() {
    super.initState();

    // TODO make sure to comment out this line before release
    startAppSdk.setTestAdsEnabled(true);

    loadInterstitialAd();
  }

  void loadInterstitialAd() {
    startAppSdk.loadInterstitialAd().then((interstitialAd) {
      setState(() {
        this.interstitialAd = interstitialAd;
      });
    }).onError((ex, stackTrace) {
      debugPrint("Error loading Interstitial ad: ${ex.message}");
    }).onError((error, stackTrace) {
      debugPrint("Error loading Interstitial ad: $error");
    });
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: ElevatedButton(
        onPressed: () {
          if (interstitialAd != null) {
            interstitialAd!.show().then((shown) {
              if (shown) {
                setState(() {
                  // NOTE interstitial ad can be shown only once
                  this.interstitialAd = null;

                  // NOTE load again
                  loadInterstitialAd();
                });
              }

              return null;
            }).onError((error, stackTrace) {
              debugPrint("Error showing Interstitial ad: $error");
            });
          }
        },
        child: Text('Show Interstitial'),
      ),
    );
  }
}

 

Rewarded Video

Similar to the Interstitial Ad, each instance of StartAppRewardedVideoAd can be displayed only once. You have to load a new instance in order to show a Rewarded Video another time. You must assign null to the corresponding field after the ad was shown.


class _MyAppState extends State {
  var startAppSdk = StartAppSdk();

  StartAppRewardedVideoAd? rewardedVideoAd;

  @override
  void initState() {
    super.initState();

    // TODO make sure to comment out this line before release
    startAppSdk.setTestAdsEnabled(true);

    loadRewardedVideoAd();
  }

  void loadRewardedVideoAd() {
    startAppSdk.loadRewardedVideoAd(
      onAdNotDisplayed: () {
        debugPrint('onAdNotDisplayed: rewarded video');

        setState(() {
          // NOTE rewarded video ad can be shown only once
          this.rewardedVideoAd?.dispose();
          this.rewardedVideoAd = null;
        });
      },
      onAdHidden: () {
        debugPrint('onAdHidden: rewarded video');

        setState(() {
          // NOTE rewarded video ad can be shown only once
          this.rewardedVideoAd?.dispose();
          this.rewardedVideoAd = null;
        });
      },
      onVideoCompleted: () {
        debugPrint('onVideoCompleted: rewarded video completed, user gain a reward');

        setState(() {
          // TODO give reward to user
        });
      },
    ).then((rewardedVideoAd) {
      setState(() {
        this.rewardedVideoAd = rewardedVideoAd;
      });
    }).onError((ex, stackTrace) {
      debugPrint("Error loading Rewarded Video ad: ${ex.message}");
    }).onError((error, stackTrace) {
      debugPrint("Error loading Rewarded Video ad: $error");
    });
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: ElevatedButton(
        onPressed: () {
          if (rewardedVideoAd != null) {
            rewardedVideoAd!.show().onError((error, stackTrace) {
              debugPrint("Error showing Rewarded Video ad: $error");
              return false;
            });
          }
        },
        child: Text('Show Rewarded Video'),
      ),
    );
  }
}

Native

Unlike banners, Native Ads can't be refreshed automatically. You must take care of the intervals for reloading Native Ads. Default interval for reloading banners is 45 seconds, which can be good for native ads as well. Make sure you don't reload your Native Ads too frequently, because this might negatively impact your revenue.

    IMPORTANT:
    You must not handle touch/click events from widgets of your Native Ads. Clicks are handled by an underlying view, so make sure your buttons or other widgets won't intercept touch/click events.
class _MyAppState extends State {
  var startAppSdk = StartAppSdk();

  StartAppNativeAd? nativeAd;

  @override
  void initState() {
    super.initState();

    // TODO make sure to comment out this line before release
    startAppSdk.setTestAdsEnabled(true);

    startAppSdk.loadNativeAd().then((nativeAd) {
      setState(() {
        this.nativeAd = nativeAd;
      });
    }).onError((ex, stackTrace) {
      debugPrint("Error loading Native ad: ${ex.message}");
    }).onError((error, stackTrace) {
      debugPrint("Error loading Native ad: $error");
    });
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: nativeAd != null
          ? // TODO build your own custom layout
          : Container(),
    );
  }
}

Additional Parameters

If you want to customize the ad request being sent to the server, you should pass an instance of StartAppAdPreferences as named parameter prefs to any of loading method of class StartAppSdk.

You can find all available parameters in the constructor of StartAppAdPreferences.

Examples:

startAppSdk.loadBannerAd(type, prefs: const StartAppAdPreferences(adTag: 'home_screen', ));
startAppSdk.loadInterstitialAd(prefs: const StartAppAdPreferences(adTag: 'game_over', ));
startAppSdk.loadNativeAd(prefs: const StartAppAdPreferences(adTag: 'scoreboard', ));

Listen to Ad Events

If you want to take any actions when an specific ad event takes place, you should pass the corresponding callback while loading an ad.

NOTES:

You have to call interstitialAd.dispose() after it has been used to prevent memory leak. For banner it will be called automatically.

Examples:

startAppSdk.loadBannerAd(type, 
onAdImpression: () { // do something }, onAdClicked: () { // do something }, );

startAppSdk.loadInterstitialAd(
  onAdDisplayed: () {
    // do something
  },
  onAdNotDisplayed: () {
    // do something

    interstitialAd.dispose();
    interstitialAd = null;
  },
  onAdClicked: () {
    // do something
  },
  onAdHidden: () {
    // do something

    interstitialAd.dispose();
    interstitialAd = null;
  },
);
Was this article helpful?
Have more questions? submit a request