how to place ads below or above BottomNavigationBar in Flutter

Question

I want to place google_mobile_ads' Banner Ad just above or below the BottomNavigationBar in Flutter.

I tried to place the BottomNavigationBar in Container ad add Margin, but there is no option to add 2 childs inside the Container.

I tried to add a Column widget inside the bottomnavigationbar but the column goes to the up top of the page.

Any ideas on how I can make place for google_mobile_ads just above or below the bottomnavigationbar?

I can share the code, but I need advise or guidance or pointers on how it can be achieved.

Solution

There are many ways to achieve this. one would be to separate your scaffold and Ad container like this:

return Column(
    children:[
        Expanded(child: Scaffold(),
        SizedBox(height: 50, child: AdContainer())
    ]
)

another way would be to add it in the bottom nav bar:

bottomNavigationBar: SizedBox(
                         height = 200,
                         child: Column(
                                    children: [
                                        BottomNav(),
                                        AdContainer()
                                    ]
                         )
                     )

Comments

[Raphael Sauer]

It's better if you provide a minimum example for us. In the meantime, a Container can only have one child, whereas a column can have many. You should constrain your column so that it does not fill all the page. Something like a container would work.

[PurnaSatyaP]

Can you suggest how I can constraint the column so that it can stick to the bottom part of the page and not take up the whole page. The body is inside the singlechildscrollview which has a listview builder inside. I will paste the once I am back at my system.

[PurnaSatyaP]

This helped. Thank you. The second option didnt work for some reason so took the first route.