رندر تبلیغات آیفون X

این راهنما بهترین شیوه‌ها را در مورد نحوه کدنویسی برنامه‌های شما برای نمایش صحیح تبلیغات در آیفون X نشان می‌دهد.

پیش‌نیازها

بنرهای تبلیغاتی باید در «منطقه امن» قرار داده شوند تا از پنهان شدن توسط گوشه‌های گرد، محفظه حسگر و نشانگر صفحه اصلی جلوگیری شود. در این صفحه، نمونه‌هایی از نحوه اضافه کردن محدودیت‌ها برای قرار دادن یک بنر در بالا یا پایین منطقه امن را خواهید یافت. هم محدودیت‌های استوری‌بورد و هم محدودیت‌های برنامه‌نویسی در محیطی که از iOS 9+ و Xcode 9+ پشتیبانی می‌کند، نشان داده شده‌اند. راه‌حل‌هایی برای نسخه‌های قبلی iOS و Xcode نیز ذکر شده است.

استوری‌بورد/سازنده رابط کاربری

اگر برنامه شما از Interface Builder استفاده می‌کند، ابتدا مطمئن شوید که راهنماهای طرح‌بندی Safe Area را فعال کرده‌اید. برای انجام این کار باید Xcode 9+ را اجرا کنید و iOS 9+ را هدف قرار دهید.

فایل سازنده رابط کاربری (Interface Builder) خود را باز کنید و روی صحنه کنترلر نمای (view controller scene) خود کلیک کنید. گزینه‌های سند سازنده رابط کاربری (Interface Builder Document) را در سمت راست مشاهده خواهید کرد. گزینه «استفاده از راهنماهای طرح‌بندی منطقه امن» (Use Safe Area Layout Guides) را علامت بزنید و مطمئن شوید که حداقل برای iOS 9.0 و بالاتر در حال ساخت هستید.

توصیه می‌کنیم با استفاده از محدودیت‌های عرض و ارتفاع، اندازه بنر را به اندازه مورد نیاز محدود کنید.

اکنون می‌توانید با محدود کردن ویژگی Top در GAMBannerView به بالای Safe Area، بنر را در بالای Safe Area تراز کنید:

به طور مشابه، می‌توانید با محدود کردن ویژگی Bottom از GAMBannerView به پایین منطقه امن، بنر را در پایین منطقه امن تراز کنید:

اکنون محدودیت‌های شما باید مشابه تصویر زیر باشند (اندازه/موقعیت می‌تواند متفاوت باشد):

ویوکنترلر

در اینجا یک قطعه کد ساده برای کنترلر نما آورده شده است که حداقل کارهای لازم برای نمایش یک بنر در GAMBannerView را مطابق پیکربندی شده در استوری‌بورد بالا انجام می‌دهد:

سویفت 

class ViewController: UIViewController {

  /// The banner view.
  @IBOutlet var bannerView: AdManagerBannerView!

  override func viewDidLoad() {
    super.viewDidLoad()
    // Replace this ad unit ID with your own ad unit ID.
    bannerView.adUnitID = "/21775744923/example/adaptive-banner"
    bannerView.rootViewController = self
    bannerView.load(AdManagerRequest())
  }

}

هدف-سی 

@interface ViewController()

@property(nonatomic, strong) IBOutlet GAMBannerView *bannerView;

@end

@implementation ViewController

- (void)viewDidLoad {
  [super viewDidLoad];

  // Replace this ad unit ID with your own ad unit ID.
  self.bannerView.adUnitID = @"/21775744923/example/adaptive-banner";
  self.bannerView.rootViewController = self;
  GAMRequest *request = [GAMRequest request];
  [self.bannerView loadRequest:request];
}

تراز کردن بنرها با لبه منطقه امن

اگر می‌خواهید یک بنر تمام عرض، چپ یا راست‌چین داشته باشید، لبه چپ/راست بنر را به لبه چپ/راست منطقه امن محدود کنید و نه به لبه چپ/راست نمای بالا.

اگر گزینه‌ی «استفاده از راهنماهای طرح‌بندی ناحیه‌ی امن» را فعال کرده باشید، سازنده‌ی رابط کاربری هنگام افزودن محدودیت به نما، به‌طور پیش‌فرض از لبه‌های ناحیه‌ی امن استفاده می‌کند.

پشتیبانی از iOS 8 و پایین‌تر

اگر می‌خواهید با استفاده از Interface Builder از iOS 8 یا پایین‌تر پشتیبانی کنید، باید تیک گزینه‌ی Use Safe Area Layout Guides را برای فایل‌ها و استوری‌بوردهای Interface Builder خود بردارید.

اکنون می‌توانید محدودیت‌ها را به پایین راهنمای طرح‌بندی بالا (به جای بالای منطقه امن) اضافه کنید:

همچنین قیدهایی را به بالای راهنمای طرح‌بندی پایینی (به جای پایین منطقه امن) اضافه کنید:

برای بنرهای تمام عرض (فقط در حالت افقی تحت تأثیر Safe Area قرار می‌گیرند)، این راهنماهای طرح‌بندی وجود ندارند. گزینه‌ی Safe در Interface Builder، ایجاد محدودیت‌های لبه‌ی چپ و راست نسبت به حاشیه‌ها است:

این کار لبه بنر را کمی از لبه نمای بالا/منطقه امن فاصله می‌دهد و تضمین می‌کند که بنر شما در حالت افقی در آیفون X مبهم نخواهد شد. همچنین می‌توانید به صورت برنامه‌نویسی به نتیجه دلخواه برسید.

برنامه‌ای

اگر برنامه شما بنرهای تبلیغاتی را به صورت برنامه‌نویسی شده ایجاد می‌کند، می‌توانید محدودیت‌ها را تعریف کرده و بنر تبلیغاتی را در کد قرار دهید. این مثال (برای iOS نسخه ۷.۰ و بالاتر) نحوه محدود کردن یک بنر به قرار گرفتن افقی در مرکز پایین منطقه امن را نشان می‌دهد:

سویفت 

class ViewController: UIViewController {

  var bannerView: AdManagerBannerView!

  override func viewDidLoad() {
    super.viewDidLoad()

    // Instantiate the banner view with your desired banner size.
    bannerView = AdManagerBannerView(adSize: AdSizeBanner)
    addBannerViewToView(bannerView)
    bannerView.rootViewController = self
    // Set the ad unit ID to your own ad unit ID here.
    bannerView.adUnitID = "/21775744923/example/adaptive-banner"
    bannerView.load(AdManagerRequest())
  }

  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))
  }

}

هدف-سی 

@interface ViewController()

@property(nonatomic, strong) GAMBannerView *bannerView;

@end

@implementation ViewController

- (void)viewDidLoad {
  [super viewDidLoad];

  // Instantiate the banner view with your desired banner size.
  self.bannerView = [[GAMBannerView alloc] initWithAdSize:kGADAdSizeBanner];
  [self addBannerViewToVIew:self.bannerView];

  // Replace this ad unit ID with your own ad unit ID.
  self.bannerView.adUnitID = @"/21775744923/example/adaptive-banner";
  self.bannerView.rootViewController = self;
  GAMRequest *request = [GAMRequest 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

تکنیک‌های فوق را می‌توان به راحتی با تغییر ویژگی‌ها و لنگرهای مورد استفاده، برای محدود کردن به بالای منطقه امن استفاده کرد.

تبلیغات بومی

اگر برنامه شما تبلیغات بومی را به بالا یا پایین صفحه نمایش پین می‌کند، همان اصولی که برای تبلیغات بنری اعمال می‌شود، برای تبلیغات بومی نیز اعمال می‌شود. تفاوت کلیدی این است که به جای اضافه کردن محدودیت به GAMBannerView ، باید محدودیت‌هایی را به GADNativeAppInstallAdView و GADNativeContentAdView (یا نمای حاوی تبلیغ) اضافه کنید تا از راهنماهای طرح‌بندی Safe Area پیروی کند. برای نماهای بومی، توصیه می‌کنیم محدودیت‌های اندازه صریح‌تری ارائه دهید.

تبلیغات بینابینی و پاداشی

قالب‌های تبلیغاتی تمام صفحه، شامل تبلیغات بینابینی و تبلیغات جایزه‌دار، توسط SDK تبلیغات موبایلی گوگل رندر می‌شوند. به‌روزرسانی‌ای برای SDK تبلیغات موبایلی گوگل منتشر خواهد شد تا اطمینان حاصل شود که عناصر تبلیغاتی مانند دکمه بستن در جای درست رندر می‌شوند. ما یادداشت‌های انتشار و این صفحه مستندات را به محض در دسترس قرار گرفتن این تغییر به‌روزرسانی خواهیم کرد.