इस गाइड में iPhone X पर अपने ऐप्लिकेशन को सही तरीके से विज्ञापन दिखाने के लिए कोड करने के सबसे सही तरीके बताए गए हैं.
ज़रूरी शर्तें
- Google Mobile Ads SDK के 7.26.0 या इसके बाद वाले वर्शन को इंपोर्ट करें. ऐसा अपने-आप या Firebase के हिस्से के तौर पर किया जा सकता है.
बैनर विज्ञापन
बैनर विज्ञापनों को "सुरक्षित जगह" पर रखा जाना चाहिए, ताकि गोल कोने, सेंसर हाउस, और होम इंंडिकेटर न दिखें. इस पेज पर आपको, बैनर को सुरक्षित जगह के सबसे ऊपर या सबसे नीचे रखने के लिए, पाबंदियां जोड़ने के तरीके के उदाहरण मिलेंगे.
स्टोरीबोर्ड/इंटरफ़ेस बिल्डर
अगर आपके ऐप्लिकेशन में इंटरफ़ेस बिल्डर का इस्तेमाल किया जाता है, तो पक्का करें कि आपने सुरक्षित इलाके की लेआउट गाइड चालू की हो. ऐसा करने के लिए आपको Xcode 9+ चलाना होगा और iOS 9+ को टारगेट करना होगा.
अपनी Interface Builder फ़ाइल खोलें और अपने व्यू कंट्रोलर सीन पर क्लिक करें. आपको दाईं ओर इंटरफ़ेस बिल्डर दस्तावेज़ के विकल्प दिखेंगे. सुरक्षित एरिया लेआउट गाइड इस्तेमाल करें देखें और पक्का करें कि आपने कम से कम iOS 9.0 और उसके बाद के वर्शन बनाए हों.
हमारा सुझाव है कि आप बैनर का साइज़ उतना ही रखें जितना चौड़ाई और ऊंचाई के लिए ज़रूरी है.
अब GADBannerView की टॉप प्रॉपर्टी को सुरक्षित जगह के सबसे ऊपर सीमित करके, बैनर को सुरक्षित जगह पर अलाइन करें:
इसी तरह, GADBannerView की निचली प्रॉपर्टी को सुरक्षित जगह के नीचे सीमित करके, बैनर को सुरक्षित जगह के निचले हिस्से में अलाइन किया जा सकता है:
कंस्ट्रेंट अब नीचे दिए गए स्क्रीनशॉट की तरह दिखने चाहिए (साइज़/स्थिति अलग-अलग हो सकती है):
ViewController
यहां एक सामान्य व्यू कंट्रोलर कोड स्निपेट दिया गया है, जो ऊपर दिए गए स्टोरीबोर्ड में कॉन्फ़िगर किए गए GADBannerView में बैनर दिखाने के लिए कम से कम ज़रूरी काम करता है:
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];
}
बैनर को सुरक्षित जगह के किनारे पर अलाइन करना
अगर आपको बैनर का बायां या दायां हिस्सा अलाइन है, तो बैनर के बाएं/दाएं किनारे को सेफ़ एरिया के बाएं/दाएं किनारे तक सीमित करें और सुपरव्यू के बाएं/दाएं किनारे तक नहीं.
अगर सुरक्षित जगह की लेआउट गाइड इस्तेमाल करें की सुविधा चालू है, तो व्यू में कंस्ट्रेंट जोड़ते समय इंटरफ़ेस बिल्डर, डिफ़ॉल्ट रूप से सेफ़ एरिया के किनारों का इस्तेमाल करेगा.
प्रोग्रामेटिक
अगर आपका ऐप्लिकेशन प्रोग्राम के हिसाब से बैनर विज्ञापन बनाता है, तो सीमाएं तय की जा सकती हैं और बैनर विज्ञापन को कोड में रखा जा सकता है. इस उदाहरण में बताया गया है कि बैनर को सेफ़ एरिया के सबसे नीचे, हॉरिज़ॉन्टल तौर पर बीच में कैसे लाएं:
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
ऊपर बताई गई तकनीकों का इस्तेमाल करके, सुरक्षित जगह के सबसे ऊपर सीमित करने के लिए आसानी से इस्तेमाल किया जा सकता है. ऐसा करने के लिए, इस्तेमाल किए गए एट्रिब्यूट और ऐंकर में बदलाव किए जाते हैं.
स्मार्ट बैनर
अगर आप खास तौर पर लैंडस्केप में स्मार्ट बैनर का इस्तेमाल कर रहे हैं, तो हमारा सुझाव है कि आप बैनर के किनारों को सुरक्षित जगह के बाएं और दाएं किनारों पर अलाइन करने के लिए, पाबंदियों का इस्तेमाल करें.
इंटरफ़ेस बिल्डर में, यह iOS 9 पर फिर से काम करता है. इसके लिए, ऊपर बताए गए तरीके से सुरक्षित इलाके के लेआउट गाइड का इस्तेमाल करें विकल्प चुनें.
कोड में, आपको अपने किनारे के प्रतिबंधों को, जहां उपलब्ध हो, सुरक्षित क्षेत्र लेआउट गाइड के सापेक्ष बनाना चाहिए. यहां एक कोड स्निपेट दिया गया है, जो व्यू में बैनर व्यू जोड़ता है और व्यू के निचले हिस्से में, पूरी-चौड़ाई में सीमित कर देता है:
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]];
}
नेटिव विज्ञापन
अगर आपका ऐप्लिकेशन नेटिव विज्ञापनों को स्क्रीन के ऊपर या नीचे पिन करता है, तो नेटिव विज्ञापनों पर भी वही सिद्धांत लागू होंगे जो बैनर विज्ञापनों पर लागू होते हैं.
मुख्य अंतर यह है कि GADBannerView में पाबंदियां जोड़ने के बजाय, सुरक्षित जगह की लेआउट गाइड का पालन करने के लिए, आपको अपने GADUnifiedNativeAdView (या विज्ञापन के लिए दिखाए जाने वाले व्यू) में पाबंदियां जोड़नी होंगी. नेटिव व्यू के लिए, हमारा सुझाव है कि आप साइज़ के बारे में साफ़ तौर पर बताएं.
इंटरस्टीशियल विज्ञापन और इनाम वाले विज्ञापन
वर्शन 7.26.0 से, Google Mobile Ads SDK पर iPhone X के लिए पेज पर अचानक दिखने वाले और इनाम वाले विज्ञापन फ़ॉर्मैट पूरी तरह से काम करते हैं.