Native Ads

Native Ad Format

Native ads provide individual ad components that you implement directly in your app’s layout, unlike other formats where the SDK provides the complete ad view. Advantages: Customize the layout to match your UI/UX and minimize visual disruption. Requirements: Include an ad indicator and maintain visual differentiation to prevent users from confusing ads with content.

Four Required Elements for Native AdsNative ads can be designed to complement the content and look of your app. However, the following four required elements must be included. These elements are necessary to clearly mark native ads as advertisements so that users don’t mistake them for content, and to ensure the minimum advertising effectiveness expected by advertisers.

Ad attribution: You must clearly display ad attribution text such as “Ad”, “Advertisement”, or “Sponsored” (localized appropriately) in the ad area so users can clearly identify the content as advertising.
AdChoices icon: The AdChoices overlay icon enables users to identify and control ads, typically displayed as an ’ⓘ’ icon. This icon is automatically added by the DARO SDK, so no separate implementation is required. However, it’s important that the AdChoices overlay be easily seen, so design your ad view to ensure the icon is not obscured by other UI elements. The icon’s appearance and behavior may vary depending on the ad source (demand).
Title: The ad title must be displayed.
CTA (Call to action): A CTA button with text such as “Install”, “Open”, or “Download” must be included. The size and format of the button can be freely configured, and it can be replaced with a text field depending on the situation. Since the ad source (demand) provides the CTA text, there is no need to specify fixed wording.

Integrating Ads

Xml
Compose

Create adBinder

Create an adBinder needed to render native ads.

Manual implementation(xml)
Use Template

val adBinder = DaroNativeAdBinder.Builder(context, ${layoutId})
  .setIconViewId(${iconViewId})
  .setBodyTextViewId(${bodyViewId})
  .setCallToActionViewId(${callToActionViewId})
  .setMediaViewGroupId(${mediaViewGroupId})
  .setTitleViewId(${titleViewId})
  .build()

Show Example

layout_native.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  xmlns:tools="http://schemas.android.com/tools"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:paddingStart="24dp"
  android:paddingTop="16dp"
  android:paddingEnd="24dp"
  android:paddingBottom="12dp">

  <ImageView
    android:id="@+id/view_icon"
    android:layout_width="48dp"
    android:layout_height="48dp"
    android:layout_marginEnd="8dp"
    app:layout_constraintBottom_toBottomOf="@id/view_body"
    app:layout_constraintEnd_toStartOf="@id/view_title"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="@id/view_title" />

  <TextView
    android:id="@+id/view_title"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:ellipsize="end"
    android:maxLines="1"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toEndOf="@id/view_icon"
    app:layout_constraintTop_toTopOf="parent"
    tools:text="Title is limited to 1 line maximum." />

  <TextView
    android:id="@+id/view_body"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginTop="4dp"
    android:ellipsize="end"
    android:lines="2"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="@id/view_title"
    app:layout_constraintTop_toBottomOf="@id/view_title"
    tools:text="Description is also limited to 2 lines. Lines exceeding.." />

  <TextView
    android:id="@+id/button_cta"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:paddingStart="8dp"
    android:paddingTop="4dp"
    android:paddingEnd="8dp"
    android:paddingBottom="4dp"
    app:layout_constraintBottom_toTopOf="@+id/view_media"
    app:layout_constraintEnd_toEndOf="parent"
    tools:text="Open" />

  <FrameLayout
    android:id="@+id/view_media"
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:layout_marginTop="20dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintTop_toBottomOf="@id/view_body" />
</androidx.constraintlayout.widget.ConstraintLayout>

MainActivity.kt

val adBinder = DaroNativeAdBinder.Builder(this, droom.daro.m.R.layout.layout_native)
  .setIconViewId(droom.daro.m.R.id.view_icon)
  .setBodyTextViewId(droom.daro.m.R.id.view_body)
  .setCallToActionViewId(droom.daro.m.R.id.button_cta)
  .setMediaViewGroupId(droom.daro.m.R.id.view_media)
  .setTitleViewId(droom.daro.m.R.id.view_title)
  .build()

Create adUnit

  val adUnit = DaroNativeAdUnit(
    key = ${AdUnitId},
    placement = ${placement}, //Name displayed in logs. Can be left empty.
  )

Create adView and add to view

val adView = DaroNativeAdView(
  context = context,
  adUnit = adUnit
)

binding.adViewContainer.addView(adView)

Set adBinder on adView

adView.setAdBinder(adBinder)

Set listener

adView.setListener(object : DaroAdViewListener {
  override fun onAdImpression(adInfo: DaroAdInfo) {}
  override fun onAdClicked(adInfo: DaroAdInfo) {}
  override fun onAdLoadSuccess(ad: DaroViewAd, adInfo: DaroAdInfo) {}
  override fun onAdLoadFail(err: DaroAdLoadError) {}
})

Load ad

adView.loadAd()

You must set adBinder before calling loadAd().

When you declare a view, it automatically detects the appropriate lifecycle for the screen and manages its behavior. You don’t need to manually call resume, pause, or destroy.
If you set autoDetectLifecycle to false (default: true), you must manually call resume, pause, and destroy.

You can preload ads without creating an ad view using the DaroNativeAdView.requestPreload() method.

DaroNativeAdView.requestPreload(
  this,
  DaroNativeAdUnit(
    key = ${AdUnitId},
    placement = ${placement},
  )
)

To use the preloaded ad immediately, both the AdUnitId and placement of the DaroNativeAdUnit used in the view must match.

Template

The Daro SDK provides the following templates.

Show Line

backgroundColor

Int

Overall background color

contentColor

Int

Content text color

adMarkLabelBackgroundColor

Int

Ad mark background color

adMarkLabelTextColor

Int

Ad mark text color

Show LineCenter

backgroundColor

Int

Overall background color

contentColor

Int

Content text color

adMarkLabelBackgroundColor

Int

Ad mark background color

adMarkLabelTextColor

Int

Ad mark text color

Show Banner

backgroundColor

Int

Overall background color

titleColor

Int

Title text color

descriptionColor

Int

Description text color

ctaBackgroundColor

Int

CTA (button) background color

ctaTextColor

Int

CTA (button) text color

adMarkLabelTextColor

Int

Bottom ad mark text color

Getting Started

SDK Integration

How to Use DARO

FAQ

Native Ad Format

Integrating Ads

Template

Getting Started

SDK Integration

How to Use DARO

FAQ

​Native Ad Format

​Integrating Ads

​Template

Native Ad Format

Integrating Ads

Template