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.

 

Banner

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 may affect the performance of your app.

class _MyAppState extends State {
    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((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 must load new instance in order to show an interstitial ad another time, and 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'),
            ),
        );
    }
}

Native

As opposed to banners, native ads can't be refreshed automatically. You must set the reloading interval of your native ads. The default interval for reloading banners is 45 seconds, which can also work well for native ads. Make sure not to load native ads too frequently, because this may have a negative impact on your revenue.

IMPORTANT: You must not handle touch/click events from widgets of your native ad. 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 can pass an instance of StartAppAdPreferences as last parameter to any loading method of class StartAppSdk.

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

Examples:

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

 

Was this article helpful?
Have more questions? submit a request