Enabling banner ads
Warning.
This is an archived version of the documentation. Actual documentation for all platforms can be found here.
A banner is a configurable ad that covers part of the screen and reacts to clicks.
Enabling a banner
Add the import:
import 'package:yandex_mobileads/mobile_ads.dart';
Copied to clipboardCreate an object of the
BannerAd
class in the Builder orinitState
of the widget hosting the banner:final banner = BannerAd( adUnitId: 'R-M-XXXXXX-Y', // Flex-size adSize: AdSize.flexible(width: screenWidth, height: bannerHeight), // Sticky-size adSize: AdSize.sticky(width: screenWidth), adRequest: AdRequest(), onAdLoaded: () { /* Do something */ }, onAdFailedToLoad: (error) { /* Do something */ }, );
Copied to clipboardIn the
build
method of your widget, specify theAdWidget
that will accept the newBannerAd
object:AdWidget(bannerAd: banner)
Copied to clipboardThe ad will load automatically. If necessary, you can call the
load
method of the banner object after you callbuild
for the first time.
Example of working with banner ads
The code demonstrates how to create and configure BannerAd
objects:
import 'package:yandex_mobileads/mobile_ads.dart'; // ... class BannerAdPage extends StatelessWidget { final banner = BannerAd( adUnitId: 'demo-banner-yandex', adSize: AdSize.sticky(width: screenWidth), adRequest: AdRequest(), onAdLoaded: () { /* Do something */ }, onAdFailedToLoad: (error) { /* Do something */ }, ); @override Widget build(BuildContext context) { return Scaffold( body: Align( alignment: Alignment.bottomCenter, child: AdWidget(bannerAd: banner), ), ); } }
Copied to clipboard
If an ad is integrated this way, the banner appears after the app starts:
To see how the banner ad will be displayed in the app, use a demo AdUnitId:
- demo-banner-yandex