Native Ad Layout Setting Guide[ENG] - bidmad/Bidmad-Android GitHub Wiki

Native Ad Layout Setting Guide

To compose Native Ad layout using BidmadSDK, the following 5 components are required.

  • mediaView : Image views commonly referenced by networks
  • img_icon : Icon views commonly referenced by networks
  • txt_body : Text view for body
  • txt_title : Text view for title
  • adCallToActionButton : Button view for running action

Below is the Native Ad Layout attached to the Sample.

*native_large_ad(Sample)

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
	xmlns:app="http://schemas.android.com/apk/res-auto"
	android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#ffffff">

	<RelativeLayout
		android:layout_width="match_parent"
		android:layout_height="wrap_content">


		<FrameLayout
			android:id="@+id/imageGroup"
			android:layout_alignParentTop="true"
			android:layout_width="match_parent"
			android:layout_height="200dp"
			android:layout_centerVertical="true">

			<ImageView
				android:id="@+id/mediaView"
				android:layout_width="match_parent"
				android:layout_height="match_parent"/>

		</FrameLayout>

		<RelativeLayout
			android:layout_width="match_parent"
			android:layout_height="70dp"
			android:layout_below="@id/imageGroup">
			<FrameLayout
				android:id="@+id/iconGroup"
				android:layout_width="55dp"
				android:layout_height="55dp"
				android:layout_centerVertical="true"
				android:layout_marginLeft="10dp"
				android:layout_marginRight="10dp">
				<ImageView
					android:id="@+id/img_icon"
					android:layout_width="match_parent"
					android:layout_height="match_parent"/>


			</FrameLayout>

			<Button
				android:id="@+id/adCallToActionButton"
				android:layout_width="50dp"
				android:layout_height="wrap_content"
				android:layout_alignParentRight="true"
				android:layout_centerVertical="true"
				android:background="@drawable/activity_btn"
				android:layout_marginRight="10dp"
				android:clickable="false"
				android:text=""
				android:textColor="@android:color/white"
				android:textSize="11dp" />

			<TextView
				android:id="@+id/txt_title"
				android:layout_width="wrap_content"
				android:layout_height="wrap_content"
				android:layout_toLeftOf="@id/adCallToActionButton"
				android:layout_toRightOf="@id/iconGroup"
				android:ellipsize="end"
				android:maxLines="1"
				android:layout_marginTop="10dp"
				android:textColor="#000000"
				android:textSize="15dp"
				android:textStyle="bold" />

			<TextView
				android:id="@+id/txt_body"
				android:layout_width="wrap_content"
				android:layout_height="wrap_content"
				android:layout_below="@id/txt_title"
				android:layout_toLeftOf="@id/adCallToActionButton"
				android:layout_toRightOf="@id/iconGroup"
				android:ellipsize="end"
				android:maxLines="2"
				android:textColor="#777777"
				android:textSize="12dp" />

		</RelativeLayout>
	</RelativeLayout>
</FrameLayout>

Finally, by creating a container layout in the view where the actual Native Ad will be exposed, the layout configuration is completed.

*activity_native(Sample)

<FrameLayout
    android:id="@+id/native_ad_container"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"/>

Register the configured Native Ad Layout to Bidmad to make an ad request. If the ad is loaded, get the completed Layout from getNativeLayout from BidmadNativeAd and addView it to native_ad_container.

nativeAd = new BidmadNativeAd(this, "YOUR ZONE ID");

nativeAd.setViewForInteraction(
        R.layout.native_large_ad,
        R.id.mediaView,
        R.id.img_icon,
        R.id.txt_body,
        R.id.txt_title,
        R.id.adCallToActionButton
);

nativeAd.setNativeListener(new NativeListener() {
    @Override
    public void onLoadAd() {
        layoutNative.removeAllViews();
        layoutNative.addView(nativeAd.getNativeLayout());
        callbackStatus.append("onLoadAd() Called\n");
    }

    @Override
    public void onFailedAd() {
        callbackStatus.append("onFailedAd() Called\n");
    }

    @Override
    public void onClickAd(){
        callbackStatus.append("onClickAd() Called\n");
    }
});


nativeAd.load();