In diesem Leitfaden finden Sie Best Practices zur Codierung Ihrer Apps für das Rendern von Anzeigen. auf dem iPhone X korrekt.
Vorbereitung
- Importieren Sie Version 7.26.0 oder höher des Google Mobile Ads SDK, entweder selbst oder Teil von Firebase sein.
Banneranzeigen
Banneranzeigen müssen im „Sicher Area“ um zu vermeiden, dass sie durch abgerundete Ecken, das Sensorgehäuse und das Google Home-Gerät verdeckt werden. . Auf dieser Seite finden Sie Beispiele dafür, wie Sie Platzieren Sie ein Banner oben oder unten im Sicherheitsbereich.
Storyboard/Schnittstellenersteller
Wenn Ihre App den Interface Builder verwendet, muss der sichere Bereich zuerst aktiviert sein Layoutleitfäden. Dazu müssen Sie Xcode 9 oder höher ausführen und iOS 9 oder höher verwenden.
Öffnen Sie Ihre Interface Builder-Datei und klicken Sie auf Ihre Controller-Szene anzeigen. Ich werden rechts die Optionen Interface Builder Document angezeigt. Aktivieren Sie das Kontrollkästchen Verwenden Richtlinien für den sicheren Bereich und achten Sie darauf, dass Sie Apps für iOS 9.0 und höher erstellen. mindestens so wichtig sind.
Wir empfehlen, die Größe des Banners mithilfe von Breite und Höhenbeschränkungen.
Jetzt können Sie das Banner am oberen Rand des Sicherheitsbereichs ausrichten, indem Sie die Die Top-Eigenschaft von GADBannerView an der Spitze des sicheren Bereichs:
Ebenso können Sie das Banner am unteren Rand des Sicherheitsbereichs ausrichten, indem Sie durch Einschränken der Bottom-Eigenschaft von GADBannerView auf den unteren Gebiet:
Die Einschränkungen sollten nun ähnlich wie im Screenshot unten aussehen. (Größe/Positionierung kann variieren):
ViewController
Hier ist ein einfaches Code-Snippet für einen Controller
Banner in einem GADBannerView anzeigen, wie im Storyboard oben konfiguriert:
Swift
class ViewController: UIViewController {
/// The banner view.
@IBOutlet var bannerView: GADBannerView!
override func viewDidLoad() {
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(GADRequest())
}
}
Objective-C
@interface ViewController()
@property(nonatomic, strong) IBOutlet GADBannerView *bannerView;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// 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 = [GADRequest request];
[self.bannerView loadRequest:request];
}
Banner am Rand des sicheren Bereichs ausrichten
Wenn Sie ein links- oder rechtsbündiges Banner haben möchten, linken/rechten Rand des Banners am linken/rechten Rand des sicheren Bereichs. und nicht den linken/rechten Rand der Superview.
Wenn Sie Richtlinien für sichere Bereiche verwenden aktiviert haben, zeigt der Interface Builder beim Hinzufügen von Einschränkungen zur Ansicht standardmäßig die Ränder des sicheren Bereichs verwendet werden.
Programmatic
Wenn Ihre App programmatisch Banneranzeigen erstellt, können Sie Beschränkungen und um die Banneranzeige im Code zu positionieren. In diesem Beispiel wird gezeigt, wie Sie werden unten im Sicherheitsbereich horizontal zentriert:
Swift
class ViewController: UIViewController {
var bannerView: GADBannerView!
override func viewDidLoad() {
super.viewDidLoad()
// Instantiate the banner view with your desired banner size.
bannerView = GADBannerView(adSize: GADAdSizeBanner)
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(GADRequest())
}
func addBannerViewToView(_ bannerView: UIView) {
bannerView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(bannerView)
if #available(iOS 11.0, *) {
positionBannerAtBottomOfSafeArea(bannerView)
}
else {
positionBannerAtBottomOfView(bannerView)
}
}
@available (iOS 11, *)
func positionBannerAtBottomOfSafeArea(_ bannerView: UIView) {
// Position the banner. Stick it to the bottom of the Safe Area.
// Centered horizontally.
let guide: UILayoutGuide = view.safeAreaLayoutGuide
NSLayoutConstraint.activate(
[bannerView.centerXAnchor.constraint(equalTo: guide.centerXAnchor),
bannerView.bottomAnchor.constraint(equalTo: guide.bottomAnchor)]
)
}
func positionBannerAtBottomOfView(_ 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 {
[super viewDidLoad];
// Instantiate the banner view with your desired banner size.
self.bannerView = [[GADBannerView alloc] initWithAdSize:GADAdSizeBanner];
[self addBannerViewToView: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 = [GADRequest request];
[self.bannerView loadRequest:request];
}
#pragma mark - view positioning
-(void)addBannerViewToView:(UIView *_Nonnull)bannerView {
self.bannerView.translatesAutoresizingMaskIntoConstraints = NO;
[self.view addSubview:self.bannerView];
if (@available(ios 11.0, *)) {
[self positionBannerViewAtBottomOfSafeArea:bannerView];
} else {
[self positionBannerViewAtBottomOfView:bannerView];
}
}
- (void)positionBannerViewAtBottomOfSafeArea:(UIView *_Nonnull)bannerView NS_AVAILABLE_IOS(11.0) {
// Position the banner. Stick it to the bottom of the Safe Area.
// Centered horizontally.
UILayoutGuide *guide = self.view.safeAreaLayoutGuide;
[NSLayoutConstraint activateConstraints:@[
[bannerView.centerXAnchor constraintEqualToAnchor:guide.centerXAnchor],
[bannerView.bottomAnchor constraintEqualToAnchor:guide.bottomAnchor]
]];
}
- (void)positionBannerViewAtBottomOfView:(UIView *_Nonnull)bannerView {
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:bannerView
attribute:NSLayoutAttributeCenterX
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeCenterX
multiplier:1
constant:0]];
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:bannerView
attribute:NSLayoutAttributeBottom
relatedBy:NSLayoutRelationEqual
toItem:self.bottomLayoutGuide
attribute:NSLayoutAttributeTop
multiplier:1
constant:0]];
}
@end
Mit den oben beschriebenen Methoden können Sie die Sicherheit im Safe ganz einfach oben einschränken. indem Sie die verwendeten Attribute und Anker ändern.
Smart-Banner
Wenn Sie Smart-Banner verwenden, insbesondere im Querformat, Verwenden Sie Fixierungen, um die Bannerkanten am linken und rechten Rand des Sicherheitsbereich.
Im Interface Builder wird dies ab iOS 9 durch Aktivieren des Option Sicherheitslinien für Layoutrichtlinien verwenden wie oben beschrieben.
Im Code sollten Sie Ihre Randbeschränkungen relativ zum sicheren Bereich festlegen. Layoutleitfäden, sofern verfügbar. Hier sehen Sie ein Code-Snippet, mit dem eine Banneransicht hinzugefügt wird. zur Ansicht und beschränkt sich auf den unteren Rand der Ansicht, in voller Breite:
Swift
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)
}
}
// MARK: - view positioning
@available (iOS 11, *)
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))
}
Objective-C
- (void)addBannerViewToView:(UIView *)bannerView {
bannerView.translatesAutoresizingMaskIntoConstraints = NO;
[self.view addSubview:bannerView];
if (@available(ios 11.0, *)) {
// In iOS 11, we need to constrain the view to the safe area.
[self positionBannerViewFullWidthAtBottomOfSafeArea:bannerView];
} else {
// In lower iOS versions, safe area is not available so we use
// bottom layout guide and view edges.
[self positionBannerViewFullWidthAtBottomOfView:bannerView];
}
}
#pragma mark - view positioning
- (void)positionBannerViewFullWidthAtBottomOfSafeArea:(UIView *_Nonnull)bannerView NS_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;
[NSLayoutConstraint activateConstraints:@[
[guide.leftAnchor constraintEqualToAnchor:bannerView.leftAnchor],
[guide.rightAnchor constraintEqualToAnchor:bannerView.rightAnchor],
[guide.bottomAnchor constraintEqualToAnchor:bannerView.bottomAnchor]
]];
}
- (void)positionBannerViewFullWidthAtBottomOfView:(UIView *_Nonnull)bannerView {
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:bannerView
attribute:NSLayoutAttributeLeading
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeLeading
multiplier:1
constant:0]];
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:bannerView
attribute:NSLayoutAttributeTrailing
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeTrailing
multiplier:1
constant:0]];
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:bannerView
attribute:NSLayoutAttributeBottom
relatedBy:NSLayoutRelationEqual
toItem:self.bottomLayoutGuide
attribute:NSLayoutAttributeTop
multiplier:1
constant:0]];
}
Native Anzeigen
Wenn Ihre App native Anzeigen oben oder unten auf dem Bildschirm angeheftet,
gelten für native Anzeigen genauso wie für Banneranzeigen.
Der Hauptunterschied besteht darin,
einem GADBannerView Einschränkungen hinzuzufügen,
müssen Einschränkungen für GADUnifiedNativeAdView (oder die enthaltende Ansicht) hinzugefügt werden.
für die Anzeige), um die Layoutrichtlinien für den sicheren Bereich einzuhalten. Für native Ansichten
empfehlen wir, explizitere Größenbeschränkungen anzugeben.
Interstitial-Anzeigen und Anzeigen mit Prämie
Ab Version 7.26.0 unterstützt das Google Mobile Ads SDK Interstitial- und Anzeigenformate mit Prämie für das iPhone X