iOS 原生广告服务集成
通过创建和加载原生广告对象、实现委托、设计视图和绑定广告内容来集成原生广告服务。
阅读时间9 分钟最后更新于 2 天前
原生广告服务是一种可以自定义的广告形式,可与 app 中的其他内容混合。这使得广告服务看起来更有机,从而带来更好的用户体验和更高的留存率。
先决条件
确保已将 LevelPlay SDK 8.4.0+ 正确集成到应用程序中。此处概述了集成。
集成原生广告服务
要集成原生广告服务,您需要遵循以下五个步骤:
- 创建并加载原生广告对象
- 实现委托
- 设计视图并将其绑定
- 显示原生广告
- 销毁原生广告
步骤 1。创建和加载原生广告对象
-
使用 LevelPlayNativeAdBuilder 类创建原生广告对象,允许自定义对象配置。我们建议创建一个单独的类管理原生广告服务加载机制。LevelPlayNativeAd *levelPlayNativeAd = [[LevelPlayNativeAdBuilder new] withViewController:self] withPlacementName:YOUR_PLACEMENT_NAME] // 替换为广告位或留空withDelegate:self] // We implement the delegate in step 2.build;let levelPlayNativeAd:LevelPlayNativeAd = LevelPlayNativeAdBuilder() .withViewController(self) .withPlacementName(YOUR_PLACEMENT_NAME) // 替换为广告位或留空 .withDelegate(self) .build()确保在向用户展示原生广告之前不久创建原生广告,因为加载过程可能需要一些时间。建议不要在短时间内连续发出请求,因为可用性更改的可能性很低。
-
构建广告对象后,加载原生广告并创建一个 NativeAdView 类型的新视图。通过委托的 didLoad 回调加载广告时,系统会通知您。[levelPlayNativeAd loadAd];NativeAdView *levelPlayNativeAdView = [[NativeAdView alloc] init];levelPlayNativeAd.load()let levelPlayNativeAdView = NativeAdView()我们建议保留对原生广告及其相应视图的引用。这些引用将用于在触发 didLoad 回调后填充视图。@property(非原子、强) LevelPlayNativeAd *nativeAd;@property(非原子、强)NativeAdView *nativeAdView; //我们在步骤 3 中定义了 NativeAdView私有变量 var nativeAd:LevelPlayNativeAd!私有变量 var nativeAdView:NativeAdView! //我们在步骤 3 中定义了 NativeAdView确保在加载广告和初始化视图后保持这些引用。_nativeAd = levelPlayNativeAd; _nativeAdView = levelPlayNativeAdView;nativeAd = levelPlayNativeAd nativeAdView = levelPlayNativeAdView
步骤 2.实现委托
在代码中实现 LevelPlayNativeAdDelegate。LevelPlay SDK 会触发多个回调来通知您原生广告活动。SDK 将通知监听器以下列出的所有事件:
// LevelPlayNativeAdDelegate/** 成功加载原生广告后调用 @param nativeAd Level 播放原生广告。 @param adInfo 广告的信息。 */-(void)didLoad:(LevelPlayNativeAd *)nativeAd withAdInfo:(ISAdInfo *)adInfo{}/** 在本机尝试加载广告但失败后调用。 @param nativeAd Level 播放原生广告。 @param 报错 报错原因 */-(void)didFailToLoad:(LevelPlayNativeAd *)nativeAd withError:(NSError *) 报错;{}/** 在记录原生广告展示后调用。 @param nativeAd Level 播放原生广告。 @param adInfo 广告的信息。 */-(void)didRecordImpression:(LevelPlayNativeAd *)nativeAd withAdInfo:(ISAdInfo *)adInfo{}/** 在点击原生广告后调用。 @param nativeAd Level 播放原生广告。 @param adInfo 广告的信息。 */-(void)didClick:(LevelPlayNativeAd *)nativeAd withAdInfo:(ISAdInfo *)adInfo;{}
// LevelPlayNativeAdDelegate/** 成功加载原生广告后调用 @param nativeAd Level 播放原生广告。 @param adInfo 广告的信息。 */ func didLoad(_ nativeAd:LevelPlayNativeAd,包含 adInfo:ISAdInfo) {/** 在本机尝试加载广告但失败后调用。 @param nativeAd Level 播放原生广告。 @param 报错 报错原因 */ func didFail(_ nativeAd:LevelPlayNativeAd,错误报错:报错) { /** 在记录原生广告展示后调用。 @param nativeAd Level 播放原生广告。 @param adInfo 广告的信息。 */ func didRecordImpression(_ nativeAd:LevelPlayNativeAd,包含 adInfo:ISAdInfo) { /** 在点击原生广告后调用。 @param nativeAd Level 播放原生广告。 @param adInfo 广告的信息。 */ func didClick(_ nativeAd:LevelPlayNativeAd,包含 adInfo:ISAdInfo) {
步骤 3.设计原生广告视图并将其绑定
在加载原生广告之前,您需要创建一个新视图,进行绑定,并手动设置所有相关信息。这包括按如下所示排列不同的资源。
-
下载以下视图 (.xib) 文件并将其导入项目,然后将其添加到项目的目标。该文件包含将保存原生广告资源的视图。使用 Interface Builder 可根据 app 的设计自定义组件。修改 .xib 文件时,避免断开组件与其预定义插座的连接。该设计包括以下组件:
- 视图 #1:adAppIcon (UIImageView)
- 视图 #2:adTitleView (UILabel)
- 视图 #3:adAdvertiserView (UILabel)
- 视图 #4:adBodyView (UILabel)
- 视图 #5:adMediaView(带有自定义类 LevelPlayMediaView 的 UIView)
- 视图 #6:adCallToActionView (UIButton)
-
创建一个自定义类来表示视图,继承自 UIView:#import <IronSource/IronSource.h>@interface NativeAdView:UIView@property(非原子、强) ISNativeAdView *nativeAdView;- (void)populateWithContent:(nonnull LevelPlayNativeAd *)nativeAd;@end@implementation NativeAdView- (instancetype)init { UINib *nib = [UINib nibWithNibName:@"ISNativeAdView" Bundle:[NSBundle mainBundle]]; NSArray *nibContents = [nib instantiateWithOwner:nil options:nil]; self.nativeAdView = (NativeAdView *)[nibContents firstObject]; self.translatesAutoresizingMaskIntoConstraints = NO; self.nativeAdView.translatesAutoresizingMaskIntoConstraints = NO; // adding your own ad badge, privacy icon, or delete button here // ... return self;}// This function will be useful when the didLoad call back arrives- (void)populateWithContent:(nonnull LevelPlayNativeAd *)nativeAd { } // Assigning views contents to the nativeAdView if (nativeAd.icon.image) { self.nativeAdView.adAppIcon.image = nativeAd.icon.image; } else { [self.nativeAdView.adAppIcon removeFromSuperview]; } if (nativeAd.title) { self.nativeAdView.adTitleView.text = nativeAd.title; } if (nativeAd.advertiser) { self.nativeAdView.adAdvertiserView.text = nativeAd.advertiser; } if (nativeAd.body) { self.nativeAdView.adBodyView.text = nativeAd.body; } if (nativeAd.callToAction) { [self.nativeAdView.adCallToActionView setTitle:nativeAd.callToAction forState:UIControlStateNormal]; // To ensure proper processing of touch events by the SDK, user interaction should be disabled self.nativeAdView.adCallToActionView.userInteractionEnabled = NO; } // call function to register native ad [self.nativeAdView registerNativeAdViews:nativeAd];}@end导入 UIKitimport IronSource类 NativeAdView:UIView { 私有变量 var nativeAdView:ISNativeAdView! 覆盖 帧CGRect) { super.init(frame: frame) let nib = UINib(nibName:"ISNativeAdView", Bundle:.main) let nibContents = nib.instantiate(withOwner: nil, options: nil) self.nativeAdView = nibContents.first as?ISNativeAdView ??ISNativeAdView() self.translatesAutoresizingMaskIntoConstraints = false self.nativeAdView?.translatesAutoresizingMaskIntoConstraints = false // adding your own ad badge, privacy icon, or delete button here // ... addSubview(nativeAdView) } 所需的 init?(代码:NSCoder) { super.init(coder: coder) } // This function will be useful when the didLoad call back arrives func populateWithContent(nativeAd:LevelPlayNativeAd) { // Assigning views contents to the nativeAdView if let iconImage = nativeAd.icon?.image { nativeAdView.adAppIcon?.image = iconImage } else { nativeAdView.adAppIcon?.removeFromSuperview() } nativeAdView.adTitleView?.text = nativeAd.title nativeAdView.adAdvertiserView?.text = nativeAd.advertiser nativeAdView.adBodyView?.text = nativeAd.body nativeAdView.adCallToActionView?.setTitle(nativeAd.callToAction, for: .normal) nativeAdView.adCallToActionView?.isUserInteractionEnabled = false // call function to register native ad nativeAdView.registerNativeAdViews(nativeAd) }}
MediaView
MediaView 是一个指定容器,用于显示主媒体元素。建议对容器使用固定大小的约束。
提高广告透明度
隐私图标 - 在设计过程中,此元素应包含在原生广告的左下角。
广告指示 – 为了确保您的用户了解这是广告,您需要将原生广告服务标记为“Ad”。这可以通过添加自己的指示来实现。
步骤 4.显示原生广告
创建一个容器视图并将其绑定到代码中的引用。此视图将是原生广告视图的父视图。
@property(弱、非原子) IBOutlet UIView *nativeAdContainer;
@IBOutlet weak var nativeAdContainer:UIView!
当 didLoad 回调到达**时,**使用广告的内容填充视图并将其指定为容器视图的子视图:
-(void)didLoad:(LevelPlayNativeAd *)nativeAd withAdInfo:(ISAdInfo *)adInfo{ // Populate view [_nativeAdView populateWithContent:nativeAd]; // Nest the native ad view in the container view [_nativeAdContainer addSubview:_nativeAdView]; // Set the constraints between the container and native ad view _nativeAdView.translatesAutoresizingMaskIntoConstraints = NO; [NSLayoutConstraint activateConstraints:@[ [_nativeAdView.topAnchor constraintEqualToAnchor:_nativeAdContainer.topAnchor], [_nativeAdView.leadingAnchor constraintEqualToAnchor:_nativeAdContainer.leadingAnchor], [_nativeAdView.trailingAnchor constraintEqualToAnchor:_nativeAdContainer.trailingAnchor], [_nativeAdView.bottomAnchor constraintEqualToAnchor:_nativeAdContainer.bottomAnchor] ]];}
func didLoad(_ nativeAd:LevelPlayNativeAd,包含 adInfo:ISAdInfo) { // Populate view nativeAdView.populateWithContent(nativeAd: nativeAd) // Nest the native ad view in the container view nativeAdContainer.addSubview(nativeAdView) // Set the constraints between the container and native ad view nativeAdView.translatesAutoresizingMaskIntoConstraints = false NSLayoutConstraint.activate([ nativeAdView.topAnchor.constraint(equalTo: nativeAdContainer.topAnchor), nativeAdView.leadingAnchor.constraint(equalTo: nativeAdContainer.leadingAnchor), nativeAdView.trailingAnchor.constraint(equalTo: nativeAdContainer.trailingAnchor), nativeAdView.bottomAnchor.constraint(equalTo: nativeAdContainer.bottomAnchor) ]) }
成功完成步骤 4 后,将向用户展示原生广告。再次按照步骤 1 请求新的 LevelPlayNativeAd 对象和 NativeAdView。
步骤 5。销毁原生广告
要销毁原生广告,请调用 destroyAd 并将其从容器视图中删除。
[_nativeAd destroyAd];[_nativeAdView removeFromSuperview];
nativeAd.destroy()nativeAdView.removeFromSuperview()