Smart Banners
Stay organized with collections
Save and categorize content based on your preferences.
AI-generated Key Takeaways
-
Smart Banners are responsive ad units that adjust their size to fit the width of the device's screen, spanning the full width in either portrait or landscape orientation.
-
On iPhones, Smart Banners have a height of 50 points in portrait and 32 points in landscape; on iPads, the height is consistently 90 points in both orientations.
-
It is recommended to use the newer adaptive banners instead of Smart Banners for better ad performance and user experience.
-
For full-width banners, especially with iOS 11 and later, constraints should be added to align the banner edges with the safe area edges for optimal display.
Smart Banners are ad units that render screen-width banner ads on any screen size across different devices in either orientation. Smart Banners detect the width of the device in its current orientation and create the ad view that size.
Smart Banners on iPhones have a height of 50 points in portrait and 32 points in landscape. On iPads, height is 90 points in both portrait and landscape.
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.
To use Smart Banners, just specify kGADAdSizeSmartBannerPortrait
(for portait orientation) or kGADAdSizeSmartBannerLandscape (for landscape
orientation) for the ad size:
Swift
letbannerView=GADBannerView(adSize:kGADAdSizeSmartBannerPortrait)
Objective-C
GADBannerView*bannerView=[[GADBannerViewalloc] initWithAdSize:kGADAdSizeSmartBannerPortrait];
Since the addition of the safe area for iOS 11, for full-width banners you should also add constraints for the edges of the banner to the edges of the safe area. Here is a code snippet showing how to do this:
Swift
funcaddBannerViewToView(_bannerView:GADBannerView){ bannerView.translatesAutoresizingMaskIntoConstraints=false view.addSubview(bannerView) if#available(iOS11.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) } } // MARK: - view positioning @available(iOS11,*) funcpositionBannerViewFullWidthAtBottomOfSafeArea(_bannerView:UIView){ // Position the banner. Stick it to the bottom of the Safe Area. // Make it constrained to the edges of the safe area. letguide=view.safeAreaLayoutGuide NSLayoutConstraint.activate([ guide.leftAnchor.constraint(equalTo:bannerView.leftAnchor), guide.rightAnchor.constraint(equalTo:bannerView.rightAnchor), guide.bottomAnchor.constraint(equalTo:bannerView.bottomAnchor) ]) } funcpositionBannerViewFullWidthAtBottomOfView(_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)) }
Objective-C
- (void)addBannerViewToView:(UIView*)bannerView{ bannerView.translatesAutoresizingMaskIntoConstraints=NO; [self.viewaddSubview:bannerView]; if(@available(ios11.0,*)){ // In iOS 11, we need to constrain the view to the safe area. [selfpositionBannerViewFullWidthAtBottomOfSafeArea:bannerView]; }else{ // In lower iOS versions, safe area is not available so we use // bottom layout guide and view edges. [selfpositionBannerViewFullWidthAtBottomOfView:bannerView]; } } #pragma mark - view positioning - (void)positionBannerViewFullWidthAtBottomOfSafeArea:(UIView*_Nonnull)bannerViewNS_AVAILABLE_IOS(11.0){ // Position the banner. Stick it to the bottom of the Safe Area. // Make it constrained to the edges of the safe area. UILayoutGuide*guide=self.view.safeAreaLayoutGuide; [NSLayoutConstraintactivateConstraints:@[ [guide.leftAnchorconstraintEqualToAnchor:bannerView.leftAnchor], [guide.rightAnchorconstraintEqualToAnchor:bannerView.rightAnchor], [guide.bottomAnchorconstraintEqualToAnchor:bannerView.bottomAnchor] ]]; } -(void)positionBannerViewFullWidthAtBottomOfView:(UIView*_Nonnull)bannerView{ [self.viewaddConstraint:[NSLayoutConstraintconstraintWithItem:bannerView attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeLeading multiplier:1 constant:0]]; [self.viewaddConstraint:[NSLayoutConstraintconstraintWithItem:bannerView attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeTrailing multiplier:1 constant:0]]; [self.viewaddConstraint:[NSLayoutConstraintconstraintWithItem:bannerView attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self.bottomLayoutGuide attribute:NSLayoutAttributeTop multiplier:1 constant:0]]; }