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();