Layout without a template

Warning.

This is an archived version of the documentation. Actual documentation for all platforms can be found here.

To display native ads, YMANativeAd must be bound to a specific View. This View must be defined as the root element for the subview set that the data contained in the native ad will be bound to.

Restriction. mediaView size requirements when displaying video ads

Minimum size of an instance of the YMANativeMediaView class, which supports video playback: 300x160 or 160x300.

To support video playback in native ads, we recommend setting the width for mediaView to at least 300. To calculate the appropriate mediaView height value, use the aspectRatio property value.

Layout of native ads

  1. See the list of required and optional subviews for native ads.
  2. Set the values for all required subviews. You can do this using nib or directly in the code. Create an instance of YMANativeAdView and define the subview values in initWithFrame:
    Example of registering a set of subviews:
    override init(frame: CGRect) {
        super.init(frame: frame)
        let titleLabel = createLabel()
        let bodyLabel = createLabel()
        let ageLabel = createLabel()
        let warningLabel = createLabel()
        let sponsoredByLabel = createLabel()
        let priceLabel = createLabel()
        let starRatingView = createStarRatingView()
        let button = createButton()
        let iconImageView = createIconAssetImageView()
        let mediaView = createMediaAssetView()
        addSubview(titleLabel)
        addSubview(bodyLabel)
        addSubview(ageLabel)
        addSubview(warningLabel)
        addSubview(sponsoredByLabel)
        addSubview(priceLabel)
        addSubview(starRatingView)
        addSubview(button)
        addSubview(iconImageView)
        addSubview(mediaView)
        self.titleLabel = titleLabel
        self.bodyLabel = bodyLabel
        self.ageLabel = ageLabel
        self.warningLabel = warningLabel
        self.sponsoredLabel = sponsoredByLabel
        self.callToActionButton = callToActionButton
        self.priceLabel = priceLabel
        self.ratingView = ratingView
        self.iconImageView = iconImageView
        self.mediaView = mediaView
    }
  3. To receive notifications about user interactions with the ad (opening or closing the ad or exiting the app), assign it the YMANativeAdDelegate, which implements the methods:
  4. Request the values for native ad assets using the -adAssets method. This will help you calculate the position and sizes of these assets in advance.
    let assets = ad.adAssets()
    Example of getting the image size and aspect ratio of the ad title text and media
    let image = assets.image
    let title = assets.title
    let media = assets.media
    print("Image size: \(image?.size ?? .zero)")
    print("Title: \(title ?? "")")
    print(String(format: "Media aspect ratio: %.2f", media?.aspectRatio ?? 0))
  5. Call the -bindWithAdView:error: method to bind the content to the native ad object.
    // ...
    adView = YMANativeAdView(frame: frame)
    //configure content ad view
    // ...
    func nativeAdLoader(_ loader: YMANativeAdLoader, didLoad ad: YMANativeAd) {
        ad.delegate = self
        do {
            try ad.bind(with: contentAdView)
        } catch {
            print("Error: \(error)")
        }
    }
    Note.

    If a required element of a native ad has the corresponding YMANativeAdView property set to nil, binding doesn't occur and the ad isn't displayed. See details in the error.