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

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

了解原生广告

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

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

步骤 1. 完成基本集成

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

步骤 2. 接收代表回调

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

您必须将viewController (或您喜欢的任何类)设置为VungleNativeAdDelegate才能接收委托回调,如下所示:

将 viewController 设置为 Delegate
- (void)nativeAdDidLoad:(VungleNativeAd *)nativeAd;
- (void)nativeAd:(VungleNativeAd *)nativeAd didFailWithError:(NSError *)error;
- (void)nativeAdDidTrackImpression:(VungleNativeAd *)nativeAd;
- (void)nativeAdDidClick:(VungleNativeAd *)nativeAd;

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

通过 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 、文本字段和按钮。

VungleNativeAd_sample_guide.png

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

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

通过公共 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];
  • viewmediaView是必需的。
  • 其他参数是可选的。
  • viewController用于呈现SKStoreProductView ;否则,SDK 将使用最顶层的viewController
  • SDK 将使 CTA 的clickableViews数组中的所有项目都可点击;如果为 nil,SDK 将使视图(容器UIView )可点击

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

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

  1. 使用可用的 Objective-C 对象为原生广告创建故事板元素,并将它们连接到您将用于展示原生广告的类中的插座属性(如下所示)。
  2. 创建UIViewVungleMediaView 在将展示您的原生广告的情节提要中。
  3. 将storyboard中的VungleMediaView连接到代码中的outlet属性adMediaView图像2.png
  4. 在调用该方法展示 Native Ad 之前,必须添加一行代码来指定隐私图标的位置。该位置应该是VungleNativeAd.h中的NativeAdOptionsPosition枚举中的可用位置之一。
    image1.png
  5. 要添加的代码行如下所示(请注意,当四个值中的任何一个都可以接受时,此示例使用一个枚举值):
    指定隐私图标的位置
    self.nativeAd.adOptionsPosition = NativeAdOptionsPositionTopLeft;
    如果未指定位置,则默认位置将用于在右上角显示隐私图标。
  6. 原生广告加载成功后,将VNGAdOptionsViewnativeAd属性设置为加载成功的原生广告,如图所示。请注意,在您的类中分配给self.nativeAd属性的nativeAd对象是委托回调中包含的实例。
    设置 nativeAd 属性
    self.nativeAd = nativeAd;
  7. 调用展示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 可以专门向测试装置。按照测试您的集成:测试模式和测试设备中的说明进行操作。

Powered by Creativity Driven by Performance Sign Up Here

Questions?

Need further assistance, feel free to reach out to us, we’re here to help!

这篇文章有帮助吗?