iOS: Admob smart banner does not taking full width

Question

I created banner:

    bannerView = GADBannerView(adSize: kGADAdSizeSmartBannerPortrait)  
    bannerView.adUnitID = "ca-76543456707"
    bannerView.delegate = self

it should be full width and I add it to the view with leading, tralling, top and bottom constraints. For most of all ads the result is with a full width. But for some is not. Why? Here is a sample: Red here is color of view.

How to make it full width?

Answer 1

Typically, Smart Banners on phones have a height of 50dp in portrait and 32dp in landscape. On tablets, height is normally 90dp in both orientations.

When an image ad isn't large enough to take up the entire allotted space, the image will be centered, and the space on either side will be filled in.

You can also check live apps on AppStore, you will notice on larger width device that they also display 320 width.

Answer 2

Advertisements images are in different different widths, since you are using smart banner depending on image width ad will be adjusted. its properly explained on the Admob Documentation.

Smart Banners are ad units that render screen-width banner ads on any screen size across different devices in either orientation. Smart Banners help deal with increasing screen fragmentation across different devices by "smartly" detecting the width of the device in its current orientation and making the ad view that size.

Typically, Smart Banners on phones have a height of 50dp in portrait and 32dp in landscape. On tablets, height is normally 90dp in both orientations. When an image ad isn't large enough to take up the entire allotted space, the image will be centered, and the space on either side will be filled in.

Answer 3

In which device you're seeing this ad?
I mean google had specific given instruction here for banner size, which is 320*50 for standard banner.
So, if you're seeing ad on iPhone 4s, iPhone 5 or iPhone SE which have 320 width. So it'll display in full width. but if you see in bigger devices like iPhone 6 or iPhone 6+ then you'll see margin in both side.
For Smart Banners, they've also specify here that

Typically, Smart Banners on phones have a height of 50dp in portrait and 32dp in landscape. On tablets, height is normally 90dp in both orientations.

When an image ad isn't large enough to take up the entire allotted space, the image will be centered, and the space on either side will be filled in.

Answer 4

 func addBannerViewToView(_ bannerView: GADBannerView) {
   bannerView.translatesAutoresizingMaskIntoConstraints = false
   view.addSubview(bannerView)  

  if #available(iOS 11.0, *) {
      // In iOS 11, we need to constrain the view to the safe area.
      positionBannerViewFullWidthAtBottomOfSafeArea(bannerView)
    }
    else {
      // In lower iOS versions, safe area is not available so we use
      // bottom layout guide and view edges.
      positionBannerViewFullWidthAtBottomOfView(bannerView)
    }
}



    func positionBannerViewFullWidthAtBottomOfSafeArea(_ bannerView: UIView) {
      // Position the banner. Stick it to the bottom of the Safe Area.
      // Make it constrained to the edges of the safe area.
      let guide = view.safeAreaLayoutGuide
      NSLayoutConstraint.activate([
        guide.leftAnchor.constraint(equalTo: bannerView.leftAnchor),
        guide.rightAnchor.constraint(equalTo: bannerView.rightAnchor),
        guide.bottomAnchor.constraint(equalTo: bannerView.bottomAnchor)
      ])
    }

    func positionBannerViewFullWidthAtBottomOfView(_ bannerView: UIView) {
      view.addConstraint(NSLayoutConstraint(item: bannerView,
                                            attribute: .leading,
                                            relatedBy: .equal,
                                            toItem: view,
                                            attribute: .leading,
                                            multiplier: 1,
                                            constant: 0))
      view.addConstraint(NSLayoutConstraint(item: bannerView,
                                            attribute: .trailing,
                                            relatedBy: .equal,
                                            toItem: view,
                                            attribute: .trailing,
                                            multiplier: 1,
                                            constant: 0))
      view.addConstraint(NSLayoutConstraint(item: bannerView,
                                            attribute: .bottom,
                                            relatedBy: .equal,
                                            toItem: bottomLayoutGuide,
                                            attribute: .top,
                                            multiplier: 1,
                                            constant: 0))
    }