I am working on a Flutter Application where I need to show an AdMob's Banner Ad. I have noticed that the banner overlaps my list view. I tried to search for the solution but I did not find anything much useful.
One solution I found is to provide fix margin of 50px at the bottom. I feel a little uncomfortable with this solution as I read somewhere that the screen size may affect this solution.
Also when I put a fake bottom bar then it also overlaps my bottom tab bar and bottom sheets.
Please see the below image for more details.
Thank you for your time.
Set following params in the banner ad show()
function:
bannerAd = Utils().myBanner
..load()
..show(
anchorType: AnchorType.bottom,
anchorOffset: 55.0);
And also need to set margin: const EdgeInsets.only(bottom: 55)
on the container
If you're using a Scaffold Widget, try using the persistentFooterButtons: parameter. Tutorial here: http://cogitas.net/show-firebase-admob-banner-ad-in-flutter/
I found one solution for you my cast Banner bottom Flutter Application little bit padding. Fix it with below code.
var paddingBottom = 48.0;
new MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Name',
home: new MyHomePage(
title: "NMame",
),
builder: (context, widget) {
final mediaQuery = MediaQuery.of(context);
return new Padding(
child: widget,
padding: new EdgeInsets.only(bottom: paddingBottom),
);
},
routes: <String, WidgetBuilder>{
'/HomeScreen': (BuildContext context) =>
new MyHomePage(title: 'UPSC Question Papers')
})
handle when the app is not getting loaded Ads
if(event == MobileAdEvent.failedToLoad){
setState(() {
paddingBottom = 0.0;
});
}
Thank you
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With