Flutter, bottomSheet seems to be in loop - flutter

Question

I have a screen that at bottom should load a banner. But when I run, the log goes crazy printing Banner mount and the banner never shows up.
But if I remove it (BannerComponent) from bottomSheet the banner works without the crazy print in loop.
class App extends StatelessWidget {
#override
Widget build(BuildContext context) {
return new StoreProvider<BookmarkState>(
store: store,
child: new MaterialApp(
debugShowCheckedModeBanner: false,
initialRoute: '/',
routes: {
'/': (context) => HomeScreen(),
},
),
);
}
}
class HomeScreen extends StatelessWidget {
static const int PAGE_SIZE = 5;
#override
Widget build(BuildContext context) {
// return BannerComponent() // this whill work
return Scaffold(
appBar: AppBarComponent(),
drawer: DrawerComponent(),
// body: this.mountBody(context),
bottomSheet: BannerComponent(),
);
}
}
class BannerComponent extends StatelessWidget {
BannerComponent();
#override
Widget build(BuildContext context) {
return Container(
color: Colors.red,
child: Row(
children: [
this.mountDFPBanner(context),
],
));
}
mountDFPBanner(context) {
print('Banner mount');
return DFPBanner(...);
}
}
So, what could I be doing wrong here?
https://github.com/ko2ic/flutter_google_ad_manager/issues/33

Answer 1

#Pablo, I am not sure how you're calling your HomeScreen but that could be the issue here. I did a quick test calling it within MaterialApp and seems to be working fine,
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return new MaterialApp(
home: new HomeScreen(),
);
}
}
class HomeScreen extends StatelessWidget {
static const int PAGE_SIZE = 5;
#override
Widget build(BuildContext context) {
// return BannerComponent() // this whill work
return Scaffold(
appBar: AppBar(
title: Text('Test')),
//drawer: DrawerComponent(),
// body: this.mountBody(context),
bottomSheet: BannerComponent(),
);
}
}
class BannerComponent extends StatelessWidget {
BannerComponent();
#override
Widget build(BuildContext context) {
return Container(
color: Colors.red,
child: Row(
children: [
this.mountDFPBanner(context),
],
)
);
}
mountDFPBanner(context) {
print('Banner mount');
return Container(padding: EdgeInsets.only(left: 5.0),height: 40.0, alignment: Alignment.center, child: Text('Banner Test', style: TextStyle(color: Colors.white, fontSize: 18.0),));
}
}
Screenshot:
Hope this helps.