在 iOS 上集成原生广告 - 抢先体验

Vungle Agent

2022年10月25日 05:35

欢迎使用 Vungle 抢先体验原生广告！从 Vungle SDK v.6.11.0-early1 开始，Vungle 支持原生广告。要参与早期访问版本，请联系您的客户经理。

了解原生广告

原生广告之所以这样命名，是因为它们是您应用内容格式的“原生”。 SDK 不是为您提供横幅广告或全屏广告，而是为您的应用程序提供广告的组件，并允许您的应用程序控制广告的排列和展示。因为您（发布商）控制着广告的格式，所以您可以使其与您的应用程序的外观和感觉保持一致。与其他广告格式相比，这为用户提供了更加无缝的广告体验。

当广告的一个像素出现在屏幕上时，就会触发并计算原生广告的展示次数。

步骤 1. 完成基本集成

要将横幅广告集成到您的 iOS 应用程序中，请按照以下说明开始基本整合文章。本原生广告文章包含补充信息，并假设您已完成基本集成。

步骤 2. 接收代表回调

将viewController设置为委托。这对于每种格式都是非常重要的一步。

您必须将viewController （或您喜欢的任何类）设置为VungleNativeAdDelegate才能接收委托回调，如下所示：

- (void)nativeAdDidLoad:(VungleNativeAd *)nativeAd;
- (void)nativeAd:(VungleNativeAd *)nativeAd didFailWithError:(NSError *)error;
- (void)nativeAdDidTrackImpression:(VungleNativeAd *)nativeAd;
- (void)nativeAdDidClick:(VungleNativeAd *)nativeAd;

加载原生广告时，会通过nativeAdDidLoad回调返回一个nativeAd对象。您可以通过此对象检索所有字符串。

self.adTitleLabel.text = self.nativeAd.title;
self.adBodyLabel.text = self.nativeAd.bodyText;
[self.adCallToActionButton setTitle:self.nativeAd.callToAction forState:UIControlStateNormal];
self.adSponsorLabel.text = self.nativeAd.sponsoredText;
double rating = self.nativeAd.adStarRating;

第 3 步：加载、显示和关闭原生广告

请求原生广告

确保在请求原生广告之前初始化 Vungle SDK。

重要提示：请务必在请求新广告之前关闭最后一个原生广告。在加载的原生广告上调用unregisterView API 可以释放使用的资源并防止内存泄漏。

self.nativeAd = [[VungleNativeAd alloc] initWithPlacementID:self.placementID];
self.nativeAd.delegate = self;
[self.nativeAd loadAd];

展示原生广告

播放原生广告不同于播放其他广告格式。您负责广告的布局和展示。您必须在主UIView （一个容纳原生广告所有组件的容器）内准备UIViews 、文本字段和按钮。

UIView ：包含所有其他原生广告组件的主视图
UIImageView :显示图标图像的视图
VungleMediaView :显示主图像的视图
UILabel :显示广告标题的标签
UILabel :显示应用评分的标签
UILabel ：显示“赞助者”文本的标签
VungleOptionsView ：显示隐私图标的选项视图
UILabel :显示广告正文的标签
UIButton ：显示号召性用语 (CTA) 文本的按钮

您可以通过公共 API 访问所有字符串和值：

@property (nonatomic, copy, readonly) NSString *title;
@property (nonatomic, copy, readonly) NSString *bodyText;
@property (nonatomic, copy, readonly) NSString *callToAction;
@property (nonatomic, assign, readonly) double adStarRating;
@property (nonatomic, copy, readonly) NSString *sponsoredText;

准备和展示原生广告有两种选择；两者都在下面详述。在每一个中，您将通过显示的 API 传递UIView ，以便 Vungle SDK 可以将相应的图像附加到UIView 。

/**
 * Pass UIViews and UIViewController to prepare to display a native ad, then display.
 * @param view: a container view in which a native ad will be displayed
 * @param mediaView: a VungleMediaView to display the media (image/video).
 * @param iconView: a UIImageView to display the app icon
 * @param viewController: a UIViewController to present SKStoreProductViewController
 */
- (void)registerViewForInteraction:(UIView *)view
                         mediaView:(VungleMediaView *)mediaView
                          iconView:(nullable UIImageView *)iconView
                    viewController:(nullable UIViewController *)viewController;

如果您想为要显示的原生广告指定可点击区域，您可以使用下面的 API UIView对象。

/**
 * Pass UIViews and UIViewController to prepare to display a Native ad, then display.
 * Also, specify the clickable area.
 * @param view: a container view in which a native ad will be displayed
 * @param mediaView: a VungleMediaView to display the media (image/video).
 * @param iconView: a UIImageView to display the app icon
 * @param viewController: a UIViewController to present SKStoreProductViewController
 * @param clickableViews: an array of UIViews which you would like to set clickable
 * If nil or empty, the view will be clickable.
 */
- (void)registerViewForInteraction:(UIView *)view
                         mediaView:(VungleMediaView *)mediaView
                          iconView:(nullable UIImageView *)iconView
                    viewController:(nullable UIViewController *)viewController
                    clickableViews:(nullable NSArray *)clickableViews;

如图调用API开始展示Native Ad：

[self.nativeAd registerViewForInteraction:self.adUIView
                                mediaView:self.adMediaView
                                 iconView:self.adIconView
                           viewController:self];

指定可点击视图时，加载和显示原生广告的 API 调用可能如下所示：

[self.nativeAd registerViewForInteraction:self.adUIView
                                mediaView:self.adMediaView
                                 iconView:self.adIconView
                           viewController:self]
clickableViews:@[self.adUIView, self.adMediaView, self.adIconView];

view和mediaView是必需的。
其他参数是可选的。
viewController用于呈现SKStoreProductView ；否则，SDK 将使用最顶层的viewController
SDK 将使 CTA 的clickableViews数组中的所有项目都可点击；如果为 nil，SDK 将使视图（容器UIView ）可点击

原生广告开始播放后，SDK 会自动重新请求新广告，无论is_auto_cached标志设置为“true”还是“false”。

使用情节提要配置要展示的原生广告

使用可用的 Objective-C 对象为原生广告创建故事板元素，并将它们连接到您将用于展示原生广告的类中的插座属性（如下所示）。
创建UIView和VungleMediaView 在将展示您的原生广告的情节提要中。
将storyboard中的VungleMediaView连接到代码中的outlet属性adMediaView ：
在调用该方法展示 Native Ad 之前，必须添加一行代码来指定隐私图标的位置。该位置应该是VungleNativeAd.h中的NativeAdOptionsPosition枚举中的可用位置之一。
要添加的代码行如下所示（请注意，当四个值中的任何一个都可以接受时，此示例使用一个枚举值）：
指定隐私图标的位置
```
self.nativeAd.adOptionsPosition = NativeAdOptionsPositionTopLeft;
```
如果未指定位置，则默认位置将用于在右上角显示隐私图标。
原生广告加载成功后，将VNGAdOptionsView的nativeAd属性设置为加载成功的原生广告，如图所示。请注意，在您的类中分配给self.nativeAd属性的nativeAd对象是委托回调中包含的实例。
设置 nativeAd 属性
```
self.nativeAd = nativeAd;
```

调用展示Native Ad的方法后进行上述赋值；例如：

[self.nativeAd registerViewForInteraction:self.adUIView
                                    mediaView:self.adMediaView
                                     iconView:self.adIconView
                               viewController:self];
self.adOptionsView.nativeAd = self.nativeAd;

关闭原生广告

要关闭原生广告，请调用以下 API：

/**
 * Dismiss the currently displaying Native ad.
 */
- (void)unregisterView;

第 4 步：测试原生广告

您可以通过以下两种方式之一测试原生广告：将您的应用状态设置为测试模式，以便 Vungle 可以向您的应用投放测试广告，或者通过向您的应用添加测试设备，以便 Vungle 可以专门向测试装置。按照测试您的集成：测试模式和测试设备中的说明进行操作。