To discuss and provide feedback on our products, join the official AdMob Discord channel in the Google Advertising and Measurement Community server.

iPhone X Ad Rendering

  • Import Google Mobile Ads SDK version 7.26.0 or higher to correctly render ads on the iPhone X.

  • Banner ads should be placed within the Safe Area to avoid being obscured by the screen design.

  • The guide provides examples for positioning banner ads using Storyboard/Interface Builder or programmatically.

  • Native ads also require constraints to respect the Safe Area layout guides when pinned to the top or bottom of the screen.

  • Interstitial and rewarded ad formats are fully supported for iPhone X starting with SDK version 7.26.0.

This guide demonstrates best practices on how to code your apps to render ads correctly on the iPhone X.

Prerequisites

Banner ads must be placed in the "Safe Area" to avoid being obscured by rounded corners, sensor housing, and the Home indicator. On this page you'll find examples of how to add constraints to position a banner to the top or bottom of the Safe Area.

Storyboard/Interface Builder

If your app uses Interface Builder, first, ensure you have enabled Safe Area layout guides. To do this you need to be running Xcode 9+ and targeting iOS 9+.

Open your Interface Builder file and click on your view controller scene. You will see the Interface Builder Document options on the right. Check Use Safe Area Layout Guides and ensure you're building for iOS 9.0 and later as a minimum.

We recommend you constrain the banner to the size required using width and height constraints.

Now you can align the banner to the top of the Safe Area by constraining the GADBannerView's Top property to the top of the Safe Area:

Similarly, you can align the banner to the bottom of the Safe Area by constraining the GADBannerView's Bottom property to the bottom of the safe area:

Your constraints should now look similar to the screenshot below (sizing/positioning can vary):

ViewController

Here's a simple view controller code snippet that does the minimum needed to show a banner in a GADBannerView as configured in the storyboard above:

Swift

classViewController:UIViewController{
/// The banner view.
@IBOutletvarbannerView:BannerView!
overridefuncviewDidLoad(){
super.viewDidLoad()
// Replace this ad unit ID with your own ad unit ID.
bannerView.adUnitID="ca-app-pub-3940256099942544/2934735716"
bannerView.rootViewController=self
bannerView.load(Request())
}
}

Objective-C

@interface ViewController()
@property(nonatomic,strong)IBOutletGADBannerView*bannerView;
@end
@implementation ViewController
- (void)viewDidLoad{
[superviewDidLoad];
// Replace this ad unit ID with your own ad unit ID.
self.bannerView.adUnitID=@"ca-app-pub-3940256099942544/2934735716";
self.bannerView.rootViewController=self;
GADRequest*request=[GADRequestrequest];
[self.bannerViewloadRequest:request];
}

Aligning banners to the edge of safe area

If you wish to have a left- or right-aligned banner, constrain the left/right edge of the banner to the left/right edge of the safe area and not the left/right edge of the superview.

If you have Use Safe Area Layout Guides enabled, interface builder will default to using the safe area edges when adding constraints to the view.

Programmatic

If your app creates banner ads programmatically, you can define constraints and position the banner ad in code. This example shows how to constrain a banner to be centered horizontally at the bottom of the Safe Area:

Swift

classViewController:UIViewController{
varbannerView:BannerView!
overridefuncviewDidLoad(){
super.viewDidLoad()
// Instantiate the banner view with your desired banner size.
bannerView=BannerView(adSize:AdSizeBanner)
addBannerViewToView(bannerView)
bannerView.rootViewController=self
// Set the ad unit ID to your own ad unit ID here.
bannerView.adUnitID="ca-app-pub-3940256099942544/2934735716"
bannerView.load(Request())
}
funcaddBannerViewToView(_bannerView:UIView){
bannerView.translatesAutoresizingMaskIntoConstraints=false
view.addSubview(bannerView)
if#available(iOS11.0,*){
positionBannerAtBottomOfSafeArea(bannerView)
}
else{
positionBannerAtBottomOfView(bannerView)
}
}
@available(iOS11,*)
funcpositionBannerAtBottomOfSafeArea(_bannerView:UIView){
// Position the banner. Stick it to the bottom of the Safe Area.
// Centered horizontally.
letguide:UILayoutGuide=view.safeAreaLayoutGuide
NSLayoutConstraint.activate(
[bannerView.centerXAnchor.constraint(equalTo:guide.centerXAnchor),
bannerView.bottomAnchor.constraint(equalTo:guide.bottomAnchor)]
)
}
funcpositionBannerAtBottomOfView(_bannerView:UIView){
// Center the banner horizontally.
view.addConstraint(NSLayoutConstraint(item:bannerView,
attribute:.centerX,
relatedBy:.equal,
toItem:view,
attribute:.centerX,
multiplier:1,
constant:0))
// Lock the banner to the top of the bottom layout guide.
view.addConstraint(NSLayoutConstraint(item:bannerView,
attribute:.bottom,
relatedBy:.equal,
toItem:self.bottomLayoutGuide,
attribute:.top,
multiplier:1,
constant:0))
}
}

Objective-C

@interface ViewController()
@property(nonatomic,strong)GADBannerView*bannerView;
@end
@implementation ViewController
- (void)viewDidLoad{
[superviewDidLoad];
// Instantiate the banner view with your desired banner size.
self.bannerView=[[GADBannerViewalloc]initWithAdSize:GADAdSizeBanner];
[selfaddBannerViewToView:self.bannerView];
// Replace this ad unit ID with your own ad unit ID.
self.bannerView.adUnitID=@"ca-app-pub-3940256099942544/2934735716";
self.bannerView.rootViewController=self;
GADRequest*request=[GADRequestrequest];
[self.bannerViewloadRequest:request];
}
#pragma mark - view positioning
-(void)addBannerViewToView:(UIView*_Nonnull)bannerView{
self.bannerView.translatesAutoresizingMaskIntoConstraints=NO;
[self.viewaddSubview:self.bannerView];
if(@available(ios11.0,*)){
[selfpositionBannerViewAtBottomOfSafeArea:bannerView];
}else{
[selfpositionBannerViewAtBottomOfView:bannerView];
}
}
- (void)positionBannerViewAtBottomOfSafeArea:(UIView*_Nonnull)bannerViewNS_AVAILABLE_IOS(11.0){
// Position the banner. Stick it to the bottom of the Safe Area.
// Centered horizontally.
UILayoutGuide*guide=self.view.safeAreaLayoutGuide;
[NSLayoutConstraintactivateConstraints:@[
[bannerView.centerXAnchorconstraintEqualToAnchor:guide.centerXAnchor],
[bannerView.bottomAnchorconstraintEqualToAnchor:guide.bottomAnchor]
]];
}
-(void)positionBannerViewAtBottomOfView:(UIView*_Nonnull)bannerView{
[self.viewaddConstraint:[NSLayoutConstraintconstraintWithItem:bannerView
attribute:NSLayoutAttributeCenterX
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeCenterX
multiplier:1
constant:0]];
[self.viewaddConstraint:[NSLayoutConstraintconstraintWithItem:bannerView
attribute:NSLayoutAttributeBottom
relatedBy:NSLayoutRelationEqual
toItem:self.bottomLayoutGuide
attribute:NSLayoutAttributeTop
multiplier:1
constant:0]];
}
@end

The techniques above can easily be used for constraining to the top of the safe area by modifying the attributes and anchors used.

Smart banners

If you're using smart banners, particularly in landscape, we recommend that you use constraints to align the banner edges to the left and right edges of the safe area.

In interface builder, this is supported back to iOS 9 by checking the Use Safe Area Layout Guides option as outlined above.

In code, you should make your edge constraints relative to the safe area layout guides where available. Here is a code snippet which adds a banner view to the view and constrains to the bottom of the view, full-width:

Swift

funcaddBannerViewToView(_bannerView:BannerView){
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]];
}

Native ads

If your app pins native ads to the top or bottom of the screen, the same principles apply for native ads as they do for banner ads. The key difference is instead of adding constraints to a GADBannerView, you'll need to add constraints to your GADNativeAdView (or the containing view for the ad) in order to respect the Safe Area layout guides. For native views we recommend providing more explicit size constraints.

Interstitial and rewarded ads

As of Version 7.26.0, Google Mobile Ads SDK fully supports interstitial and rewarded ad formats for iPhone X.

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies. Java is a registered trademark of Oracle and/or its affiliates.

Last updated 2025年10月17日 UTC.