I have a SwiftUI application which uses a TabView as the main navigation through the app, and have implemented an AdMob banner ad for monetisation.
Currently, the banner is placed as an overlay above the tab bar, but this isn't ideal for the following reasons, the second being of particular concern.
- Different devices and orientations have different tab bar heights, meaning the offset to place the banner correctly is difficult to compute.
- The
AdView()overlay can block content from the child views, which is bad user experience at best and at worst falls foul of some T&C regarding ad placement and usability.
I have implemented this as so;
TabView {
View1()
.tabItem {
Image(systemName: "person.fill")
Text("My Jobs")
}
View2()
.tabItem {
Image(systemName: "clock")
Text("Shifts")
}
}
.overlay(AdView().frame(width: kGADAdSizeBanner.size.width, height: kGADAdSizeBanner.size.height).offset(x: 0, y: -kGADAdSizeSmartBannerPortrait.size.height - getTabBarHeightOffset()), alignment: .bottom)
An alternative implementation is to VStack each child view with an AdView, to stick the AdView to the top of the TabBar. However if I do this, each time I navigate to a different child view, the Ad reloads.
The behaviour I would like is that the Ad persists across child Views, similar to the overlay solution, but is placed directly above the TabBar and does not interfere with the child views.