لمناقشة منتجاتنا وتقديم ملاحظات بشأنها، انضمّ إلى قناة Discord الرسمية في منتدى Google للإعلان وقياس الأداء.

تمت ترجمة هذه الصفحة بواسطة Cloud Translation API‏.

عرض إعلانات iPhone X

يوضّح هذا الدليل أفضل الممارسات حول كيفية ترميز تطبيقاتك لعرض الإعلانات بشكل صحيح على هاتف iPhone X.

المتطلبات الأساسية

استورِد الإصدار 7.26.0 أو إصدارًا أحدث من حزمة تطوير البرامج (SDK) لإعلانات Google على الأجهزة الجوّالة، إما بشكل مستقل أو كجزء من Firebase.

إعلانات البانر

يجب وضع إعلانات البانر في "المنطقة الآمنة" لتجنّب حجبها بالأركان المستديرة وصندوق أداة الاستشعار ومؤشّر الصفحة الرئيسية. في هذه الصفحة، ستجد أمثلة حول كيفية إضافة قيود على موضع إعلان البانر ليظهر في أعلى "المنطقة الآمنة" أو أسفلها.

أداة إنشاء لوحات ترتيب الصور/واجهات المستخدم

إذا كان تطبيقك يستخدم Interface Builder، عليك أولاً التأكّد من تفعيل أدلة تصميم "مساحة العرض الآمنة". لإجراء ذلك، يجب أن تستخدم Xcode 9 أو إصدارًا أحدث وتستهدف نظام التشغيل iOS 9 أو إصدارًا أحدث.

افتح ملف Interface Builder وانقر على مشهد وحدة التحكّم في العرض. ستظهر لك خيارات مستند Interface Builder على اليسار. ضَع علامة في المربّع بجانب استخدام أدلة تخطيط منطقة آمنة (Use Safe Area Layout Guides) وتأكَّد من أنّك تستخدم الإصدار 9.0 من نظام التشغيل iOS أو إصدارًا أحدث كحدّ أدنى.

ننصحك بتقييد عرض البانر وارتفاعه بالحجم المطلوب.

يمكنك الآن محاذاة البانر مع أعلى "المنطقة الآمنة" من خلال تقييد السمة Top الخاصة بـ GADBannerView بأعلى "المنطقة الآمنة":

وبالمثل، يمكنك محاذاة البانر مع أسفل "المنطقة الآمنة" من خلال وضع قيد على السمة Bottom الخاصة بـ GADBannerView لتكون في أسفل "المنطقة الآمنة":

يجب أن تبدو القيود الآن مشابهة للقطة الشاشة أدناه (يمكن أن يختلف الحجم/الموضع):

ViewController

في ما يلي مقتطف بسيط من رمز وحدة التحكّم في العرض يوفّر الحد الأدنى المطلوب لعرض بانر في GADBannerView كما تم إعداده في لوحة العرض التوضيحي أعلاه:

Swift

class ViewController: UIViewController {

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

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

}

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];
}

محاذاة البانرات مع حافة المنطقة الآمنة

إذا كنت تريد عرض بانر محاذٍ لليسار أو لليمين، عليك ربط الحافة اليسرى/اليمنى للبانر بالحافة اليسرى/اليمنى لمنطقة العرض الآمنة وليس بالحافة اليسرى/اليمنى للعرض الفائق.

في حال تفعيل الخيار استخدام أدلة تخطيط المنطقة الآمنة، سيستخدم Interface Builder تلقائيًا حواف المنطقة الآمنة عند إضافة قيود إلى العرض.

آلية

إذا كان تطبيقك ينشئ إعلانات بانر آليًا، يمكنك تحديد قيود وتحديد موضع إعلان البانر في الرمز. يوضّح هذا المثال كيفية وضع قيود على إعلان بانر ليتم توسيطه أفقيًا في أسفل "المنطقة الآمنة":

Swift

class ViewController: UIViewController {

  var bannerView: BannerView!

  override func viewDidLoad() {
    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())
  }

  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

يمكن استخدام التقنيات المذكورة أعلاه بسهولة لفرض قيود على أعلى المنطقة الآمنة من خلال تعديل السمات وعناصر الربط المستخدَمة.

إعلانات البانر الذكية

إذا كنت تستخدم البانرات الذكية، لا سيما في الوضع الأفقي، ننصحك باستخدام قيود لمحاذاة حواف البانر مع الحافتين اليمنى واليسرى لمنطقة العرض الآمنة.

في أداة إنشاء واجهات المستخدم، يتوفّر هذا الخيار للإصدار iOS 9 والإصدارات الأحدث من خلال وضع علامة في المربّع بجانب الخيار استخدام أدلة تخطيط المنطقة الآمنة كما هو موضّح أعلاه.

في الرمز البرمجي، يجب أن تكون قيود الحواف مرتبطة بأدلة التنسيق الخاصة بمنطقة العرض الآمنة حيثما كان ذلك متاحًا. إليك مقتطف رمز برمجي يضيف عرض بانر إلى العرض ويقيده بأسفل العرض، بعرض كامل:

Swift

func addBannerViewToView(_ bannerView: BannerView) {
  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]];
}

إعلانات مدمجة مع المحتوى

إذا كان تطبيقك يثبّت الإعلانات المدمجة مع المحتوى في أعلى الشاشة أو أسفلها، تنطبق المبادئ نفسها على الإعلانات المدمجة مع المحتوى كما تنطبق على إعلانات البانر. والاختلاف الرئيسي هو أنّه بدلاً من إضافة قيود إلى GADBannerView، عليك إضافة قيود إلى GADNativeAdView (أو طريقة العرض التي تحتوي على الإعلان) من أجل الالتزام بأدلة تصميم "المساحة الآمنة". بالنسبة إلى طرق العرض المدمجة مع المحتوى، ننصحك بتقديم قيود أكثر وضوحًا بشأن الحجم.

الإعلانات البينية والإعلانات مقابل مكافآت

اعتبارًا من الإصدار 7.26.0، تتوافق حزمة تطوير البرامج (SDK) لإعلانات Google على الأجهزة الجوّالة بشكل كامل مع أشكال الإعلانات البينية والإعلانات مقابل مكافآت على هاتف iPhone X.

عرض إعلانات iPhone X تنظيم صفحاتك في مجموعات يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.

المتطلبات الأساسية

إعلانات البانر

أداة إنشاء لوحات ترتيب الصور/واجهات المستخدم

ViewController

Swift

Objective-C

محاذاة البانرات مع حافة المنطقة الآمنة

آلية

Swift

Objective-C

إعلانات البانر الذكية

Swift

Objective-C

إعلانات مدمجة مع المحتوى

الإعلانات البينية والإعلانات مقابل مكافآت

عرض إعلانات iPhone X