Native ads allow you to customize the look and feel of the ads that appear in your app. You design the ads: how they look, where they’re placed, and how they work within your existing app design. This differs from other ad formats, which don't allow you to customize the appearance of the ad.
Note: Pangle supports 4 forms outside the chinese mainland: Large image with 1.91:1 ratio、1280*720 video、square image、 square video.
Create an app and native ad placement on Pangle platform
Native ads are ad assets that are presented to users via UI components. It can be formatted to match your app's visual design. When a native ad loads, your app receives an ad object that contains its assets, and the app is then responsible for displaying them.
Broadly speaking, there are three steps to successfully implement Native Ads:
Before loading a native ad, you should have finished the design of a native ad. This can be done either with the Interface Builder or programmatically.
Interface Builder Example as below:
Then get the native example view from Nib file in the mainBundle:
Native ads are loaded via
BUNativeAd object, which has the
loadAdData method used to load native ads. The
BUNativeAd object requires
BUNativeAdDelegate instances.The Native Ad Object is returned as a parameter in the
Before you can load an ad, it is needed to initialize and configure the
ad placement ID
The following code demonstrates how to initialize a
The root view controller handling ad actions is requred to be set to the
BUNativeAdDelegateto receive the following delegate calls. The methods of the protocol are all optional.
loadAdData. You can get the results of the request via calls:
This method is called when native ad material loaded successfully.
This method is called when native ad materia failed to load.
This method is called when native ad slot has been shown.
This method is called when another controller has been closed. interactionType : open appstore in app or open the webpage or view video ad details page.
This method is called when native ad is clicked.
This method is called when the user clicked dislike reasons. Only used for dislikeButton in BUNativeAdRelatedView.h
This method is called when the Ad view container is forced to be removed.
BUNativeAd have been initialized and configured , call
loadAdData method on
BUNativeAd object to request an ad:
Once you have loaded an ad, all that remains is to display it to your users.(Though it doesn't necessarily have to do so immediately).
For the native ad you have accessed, there is a corresponding class:
There are two parts you can obtain assets with the ad.
BUMaterialMeta, a property of
BUImage, a indirect property of
BUNativeAdRelatedView, an object need to pass
BUNativeAdwhen call the
refreshDatamethod on which.
ad labelare required to add to the
logoADImageViewis recommended, which contains logo and ad label. It needed to actively add dislikeButton in order to deal with the feedback and improve the accuracy of ad.
refreshData:needs to be called on
BUNativeAdRelatedViewevery time you get new datas in order to show ad perfectly.
registerContainer:withClickableViews:clickableViewsmust be called on
BUNativeAd, which provides data binding of native ads and reporting of click events, to register and bind the view to be clicked, including images, buttons, etc, otherwise we can't confirm whether the display is an ad. And The click events (jump to ad page, download, call, etc.) registered by BUNativeAd are controlled by the SDK.
videoAdViewinteractions if the ad inclueds a video, set the delegate property of the
BUVideoAdViewDelegateto receive the following delegate calls:
This method is called when videoadview ready to play.
This method is called when videoadview failed to play.
This method is called when videoadview playback status changed.
This method is called when videoadview end of play.
This method is called when videoadview is clicked.
This method is called when videoadview's finish view is clicked.
This method is called when another controller has been closed.
You can get the aspect ratio of the image or video in two ways：
Now you have finished the integration. If you wanna test your apps, make sure you use test ads rather than live, production ads. The easiest way to load test ads is to use test mode. It's been specially configured to return test ads for every request, and you're free to use it in your own apps while coding, testing, and debugging.
Refer to the How to add a test device? to add your device to the test devices on Pangle platform.