Bu kılavuzda, reklamları iPhone X'te doğru şekilde oluşturmak için uygulamalarınızı nasıl kodlayacağınızla ilgili en iyi uygulamalar gösterilmektedir.
Ön koşullar
- Google Mobile Ads SDK'sının 7.26.0 veya üzeri sürümünü (kendi başına ya da Firebase'in bir parçası olarak) içe aktarın.
Banner reklamlar
Banner reklamlar, yuvarlatılmış köşeler, sensör yuvası ve Ana Ekran göstergesi tarafından engellenmemeleri için "Güvenli Alan"a yerleştirilmelidir. Bu sayfada, bir banner'ı Güvenli Alanın üst veya alt kısmına konumlandırmak için nasıl sınırlamalar ekleyeceğinizi gösteren örnekler bulacaksınız.
Resimli Taslak/Arayüz Oluşturucu
Uygulamanız Arayüz Oluşturucu'yu kullanıyorsa öncelikle Güvenli Alan düzen kılavuzlarını etkinleştirdiğinizden emin olun. Bunu yapmak için Xcode 9 ve sonraki sürümlerini çalıştırmanız ve iOS 9 ve sonraki sürümleri hedeflemeniz gerekir.
Arayüz Oluşturucu dosyanızı açın ve görünüm denetleyicisi sahnenizi tıklayın. Sağda Interface Builder Document (Arayüz Oluşturucu Belgesi) seçeneklerini görürsünüz. Güvenli Alan Yerleşimi Kılavuzları Kullan'ı işaretleyin ve en azından iOS 9.0 ve sonraki sürümler için oluşturduğunuzdan emin olun.
Genişlik ve yükseklik kısıtlamalarını kullanarak banner'ı gereken boyutla sınırlandırmanızı öneririz.
Artık GADBannerView'un Üst özelliğini Güvenli Alan'ın üst kısmına sınırlayarak banner'ı Güvenli Alanın üst kısmına hizalayabilirsiniz:
Benzer şekilde, GADBannerView'un Alt özelliğini güvenli alanın alt kısmıyla sınırlayarak banner'ı Güvenli Alanın alt kısmına hizalayabilirsiniz:
Kısıtlamalarınız artık aşağıdaki ekran görüntüsüne benzeyecektir (boyutlandırma/konumlandırma değişiklik gösterebilir):
ViewController
Aşağıda, yukarıdaki film şeridinde yapılandırıldığı gibi, GADBannerView öğesinde banner göstermek için gereken minimum işlemi gerçekleştiren basit görünüm denetleyicisi kod snippet'i verilmiştir:
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'ları güvenli alanın kenarına hizalama
Sola veya sağa hizalanan bir banner kullanmak istiyorsanız banner'ın sol/sağ kenarını güvenli alanın sol/sağ kenarıyla sınırlayın (süper görünümün sol/sağ kenarıyla değil).
Güvenli Alan Yerleşimi Kılavuzları Kullan'ı etkinleştirdiyseniz arayüz oluşturucu, görünüme sınırlamalar eklerken varsayılan olarak güvenli alan kenarlarını kullanır.
Programatik
Uygulamanız banner reklamları programatik olarak oluşturuyorsa kısıtlamalar tanımlayabilir ve banner reklamı kod içinde konumlandırabilirsiniz. Bu örnekte, bir banner'ın Güvenli Alanın alt kısmında yatay olarak ortalanacak şekilde nasıl sınırlanacağı gösterilmektedir:
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
Yukarıdaki teknikler, kullanılan öznitelikleri ve bağlayıcıları değiştirerek güvenli alanın üst kısmıyla sınırlamak için kolayca kullanılabilir.
Akıllı banner'lar
Özellikle yatay modda akıllı banner'lar kullanıyorsanız banner kenarlarını güvenli alanın sol ve sağ kenarlarıyla hizalamak için sınırlamalar kullanmanızı öneririz.
Arayüz oluşturucuda bu, yukarıda açıklandığı gibi Güvenli Alan Yerleşimi Kılavuzlarını Kullan seçeneği işaretlenerek iOS 9'a kadar desteklenir.
Kodda, kenar kısıtlamalarınızı mümkün olduğunda güvenli alan düzeni kılavuzlarına göre yapmanız gerekir. Görünüme bir banner görünümü ekleyen ve görünümün alt kısmıyla, tam genişlikte sınırlayan bir kod snippet'ini burada görebilirsiniz:
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]];
}
Yerel reklamlar
Uygulamanız yerel reklamları ekranın üst veya alt kısmına sabitliyorsa yerel reklamlar için de banner reklamlar için geçerli olan ilkeler geçerlidir.
Aralarındaki temel fark, GADBannerView öğesine kısıtlamalar eklemektir. Güvenli Alan düzen kılavuzlarına uymak için GADUnifiedNativeAdView öğenize (veya reklamın bulunduğu görünüme) kısıtlamalar eklemeniz gerekir. Yerel görünümler için daha açık boyut kısıtlamaları sağlamanızı öneririz.
Geçiş reklamları ve ödüllü reklamlar
Sürüm 7.26.0'dan itibaren, Google Mobile Ads SDK'sı iPhone X için geçiş ve ödüllü reklam biçimlerini tam olarak desteklemektedir.