> For the complete documentation index, see [llms.txt](https://adpopcornssp.gitbook.io/ssp-sdk/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://adpopcornssp.gitbook.io/ssp-sdk/sdk/android/undefined-6/undefined.md).

# 네이티브 레이아웃 가이드

### 네이티브 레이아웃 기본 설정

네이티브 구성을 위한 기본 AdPopcornSSPNativeAd을 생성합니다.

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

### 네이티브 미디에이션 레이아웃설정

AdPopcornSSPNativeAd에 의해 관리될 네이티브 실제 광고 영역을 연동해 줍니다.

아래의 지원되는 업체 중, 사용하고자 하는 네이티브 영역만 연동을 진행하시면 됩니다. 자세한 사항은 각 내용을 확장해서 확인하시면 됩니다.

{% hint style="warning" %}
단, Max 미디에이션을 쓰는 경우 아래 레이아웃 설정 중, AppLovinMax 네이티브 레이아웃 설정만 사용하시면 됩니다.
{% endhint %}

<details>

<summary>AdPopcornSSP 네이티브 레이아웃 설정</summary>

애드팝콘 네이티브의 경우 일반 네이티브와  AdPopcornSSPNativeAdTemplate 방식을 지원하므로, 매체에서 사용하고자 하는 방식에 맞게 연동을 진행해 주세요.

### 일반  네이티브

* native\_ad\_layout.xml 샘플

```xml
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
​
    <!-- AdPopopcorn SSP-->
    <include
        android:id="@+id/adpopcorn_native_ad_view"
        layout="@layout/adpopcorn_native_ad_unit_layout"/>

</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* adpopcorn\_native\_ad\_unit\_layout.xml 샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:gravity="center"
    android:background="#FFFFFF">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:orientation="horizontal"
        android:background="#FFFFFF">
        <ImageView
            android:id="@+id/apssp_native_ad_icon_image1"
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:layout_margin="10dp"/>
        <LinearLayout
            android:layout_width="0dip"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:layout_gravity="center"
            android:orientation="vertical">
            <TextView
                android:id="@+id/apssp_native_ad_title1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="#000000"/>
            <TextView
                android:id="@+id/apssp_native_ad_desc1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:maxLines="2"
                android:textColor="#000000"/>
        </LinearLayout>
        <TextView
            android:id="@+id/apssp_native_ad_ctatext1"
            android:layout_width="60dp"
            android:layout_height="30dp"
            android:layout_marginTop="25dp"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:background="#3d7caf"
            android:textColor="#ffffff"
            android:textColorHint="#ffffff"
            android:gravity="center"
            android:textSize="16sp" />
    </LinearLayout>
    <ImageView
        android:id="@+id/apssp_native_ad_main_image1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>
</LinearLayout>
```

xml에서 생성한 ui component를 sdk에서 제공하는 <mark style="color:red;">`setAdPopcornSSPViewBinder`</mark> API를 이용해 아래와 같이 설정해 줍니다.

```java
AdPopcornSSPViewBinder adpopcornSSPViewBinder 
= new AdPopcornSSPViewBinder.Builder(R.id.adpopcorn_native_ad_view, R.layout.adpopcorn_native_ad_unit_layout)
        .iconImageViewId(R.id.apssp_native_ad_icon_image1)
        .descViewId(R.id.apssp_native_ad_desc1)
        .mainImageViewId(R.id.apssp_native_ad_main_image1)
        .titleViewId(R.id.apssp_native_ad_title1)
        .callToActionId(R.id.apssp_native_ad_ctatext1)
        .privacyIconVisibility(false)
        .build();

adpopcornSSPNativeAd.setAdPopcornSSPViewBinder(adpopcornSSPViewBinder);
```

{% hint style="warning" %}
AdPopcornSSPViewBinder Builder 생성 시, <mark style="color:red;">`view id(R.id.adpopcorn_native_ad_view)`</mark>와&#x20;

<mark style="color:red;">`layout id(R.layout.adpopcorn_native_ad_unit_layout)`</mark>는 필수로 넘겨주어야 하며, 그 외 ui component에 대해서는 사용하는 리소스에 대해서만 설정해 주면 됩니다.
{% endhint %}

### AdPopcornSSPNativeAdTemplate 설정

AdPopcornSSPNativeAd View 안에 <mark style="color:red;">`AdPopcornSSPNativeAdTemplate`</mark> 뷰를 추가해 줍니다.

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <!-- AdPopcorn SSP Template View -->
    <com.igaworks.ssp.part.nativead.view.AdPopcornSSPNativeAdTemplate
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/adpopcornssp_native_ad_template"/>
        
</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

### 2) Native Asset 연결

xml에 생성한 resource id를 <mark style="color:red;">`setAdPopcornSSPViewBinder`</mark> API를 이용하여 아래와 같은 방식으로 매칭합니다.

```java
AdPopcornSSPViewBinder adPopcornSSPViewBinder = new AdPopcornSSPViewBinder.Builder(R.id.adpopcornssp_native_ad_template)
                .useTemplate(true)
                .build();
adPopcornSSPNativeAd.setAdPopcornSSPViewBinder(adPopcornSSPViewBinder);
```

{% hint style="warning" %} <mark style="color:red;">`AdPopcornSSPViewBinder Builder`</mark> 생성 시, useTemplate 값을 <mark style="color:red;">`true`</mark>로 설정해 주시고,&#x20;

Builder에 <mark style="color:red;">`AdPopcornSSPNativeAdTemplate View id`</mark>를 넘겨줍니다.
{% endhint %}

</details>

<details>

<summary>AppLovinMax 네이티브 레이아웃 설정</summary>

AdPopcornSSPNativeAd layout 내에  AppLovinMax 광고영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml  샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <!-- AppLovin Max -->
    <include
        android:id="@+id/applovin_native_ad_view"
        layout="@layout/applovin_native_ad_unit_layout" />

</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* applovin\_native\_ad\_unit\_layout.xml 샘플

<pre class="language-xml"><code class="lang-xml"><strong>&#x3C;?xml version="1.0" encoding="utf-8"?>
</strong>&#x3C;RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    &#x3C;TextView
        android:id="@+id/applovin_native_title"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:singleLine="true"
        android:textColor="@color/black"
        android:textSize="14sp" />

    &#x3C;FrameLayout
        android:id="@+id/applovin_native_main_image"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:layout_below="@id/applovin_native_title"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:layout_marginBottom="5dp"
        android:scaleType="centerCrop" />

    &#x3C;ImageView
        android:id="@+id/applovin_native_icon_image"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:layout_below="@id/applovin_native_main_image"
        android:layout_marginLeft="10dp"
        android:layout_marginStart="10dp" />

    &#x3C;TextView
        android:id="@+id/applovin_native_body_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/applovin_native_main_image"
        android:layout_toRightOf="@id/applovin_native_icon_image"
        android:layout_toEndOf="@id/applovin_native_icon_image"
        android:layout_marginBottom="10dp"
        android:layout_marginLeft="5dp"
        android:layout_marginStart="5dp"
        android:layout_marginTop="15dp"
        android:ellipsize="end"
        android:singleLine="true"
        android:textColor="@color/black"
        android:textSize="14sp" />

    &#x3C;Button
        android:id="@+id/applovin_native_cta"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="3dp"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:layout_marginRight="14dp"
        android:layout_marginEnd="14dp"
        android:background="@null"
        android:layout_alignTop="@+id/applovin_native_title"
        android:textSize="10sp"
        />
&#x3C;/RelativeLayout>
</code></pre>

xml에서 생성한 ui component를 sdk에서 제공하는 <mark style="color:red;">`setAppLovinMaxViewBinder`</mark> API를 이용해 아래와 같이 설정해 줍니다.

```java
// AppLovinMax
AppLovinMaxViewBinder appLovinViewBinder = new AppLovinMaxViewBinder.Builder(R.id.applovin_native_ad_view, R.layout.applovin_native_ad_unit_layout)
        .titleViewId(R.id.applovin_native_title)
        .bodyViewId(R.id.applovin_native_body_text)
        .iconViewId(R.id.applovin_native_icon_image)
        .mediaViewId(R.id.applovin_native_main_image)
        .ctaViewId(R.id.applovin_native_cta)
        .build();
adPopcornSSPNativeAd.setAppLovinMaxViewBinder(appLovinViewBinder);
```

{% hint style="danger" %}
AppLovinMaxViewBinder Builder 생성 시, <mark style="color:red;">`view id(R.id.applovin_native_ad_view)`</mark>와 <mark style="color:red;">`layout id(R.layout.applovin_native_ad_unit_layout)`</mark>는 필수로 넘겨주어야 하며, 그 외 ui component에 대해서는 사용하는 리소스에 대해서만 설정해 주면 됩니다.
{% endhint %}

</details>

<details>

<summary>AdFit 네이티브 레이아웃 설정</summary>

AdFit 네이티브의 경우 일반 네이티브와 BizBoard 네이티브를 지원하므로, 매체에서 사용하고자 하는 방식에 맞게 연동을 진행해 주세요.

#### BizBoard <a href="#bizboard" id="bizboard"></a>

AdPopcornSSPNativeAd layout 내에 AdFitBizBoardAdTemplateLayout 영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml 샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    ...
    <!-- AdFit BizBoard -->
    <com.kakao.adfit.ads.na.AdFitBizBoardAdTemplateLayout
        android:id="@+id/adFitNativeAdView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>
...
</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

AdFit 비즈보드 스타일의 경우 UI 템플릿을 직접 설정할 필요가 없기에 native\_ad\_mediation\_layout 파일 안에 영역만 지정해 주면 됩니다.

그리고 지정한 영역을 아래와 같이 `setAdFitViewBinder`를 통해 BizBoard 영역이라고 설정합니다.

```java
AdFitViewBinder adFitViewBinder = new AdFitViewBinder.Builder(R.id.adFitNativeAdView)
                .bizBoardAd(true)
                .build();
adPopcornSSPNativeAd.setAdFitViewBinder(adFitViewBinder);
```

AdFitViewBinder Builder 생성 시, `view id(R.id.adFitNativeAdView)`는 필수로 넘겨주어야 하며, `bizBoardAd(true)`를 반드시 설정해야 합니다.

#### AdFitNativeAdView <a href="#adfitnativeadview" id="adfitnativeadview"></a>

AdPopcornSSPNativeAd layout 내에 AdFitNativeAdView 영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml 샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    ...
    <com.kakao.adfit.ads.na.AdFitNativeAdView
        android:id="@+id/adFitNativeAdView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginLeft="23dp"
        android:layout_marginTop="15dp"
        android:layout_marginRight="23dp"
        android:layout_marginBottom="15dp">
        <include layout="@layout/adfit_native_ad_unit_layout"/>
    </com.kakao.adfit.ads.na.AdFitNativeAdView>
...
</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* adfit\_native\_ad\_unit\_layout.xml 샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="3dp"
        android:gravity="center_vertical"
        android:orientation="horizontal">

        <ImageView
            android:id="@+id/adfit_profile_icon_view"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:contentDescription="AD Profile Icon"
            tools:src="@mipmap/ic_launcher" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="7dp"
            android:layout_marginRight="7dp"
            android:gravity="center_vertical"
            android:orientation="vertical">

            <TextView
                android:id="@+id/adfit_title_view"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textStyle="bold"
                tools:text="AD Title" />

            <TextView
                android:id="@+id/adfit_profile_name_view"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                tools:text="AD Profile Name" />
        </LinearLayout>
    </LinearLayout>

    <com.kakao.adfit.ads.na.AdFitMediaView
        android:id="@+id/adfit_media_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="3dp" />

    <TextView
        android:id="@+id/adfit_body_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="3dp"
        tools:text="AD Description" />

    <Button
        android:id="@+id/adfit_call_to_action_button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        tools:text="AD Call To Action Button" />
</LinearLayout>
```

xml에서 생성한 ui component를 sdk에서 제공하는 `setAdFitViewBinder` API를 이용해 아래와 같이 설정해 줍니다.

```java
AdFitViewBinder adFitViewBinder = new AdFitViewBinder.Builder(R.id.adFitNativeAdView, R.layout.adfit_native_ad_unit_layout)
        .titleViewId(R.id.adfit_title_view)
        .bodyViewId(R.id.adfit_body_view)
        .profileIconViewId(R.id.adfit_profile_icon_view)
        .profileNameViewId(R.id.adfit_profile_name_view)
        .callToActionButtonId(R.id.adfit_call_to_action_button)
        .mediaViewId(R.id.adfit_media_view)
				.testMode(false)
        .build();
adPopcornSSPNativeAd.setAdFitViewBinder(adFitViewBinder);
```

AdFitViewBinder Builder 생성 시, `view id(R.id.adFitNativeAdView)`와 `layout id(R.layout.adfit_native_ad_unit_layout)`는 필수로 넘겨주어야 하며, 그 외 ui component에 대해서는 사용하는 리소스에 대해서만 설정해 주면 됩니다.

테스트 광고 송출을 원할 경우, `testMode`에 `true` 값을 전달하여 준다.

</details>

<details>

<summary>NAM 네이티브 레이아웃 설정</summary>

NAM 네이티브의 경우 일반 네이티브(GfpNativeAdView) 와 SimpleAd(GfpNativeSimpleAdView)를 지원하므로, 매체에서 사용하고자 하는 방식에 맞게 연동을 진행해 주세요

{% hint style="warning" %}
NAM의 경우 AdPopcornSSP v3.7.4 버전까지는 GfpNativeSimpleAdView 형태의 광고만을 지원하였으나, AdPopcornSSP v3.7.5 & NAM v8.2.5 버전부터는 GfpNativeSimpleAdView와 GfpNativeAdView의 광고를 동시에 세팅하여 광고를 취급할 수 있도록 지원이 확대 되었습니다. 이에 더 많은 광고를 확인하고자 할 경우에는 아래의 세팅을 모두 진행해 주시기 바랍니다.
{% endhint %}

### GfpNativeAdView + GfpNativeSimpleAdView

AdPopcornSSPNativeAd layout 내에  GfpNativeAdView와 GfpNativeSimpleAdView 영역을 같이 추가해 주세요

* native\_ad\_mediation\_layout.xml 샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    ...
    <!-- NAM NativeAd -->
    <com.naver.gfpsdk.GfpNativeAdView
        android:id="@+id/gfp_native_ad"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <include layout="@layout/nam_native_ad_unit_layout"/>
    </com.naver.gfpsdk.GfpNativeAdView>

    <!-- NAM SimpleAd -->
    <com.naver.gfpsdk.GfpNativeSimpleAdView
        android:id="@+id/gfp_native_simple_ad"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    </com.naver.gfpsdk.GfpNativeSimpleAdView>
...
</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* nam\_native\_ad\_unit\_layout.xml 샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/nam_assets_container"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="#FFFFFF"
        android:minHeight="50dp"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:padding="10dp">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="12dp"
                android:orientation="horizontal">

                <ImageView
                    android:id="@+id/nam_ad_app_icon"
                    android:layout_width="46dp"
                    android:layout_height="46dp"
                    android:layout_marginRight="10dp"
                    android:adjustViewBounds="true" />

                <LinearLayout
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_vertical"
                    android:layout_weight="1"
                    android:orientation="vertical">

                    <TextView
                        android:id="@+id/nam_ad_headline"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginBottom="4dp"
                        android:ellipsize="end"
                        android:lines="1"
                        android:textColor="#000000"
                        android:textSize="12dp" />
                </LinearLayout>

                <com.naver.gfpsdk.GfpAdChoicesView
                    android:id="@+id/nam_ad_choices_view"
                    android:layout_width="20dp"
                    android:layout_height="20dp"
                    android:layout_gravity="center_vertical"
                    android:layout_marginLeft="10dp" />

            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">

                <TextView
                    android:id="@+id/nam_ad_body"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="12dp"
                    android:ellipsize="end"
                    android:maxLines="2"
                    android:textColor="#000000"
                    android:textSize="15dp" />

                <!--
                    if there is no media view
                        new GfpNativeAdOptions.Builder().setHasMediaView(false)
                    this should be deleted
                -->
                <com.naver.gfpsdk.GfpMediaView
                    android:id="@+id/nam_ad_media"
                    android:layout_width="match_parent"
                    android:layout_height="220dp"
                    android:layout_marginBottom="12dp"
                    android:adjustViewBounds="true" />

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="horizontal">

                    <LinearLayout
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_weight="3"
                        android:orientation="vertical">

                        <TextView
                            android:id="@+id/nam_ad_advertiser"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:ellipsize="end"
                            android:lines="1"
                            android:textColor="@android:color/darker_gray"
                            android:textSize="13dp" />

                        <TextView
                            android:id="@+id/nam_ad_social_context"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:ellipsize="end"
                            android:gravity="center_vertical"
                            android:lines="1"
                            android:textColor="@android:color/black"
                            android:textSize="13dp" />

                    </LinearLayout>

                    <Button
                        android:id="@+id/nam_ad_call_to_action"
                        android:layout_width="100dp"
                        android:layout_height="40dp"
                        android:layout_gravity="center_vertical"
                        android:layout_weight="1"
                        android:background="@color/colorPrimary"
                        android:paddingLeft="3dp"
                        android:paddingRight="3dp"
                        android:textColor="#ffffff"
                        android:textSize="13dp" />

                </LinearLayout>

            </LinearLayout>
        </LinearLayout>
    </LinearLayout>

</FrameLayout>
```

그리고 지정한 영역을 아래와 같이 <mark style="color:red;">`setNamViewBinder`</mark>를 통해 전달해 주면 됩니다.

```java
// NAM - Gfp Native Ad && Native Simple Ad
NAMViewBinder namViewMixBinder = new NAMViewBinder.Builder(R.id.gfp_native_simple_ad, R.id.gfp_native_ad, R.layout.nam_native_ad_unit_layout, true)
                .assetContainerViewId(R.id.nam_assets_container)
                .adChoicesViewId(R.id.nam_ad_choices_view)
                .advertiserViewId(R.id.nam_ad_advertiser)
                .bodyViewId(R.id.nam_ad_body)
                .iconViewId(R.id.nam_ad_app_icon)
                .mediaViewId(R.id.nam_ad_media)
                .titleViewId(R.id.nam_ad_headline)
                .callToActionButtonViewId(R.id.nam_ad_call_to_action)
                .socialContextViewId(R.id.nam_ad_social_context)
                .enableMediaBackgroundBlur(false)
                .activateObservingOnBackground(true)
                .build();
 adPopcornSSPNativeAd.setNamViewBinder(namViewMixBinder);
```

각 component 별로 사용되어야 하는 타입은 아래와 같습니다.

* 필수 View
  * assetContainerView : FrameLayout
  * adChoicesView : GfpAdChoicesView
  * advertiserView : TextView
  * bodyView : TextView
  * mediaView : GfpMediaView
* 옵션 View
  * iconView : ImageView
  * titleView : TextView
  * callToActionButtonView : Button
  * socialContextView : TextView

{% hint style="danger" %}
viewBinder Builder 생성 시,  GfpNativeSimpleAdView id와 GfpNativeAdView id, native adview의 layout, hasMediaView 설정값을 반드시 넘겨줍니다.

GfpNativeSimpleAdView는 템플릿 형태이므로, View Id를 넘겨주면 모든 설정이 마무리 되지만, GfpNativeAdView 의 경우에는 각각의 ui component를 viewBinder에 추가로 세팅해 주어야 합니다. 위 코드를 참고하여 세팅해 주세요.
{% endhint %}

### GfpNativeSimpleAdView

AdPopcornSSPNativeAd layout 내에  GfpNativeSimpleAdView 영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml 샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    ...
    <!-- NAM SimpleAd -->
    <com.naver.gfpsdk.GfpNativeSimpleAdView
        android:id="@+id/gfp_native_simple_ad"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    </com.naver.gfpsdk.GfpNativeSimpleAdView>
...
</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

그리고 지정한 영역을 아래와 같이 <mark style="color:red;">`setNamViewBinder`</mark>를 통해 전달해 주면 됩니다.

```java
NAMViewBinder namSimpleViewBinder = new NAMViewBinder.Builder(R.id.gfp_native_simple_ad)
                .build();
adPopcornSSPNativeAd.setNamViewBinder(namSimpleViewBinder);
```

{% hint style="danger" %}
NAMViewBinder Builder 생성 시, <mark style="color:red;">`view id(R.id.gfp_native_simple_ad)`</mark>는 필수로 넘겨주어야 합니다.&#x20;

<mark style="color:red;">`useNativeSimpleView`</mark>의 기본 값은 <mark style="color:red;">true</mark>로 변경되었습니다.
{% endhint %}

### GfpNativeAdView

AdPopcornSSPNativeAd layout 내에  GfpNativeAdView 영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml 샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    ...
    <!-- NAM NativeAd -->
    <com.naver.gfpsdk.GfpNativeAdView
        android:id="@+id/gfp_native_ad"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <include layout="@layout/nam_native_ad_unit_layout"/>
    </com.naver.gfpsdk.GfpNativeAdView>
...
</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* nam\_native\_ad\_unit\_layout.xml 샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/nam_assets_container"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="#FFFFFF"
        android:minHeight="50dp"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:padding="10dp">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="12dp"
                android:orientation="horizontal">

                <ImageView
                    android:id="@+id/nam_ad_app_icon"
                    android:layout_width="46dp"
                    android:layout_height="46dp"
                    android:layout_marginRight="10dp"
                    android:adjustViewBounds="true" />

                <LinearLayout
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_vertical"
                    android:layout_weight="1"
                    android:orientation="vertical">

                    <TextView
                        android:id="@+id/nam_ad_headline"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginBottom="4dp"
                        android:ellipsize="end"
                        android:lines="1"
                        android:textColor="#000000"
                        android:textSize="12dp" />
                </LinearLayout>

                <com.naver.gfpsdk.GfpAdChoicesView
                    android:id="@+id/nam_ad_choices_view"
                    android:layout_width="20dp"
                    android:layout_height="20dp"
                    android:layout_gravity="center_vertical"
                    android:layout_marginLeft="10dp" />

            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">

                <TextView
                    android:id="@+id/nam_ad_body"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="12dp"
                    android:ellipsize="end"
                    android:maxLines="2"
                    android:textColor="#000000"
                    android:textSize="15dp" />

                <!--
                    if there is no media view
                        new GfpNativeAdOptions.Builder().setHasMediaView(false)
                    this should be deleted
                -->
                <com.naver.gfpsdk.GfpMediaView
                    android:id="@+id/nam_ad_media"
                    android:layout_width="match_parent"
                    android:layout_height="220dp"
                    android:layout_marginBottom="12dp"
                    android:adjustViewBounds="true" />

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="horizontal">

                    <LinearLayout
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_weight="3"
                        android:orientation="vertical">

                        <TextView
                            android:id="@+id/nam_ad_advertiser"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:ellipsize="end"
                            android:lines="1"
                            android:textColor="@android:color/darker_gray"
                            android:textSize="13dp" />

                        <TextView
                            android:id="@+id/nam_ad_social_context"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:ellipsize="end"
                            android:gravity="center_vertical"
                            android:lines="1"
                            android:textColor="@android:color/black"
                            android:textSize="13dp" />

                    </LinearLayout>

                    <Button
                        android:id="@+id/nam_ad_call_to_action"
                        android:layout_width="100dp"
                        android:layout_height="40dp"
                        android:layout_gravity="center_vertical"
                        android:layout_weight="1"
                        android:background="@color/colorPrimary"
                        android:paddingLeft="3dp"
                        android:paddingRight="3dp"
                        android:textColor="#ffffff"
                        android:textSize="13dp" />

                </LinearLayout>

            </LinearLayout>
        </LinearLayout>
    </LinearLayout>

</FrameLayout>
```

그리고 지정한 영역을 아래와 같이 <mark style="color:red;">`setNamViewBinder`</mark>를 통해 전달해 주면 됩니다.

```java
// NAM - Gfp Native Ad
NAMViewBinder namViewBinder = new NAMViewBinder.Builder(R.id.gfp_native_ad, R.layout.nam_native_ad_unit_layout, true)
                .assetContainerViewId(R.id.nam_assets_container)
                .adChoicesViewId(R.id.nam_ad_choices_view)
                .advertiserViewId(R.id.nam_ad_advertiser)
                .bodyViewId(R.id.nam_ad_body)
                .iconViewId(R.id.nam_ad_app_icon)
                .mediaViewId(R.id.nam_ad_media)
                .titleViewId(R.id.nam_ad_headline)
                .callToActionButtonViewId(R.id.nam_ad_call_to_action)
                .socialContextViewId(R.id.nam_ad_social_context)
                .activateObservingOnBackground(true)
                .enableMediaBackgroundBlur(false)
                .build();
 adPopcornSSPNativeAd.setNamViewBinder(namViewBinder);
```

각 component 별로 사용되어야 하는 타입은 아래와 같습니다.

* 필수 View
  * assetContainerView : FrameLayout
  * adChoicesView : GfpAdChoicesView
  * advertiserView : TextView
  * bodyView : TextView
  * mediaView : GfpMediaView
* 옵션 View
  * iconView : ImageView
  * titleView : TextView
  * callToActionButtonView : Button
  * socialContextView : TextView

{% hint style="danger" %}
viewBinder Builder 생성 시,  GfpNativeAdView id, native adview의 layout, hasMediaView 설정값을 반드시 넘겨줍니다.

GfpNativeAdView 의 경우에는 각각의 ui component를 viewBinder에 추가로 세팅해 주어야 합니다. 위 코드를 참고하여 세팅해 주세요.
{% endhint %}

## 네이티브 광고 중복 제어 설정 <a href="#native_setting" id="native_setting"></a>

네이티브 광고에 대해서는 여러 지면에 중복된 광고가 노출되는것을 방지하기 위해 아래의 옵션을 제공합니다. NamViewBinder에 아래의 설정을 추가해 주면 동일한 GfpDedupeManager를 사용하는 지면은 중복된 광고가 노출되지 않습니다.(참고 : [NAM 중복 제어 가이드](https://naver.github.io/nam-sdk-guide/android/advanced-features/redundancy-control/))

```java
GfpDedupeManager gfpDedupeManager = new GfpDedupeManager(4);

// 네이티브 지면1
NAMViewBinder namViewBinder = new NAMViewBinder.Builder(R.id.gfp_native_ad, R.layout.nam_native_ad_unit_layout, true)
                .assetContainerViewId(R.id.nam_assets_container)
                .adChoicesViewId(R.id.nam_ad_choices_view)
                .advertiserViewId(R.id.nam_ad_advertiser)
                .bodyViewId(R.id.nam_ad_body)
                .gfpDedupeManager(gfpDedupeManager)
                .build();
 adPopcornSSPNativeAd.setNamViewBinder(namViewBinder);

 // 네이티브 지면2 
 NAMViewBinder namViewBinder2 = new NAMViewBinder.Builder(R.id.gfp_native_ad, R.layout.nam_native_ad_unit_layout, true)
                .assetContainerViewId(R.id.nam_assets_container)
                .adChoicesViewId(R.id.nam_ad_choices_view)
                .advertiserViewId(R.id.nam_ad_advertiser)
                .bodyViewId(R.id.nam_ad_body)
                .gfpDedupeManager(gfpDedupeManager)
                .build();
 adPopcornSSPNativeAd2.setNamViewBinder(namViewBinder2);
```

위와 같이 설정된 경우 adPopcornSSPNativeAd, adPopcornSSPNativeAd2 지면에서 NAM의 광고는 중복된 광고가 노출되지 않습니다. 만약 다른 지면에서는 중복을 허용하고자 할 경우에는 GfpDedupeManager를 새로 생성하거나, 세팅하지 않으면  됩니다.

## GfpNativeSimpleAdView 광고 AdChoice 위치 변경 <a href="#native_setting" id="native_setting"></a>

GfpNativeSimpleAdView 광고에서 AdChoice 위치 변경이 필요한 경우 아래 값을 세팅해서 변경해 주세요

```java
NAMViewBinder namSimpleViewBinder = new NAMViewBinder.Builder(R.id.gfp_native_simple_ad)
                .gfpNativeSimpleAdViewAdChoiceOption(1)
                .build();
adPopcornSSPNativeAd.setNamViewBinder(namSimpleViewBinder);
```

0 : GfpNativeSimpleAdOptions.ADCHOICES\_TOP\_LEFT

1 : GfpNativeSimpleAdOptions.ADCHOICES\_TOP\_RIGHT (기본값)

2 : GfpNativeSimpleAdOptions.ADCHOICES\_BOTTOM\_LEFT

3 : GfpNativeSimpleAdOptions.ADCHOICES\_BOTTOM\_RIGHT

## 네이티브 광고 요청 타임아웃 설정 <a href="#native_setting" id="native_setting"></a>

네이티브 광고 요청 대기 시간은 아래와 같이 변경 가능합니다.

```java
NAMViewBinder namSimpleViewBinder = new NAMViewBinder.Builder(R.id.gfp_native_simple_ad)
                .timeoutMillis(10*1000) // 10초 설정 시.
                .build();
adPopcornSSPNativeAd.setNamViewBinder(namSimpleViewBinder);
```

타임 아웃 기본 값은 60초입니다. 타임아웃은 GfpNativeSimpleAd, GfpNativeAd 모두에 적용됩니다.

### GfpNativeAdView Media Ratio

GfpNativeAdView에서 사용되는 GfpMediaView의 Ratio 값 활용이 필요한 경우, 네이티브 광고가 로딩된 이후, NAMViewBinder의  gfpMediaAspectRatio 변수값을 통해 확인 가능합니다. (아래 샘플 코드 참고)

gfpMediaAspectRatio값이 0인 경우는 광고의 미디어 뷰가 정상적으로 처리 되지 않았거나, No Ad인 케이스입니다.

```java
// NAM - Gfp Native Ad
NAMViewBinder namViewBinder = new NAMViewBinder.Builder(R.id.gfp_native_ad, R.layout.nam_native_ad_unit_layout, true)
                .assetContainerViewId(R.id.nam_assets_container)
                .adChoicesViewId(R.id.nam_ad_choices_view)
                .advertiserViewId(R.id.nam_ad_advertiser)
                .bodyViewId(R.id.nam_ad_body)
                .iconViewId(R.id.nam_ad_app_icon)
                .mediaViewId(R.id.nam_ad_media)
                .titleViewId(R.id.nam_ad_headline)
                .callToActionButtonViewId(R.id.nam_ad_call_to_action)
                .socialContextViewId(R.id.nam_ad_social_context)
                .activateObservingOnBackground(true)
                .enableMediaBackgroundBlur(false)
                .build();
 adPopcornSSPNativeAd.setNamViewBinder(namViewBinder);
 
 adPopcornSSPNativeAd.setNativeAdEventCallbackListener(new INativeAdEventCallbackListener() {
            @Override
            public void onNativeAdLoadSuccess() {
                float gfpMediaAspectRatio = namViewBinder.gfpMediaAspectRatio;
            }

            @Override
            public void onNativeAdLoadFailed(SSPErrorCode errorCode) {
            }

            @Override
            public void onImpression() {
            }

            @Override
            public void onClicked() {
            }

            @Override
            public void onAdHidden() {
            }
        });
```

</details>

<details>

<summary>FAN 네이티브 레이아웃 설정</summary>

AdPopcornSSPNativeAd layout 내에  FAN 광고 영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml  샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <!-- FAN -->
    <com.facebook.ads.NativeAdLayout
        android:id="@+id/fan_native_ad_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">
        <include layout="@layout/fan_native_ad_unit_layout"/>
    </com.facebook.ads.NativeAdLayout>

</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* fan\_native\_ad\_unit\_layout.xml 샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/fan_ad_unit"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@android:color/white"
    android:orientation="vertical"
    android:paddingLeft="10dp"
    android:paddingRight="10dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:paddingBottom="10dp"
        android:paddingTop="10dp">

        <com.facebook.ads.MediaView
            android:id="@+id/fan_native_ad_icon"
            android:layout_width="35dp"
            android:layout_height="35dp" />

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:paddingLeft="5dp"
            android:paddingRight="5dp">

            <TextView
                android:id="@+id/fan_native_ad_title"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:ellipsize="end"
                android:lines="1"
                android:textColor="@android:color/black"
                android:textSize="15sp" />

            <TextView
                android:id="@+id/fan_native_ad_sponsored_label"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:ellipsize="end"
                android:lines="1"
                android:textColor="@android:color/darker_gray"
                android:textSize="12sp" />

        </LinearLayout>

        <LinearLayout
            android:id="@+id/fan_ad_choices_container"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="end"
            android:orientation="horizontal" />

    </LinearLayout>

    <com.facebook.ads.MediaView
        android:id="@+id/fan_native_ad_media"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:padding="5dp">

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="3"
            android:orientation="vertical">

            <TextView
                android:id="@+id/fan_native_ad_social_context"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:ellipsize="end"
                android:lines="1"
                android:textColor="@android:color/darker_gray"
                android:textSize="12sp" />

            <TextView
                android:id="@+id/fan_native_ad_body"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:ellipsize="end"
                android:gravity="center_vertical"
                android:lines="2"
                android:textColor="@android:color/black"
                android:textSize="12sp" />

        </LinearLayout>

        <Button
            android:id="@+id/fan_native_ad_call_to_action"
            android:layout_width="100dp"
            android:layout_height="30dp"
            android:layout_gravity="center_vertical"
            android:layout_weight="1"
            android:background="#4286F4"
            android:paddingLeft="3dp"
            android:paddingRight="3dp"
            android:textColor="@android:color/white"
            android:textSize="12sp"
            android:visibility="gone" />

    </LinearLayout>

</LinearLayout>
```

xml에서 생성한 ui component를 sdk에서 제공하는 <mark style="color:red;">`setFacebookAudienceViewBinder`</mark> API를 이용해 아래와 같이 설정해 줍니다.

```java
FacebookViewBinder facebookViewBinder 
	= new FacebookViewBinder.Builder(R.id.fan_native_ad_view, R.layout.fan_native_ad_unit_layout)
        .adIconViewId(R.id.fan_native_ad_icon)
        .adChoicesLayoutId(R.id.fan_ad_choices_container)
        .callToActionId(R.id.fan_native_ad_call_to_action)
        .adBodyViewId(R.id.fan_native_ad_body)
        .mediaViewId(R.id.fan_native_ad_media)
        .sponsoredViewId(R.id.fan_native_ad_sponsored_label)
        .titleViewId(R.id.fan_native_ad_title)
        .socialContextId(R.id.fan_native_ad_social_context)
        .build();

adPopcornSSPNativeAd.setFacebookAudienceViewBinder(facebookViewBinder);
```

{% hint style="danger" %}
FacebookViewBinder Builder 생성 시, <mark style="color:red;">`view id(R.id.fan_native_ad_view)`</mark>와 <mark style="color:red;">`layout id(R.layout.fan_native_ad_unit_layout)`</mark>는 필수로 넘겨주어야 하며, 그 외 ui component에 대해서는 사용하는 리소스에 대해서만 설정해 주면 됩니다.
{% endhint %}

{% hint style="info" %}
자세한 사항은 아래 링크의 FAN 네이티브 가이드 참고바랍니다.

<https://developers.facebook.com/docs/audience-network/android-native/>
{% endhint %}

</details>

<details>

<summary>AdMob 네이티브 레이아웃 설정</summary>

### NativeAdView

AdPopcornSSPNativeAd layout 내에  NativeAdView 영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml  샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <!-- AdMob or GAM or ADOP or AdForus -->
    <com.google.android.gms.ads.nativead.NativeAdView
        android:id="@+id/admob_unified_native_ad_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <include layout="@layout/admob_native_ad_unit_layout"/>
    </com.google.android.gms.ads.nativead.NativeAdView >

</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* admob\_native\_ad\_unit\_layout.xml 샘플

```xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:background="#FFFFFF"
    android:minHeight="50dp"
    android:orientation="vertical">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:paddingLeft="20dp"
        android:paddingRight="20dp"
        android:paddingTop="3dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/admob_ad_app_icon"
                android:layout_width="40dp"
                android:layout_height="40dp"
                android:adjustViewBounds="true"
                android:paddingBottom="5dp"
                android:paddingEnd="5dp"
                android:paddingRight="5dp"/>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">

                <TextView
                    android:id="@+id/admob_ad_headline"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:textColor="#0000FF"
                    android:textSize="16sp"
                    android:textStyle="bold" />

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

                    <TextView
                        android:id="@+id/admob_ad_advertiser"
                        android:layout_width="wrap_content"
                        android:layout_height="match_parent"
                        android:gravity="bottom"
                        android:textSize="14sp"
                        android:textStyle="bold"/>

                    <RatingBar
                        android:id="@+id/admob_ad_stars"
                        style="?android:attr/ratingBarStyleSmall"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:isIndicator="true"
                        android:numStars="5"
                        android:stepSize="0.5" />
                </LinearLayout>

            </LinearLayout>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <TextView
                android:id="@+id/admob_ad_body"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginRight="20dp"
                android:layout_marginEnd="20dp"
                android:textSize="12sp" />

            <com.google.android.gms.ads.nativead.MediaView
                android:id="@+id/admob_ad_media"
                android:layout_gravity="center_horizontal"
                android:layout_width="250dp"
                android:layout_height="175dp"
                android:layout_marginTop="5dp" />

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="end"
                android:orientation="horizontal"
                android:paddingBottom="10dp"
                android:paddingTop="10dp">

                <TextView
                    android:id="@+id/admob_ad_price"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingLeft="5dp"
                    android:paddingStart="5dp"
                    android:paddingRight="5dp"
                    android:paddingEnd="5dp"
                    android:textSize="12sp" />

                <TextView
                    android:id="@+id/admob_ad_store"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingLeft="5dp"
                    android:paddingStart="5dp"
                    android:paddingRight="5dp"
                    android:paddingEnd="5dp"
                    android:textSize="12sp" />

                <Button
                    android:id="@+id/admob_ad_call_to_action"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:textSize="12sp" />
            </LinearLayout>
        </LinearLayout>
    </LinearLayout>
</LinearLayout>
```

xml에서 생성한 ui component를 sdk에서 제공하는 <mark style="color:red;">`setAdMobViewBinder`</mark> API를 이용해 아래와 같이 설정해 줍니다.

```java
// AdMob
AdMobViewBinder adMobViewBinder = new AdMobViewBinder.Builder(R.id.admob_unified_native_ad_view, R.layout.admob_native_ad_unit_layout)
        .iconViewId(R.id.admob_ad_app_icon)
        .headlineViewId(R.id.admob_ad_headline)
        .bodyViewId(R.id.admob_ad_body)
        .mediaViewId(R.id.admob_ad_media)
        .callToActionId(R.id.admob_ad_call_to_action)
        .advertiserViewId(R.id.admob_ad_advertiser)
        .priceViewId(R.id.admob_ad_price)
        .starRatingViewId(R.id.admob_ad_stars)
        .storeViewId(R.id.admob_ad_store)
        .build();
adPopcornSSPNativeAd.setAdMobViewBinder(adMobViewBinder);
```

{% hint style="danger" %}
viewBinder Builder 생성 시, <mark style="color:red;">`view id(R.id.admob_unified_native_ad_view)`</mark>와 <mark style="color:red;">`layout id(R.layout.admob_native_ad_unit_layout)`</mark>는 필수로 넘겨주어야 하며, 그 외 ui component에 대해서는 사용하는 리소스에 대해서만 설정해 주면 됩니다.
{% endhint %}

{% hint style="info" %}
아래 링크의 가이드를 준수해야 하며 광고 표시는 수동으로 추가해 주어야 합니다.

<https://support.google.com/admob/answer/6329638>
{% endhint %}

</details>

<details>

<summary>GAM 네이티브 레이아웃 설정</summary>

AdPopcornSSPNativeAd layout 내에  NativeAdView 영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml  샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <!-- AdMob or GAM or ADOP or AdForus -->
    <com.google.android.gms.ads.nativead.NativeAdView
        android:id="@+id/admob_unified_native_ad_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <include layout="@layout/admob_native_ad_unit_layout"/>
    </com.google.android.gms.ads.nativead.NativeAdView >

</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* admob\_native\_ad\_unit\_layout.xml 샘플

```xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:background="#FFFFFF"
    android:minHeight="50dp"
    android:orientation="vertical">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:paddingLeft="20dp"
        android:paddingRight="20dp"
        android:paddingTop="3dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/admob_ad_app_icon"
                android:layout_width="40dp"
                android:layout_height="40dp"
                android:adjustViewBounds="true"
                android:paddingBottom="5dp"
                android:paddingEnd="5dp"
                android:paddingRight="5dp"/>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">

                <TextView
                    android:id="@+id/admob_ad_headline"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:textColor="#0000FF"
                    android:textSize="16sp"
                    android:textStyle="bold" />

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

                    <TextView
                        android:id="@+id/admob_ad_advertiser"
                        android:layout_width="wrap_content"
                        android:layout_height="match_parent"
                        android:gravity="bottom"
                        android:textSize="14sp"
                        android:textStyle="bold"/>

                    <RatingBar
                        android:id="@+id/admob_ad_stars"
                        style="?android:attr/ratingBarStyleSmall"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:isIndicator="true"
                        android:numStars="5"
                        android:stepSize="0.5" />
                </LinearLayout>

            </LinearLayout>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <TextView
                android:id="@+id/admob_ad_body"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginRight="20dp"
                android:layout_marginEnd="20dp"
                android:textSize="12sp" />

            <com.google.android.gms.ads.nativead.MediaView
                android:id="@+id/admob_ad_media"
                android:layout_gravity="center_horizontal"
                android:layout_width="250dp"
                android:layout_height="175dp"
                android:layout_marginTop="5dp" />

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="end"
                android:orientation="horizontal"
                android:paddingBottom="10dp"
                android:paddingTop="10dp">

                <TextView
                    android:id="@+id/admob_ad_price"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingLeft="5dp"
                    android:paddingStart="5dp"
                    android:paddingRight="5dp"
                    android:paddingEnd="5dp"
                    android:textSize="12sp" />

                <TextView
                    android:id="@+id/admob_ad_store"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingLeft="5dp"
                    android:paddingStart="5dp"
                    android:paddingRight="5dp"
                    android:paddingEnd="5dp"
                    android:textSize="12sp" />

                <Button
                    android:id="@+id/admob_ad_call_to_action"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:textSize="12sp" />
            </LinearLayout>
        </LinearLayout>
    </LinearLayout>
</LinearLayout>
```

xml에서 생성한 ui component를 sdk에서 제공하는 <mark style="color:red;">`setGAMViewBinder`</mark> API를 이용해 아래와 같이 설정해 줍니다.

```java
// GAM
GAMViewBinder gamViewBinder = new GAMViewBinder.Builder(R.id.admob_unified_native_ad_view, R.layout.admob_native_ad_unit_layout)
        .iconViewId(R.id.admob_ad_app_icon)
        .headlineViewId(R.id.admob_ad_headline)
        .bodyViewId(R.id.admob_ad_body)
        .mediaViewId(R.id.admob_ad_media)
        .callToActionId(R.id.admob_ad_call_to_action)
        .advertiserViewId(R.id.admob_ad_advertiser)
        .priceViewId(R.id.admob_ad_price)
        .starRatingViewId(R.id.admob_ad_stars)
        .storeViewId(R.id.admob_ad_store)
        .build();
adPopcornSSPNativeAd.setGAMViewBinder(gamViewBinder);
```

{% hint style="danger" %}
viewBinder Builder 생성 시, <mark style="color:red;">`view id(R.id.admob_unified_native_ad_view)`</mark>와 <mark style="color:red;">`layout id(R.layout.admob_native_ad_unit_layout)`</mark>는 필수로 넘겨주어야 하며, 그 외 ui component에 대해서는 사용하는 리소스에 대해서만 설정해 주면 됩니다.
{% endhint %}

{% hint style="info" %}
아래 링크의 가이드를 준수해야 하며 광고 표시는 수동으로 추가해 주어야 합니다.

<https://support.google.com/admob/answer/6329638>
{% endhint %}

</details>

<details>

<summary>ADOP 네이티브 레이아웃 설정</summary>

AdPopcornSSPNativeAd layout 내에  NativeAdView 영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml  샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <!-- AdMob or GAM or ADOP or AdForus -->
    <com.google.android.gms.ads.nativead.NativeAdView
        android:id="@+id/admob_unified_native_ad_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <include layout="@layout/admob_native_ad_unit_layout"/>
    </com.google.android.gms.ads.nativead.NativeAdView >

</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* admob\_native\_ad\_unit\_layout.xml 샘플

```xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:background="#FFFFFF"
    android:minHeight="50dp"
    android:orientation="vertical">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:paddingLeft="20dp"
        android:paddingRight="20dp"
        android:paddingTop="3dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/admob_ad_app_icon"
                android:layout_width="40dp"
                android:layout_height="40dp"
                android:adjustViewBounds="true"
                android:paddingBottom="5dp"
                android:paddingEnd="5dp"
                android:paddingRight="5dp"/>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">

                <TextView
                    android:id="@+id/admob_ad_headline"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:textColor="#0000FF"
                    android:textSize="16sp"
                    android:textStyle="bold" />

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

                    <TextView
                        android:id="@+id/admob_ad_advertiser"
                        android:layout_width="wrap_content"
                        android:layout_height="match_parent"
                        android:gravity="bottom"
                        android:textSize="14sp"
                        android:textStyle="bold"/>

                    <RatingBar
                        android:id="@+id/admob_ad_stars"
                        style="?android:attr/ratingBarStyleSmall"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:isIndicator="true"
                        android:numStars="5"
                        android:stepSize="0.5" />
                </LinearLayout>

            </LinearLayout>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <TextView
                android:id="@+id/admob_ad_body"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginRight="20dp"
                android:layout_marginEnd="20dp"
                android:textSize="12sp" />

            <com.google.android.gms.ads.nativead.MediaView
                android:id="@+id/admob_ad_media"
                android:layout_gravity="center_horizontal"
                android:layout_width="250dp"
                android:layout_height="175dp"
                android:layout_marginTop="5dp" />

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="end"
                android:orientation="horizontal"
                android:paddingBottom="10dp"
                android:paddingTop="10dp">

                <TextView
                    android:id="@+id/admob_ad_price"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingLeft="5dp"
                    android:paddingStart="5dp"
                    android:paddingRight="5dp"
                    android:paddingEnd="5dp"
                    android:textSize="12sp" />

                <TextView
                    android:id="@+id/admob_ad_store"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingLeft="5dp"
                    android:paddingStart="5dp"
                    android:paddingRight="5dp"
                    android:paddingEnd="5dp"
                    android:textSize="12sp" />

                <Button
                    android:id="@+id/admob_ad_call_to_action"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:textSize="12sp" />
            </LinearLayout>
        </LinearLayout>
    </LinearLayout>
</LinearLayout>
```

xml에서 생성한 ui component를 sdk에서 제공하는 <mark style="color:red;">`setADOPViewBinder`</mark> API를 이용해 아래와 같이 설정해 줍니다.

```java
// ADOP
ADOPViewBinder adopViewBinder = new ADOPViewBinder.Builder(R.id.admob_unified_native_ad_view, R.layout.admob_native_ad_unit_layout)
        .iconViewId(R.id.admob_ad_app_icon)
        .headlineViewId(R.id.admob_ad_headline)
        .bodyViewId(R.id.admob_ad_body)
        .mediaViewId(R.id.admob_ad_media)
        .callToActionId(R.id.admob_ad_call_to_action)
        .advertiserViewId(R.id.admob_ad_advertiser)
        .priceViewId(R.id.admob_ad_price)
        .starRatingViewId(R.id.admob_ad_stars)
        .storeViewId(R.id.admob_ad_store)
        .build();
adPopcornSSPNativeAd.setADOPViewBinder(adopViewBinder);
```

{% hint style="danger" %}
viewBinder Builder 생성 시, <mark style="color:red;">`view id(R.id.admob_unified_native_ad_view)`</mark>와 <mark style="color:red;">`layout id(R.layout.admob_native_ad_unit_layout)`</mark>는 필수로 넘겨주어야 하며, 그 외 ui component에 대해서는 사용하는 리소스에 대해서만 설정해 주면 됩니다.
{% endhint %}

{% hint style="info" %}
아래 링크의 가이드를 준수해야 하며 광고 표시는 수동으로 추가해 주어야 합니다.

<https://support.google.com/admob/answer/6329638>
{% endhint %}

</details>

<details>

<summary>AdForus 네이티브 레이아웃 설정</summary>

AdPopcornSSPNativeAd layout 내에  NativeAdView 영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml  샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <!-- AdMob or GAM or ADOP or AdForus -->
    <com.google.android.gms.ads.nativead.NativeAdView
        android:id="@+id/admob_unified_native_ad_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <include layout="@layout/admob_native_ad_unit_layout"/>
    </com.google.android.gms.ads.nativead.NativeAdView >

</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* admob\_native\_ad\_unit\_layout.xml 샘플

```xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:background="#FFFFFF"
    android:minHeight="50dp"
    android:orientation="vertical">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:paddingLeft="20dp"
        android:paddingRight="20dp"
        android:paddingTop="3dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/admob_ad_app_icon"
                android:layout_width="40dp"
                android:layout_height="40dp"
                android:adjustViewBounds="true"
                android:paddingBottom="5dp"
                android:paddingEnd="5dp"
                android:paddingRight="5dp"/>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">

                <TextView
                    android:id="@+id/admob_ad_headline"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:textColor="#0000FF"
                    android:textSize="16sp"
                    android:textStyle="bold" />

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

                    <TextView
                        android:id="@+id/admob_ad_advertiser"
                        android:layout_width="wrap_content"
                        android:layout_height="match_parent"
                        android:gravity="bottom"
                        android:textSize="14sp"
                        android:textStyle="bold"/>

                    <RatingBar
                        android:id="@+id/admob_ad_stars"
                        style="?android:attr/ratingBarStyleSmall"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:isIndicator="true"
                        android:numStars="5"
                        android:stepSize="0.5" />
                </LinearLayout>

            </LinearLayout>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <TextView
                android:id="@+id/admob_ad_body"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginRight="20dp"
                android:layout_marginEnd="20dp"
                android:textSize="12sp" />

            <com.google.android.gms.ads.nativead.MediaView
                android:id="@+id/admob_ad_media"
                android:layout_gravity="center_horizontal"
                android:layout_width="250dp"
                android:layout_height="175dp"
                android:layout_marginTop="5dp" />

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="end"
                android:orientation="horizontal"
                android:paddingBottom="10dp"
                android:paddingTop="10dp">

                <TextView
                    android:id="@+id/admob_ad_price"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingLeft="5dp"
                    android:paddingStart="5dp"
                    android:paddingRight="5dp"
                    android:paddingEnd="5dp"
                    android:textSize="12sp" />

                <TextView
                    android:id="@+id/admob_ad_store"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingLeft="5dp"
                    android:paddingStart="5dp"
                    android:paddingRight="5dp"
                    android:paddingEnd="5dp"
                    android:textSize="12sp" />

                <Button
                    android:id="@+id/admob_ad_call_to_action"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:textSize="12sp" />
            </LinearLayout>
        </LinearLayout>
    </LinearLayout>
</LinearLayout>
```

xml에서 생성한 ui component를 sdk에서 제공하는 <mark style="color:red;">`setAdForusViewBinder`</mark> API를 이용해 아래와 같이 설정해 줍니다.

```java
// AdForus
AdForusViewBinder adForusViewBinder = new AdForusViewBinder.Builder(R.id.admob_unified_native_ad_view, R.layout.admob_native_ad_unit_layout)
        .iconViewId(R.id.admob_ad_app_icon)
        .headlineViewId(R.id.admob_ad_headline)
        .bodyViewId(R.id.admob_ad_body)
        .mediaViewId(R.id.admob_ad_media)
        .callToActionId(R.id.admob_ad_call_to_action)
        .advertiserViewId(R.id.admob_ad_advertiser)
        .priceViewId(R.id.admob_ad_price)
        .starRatingViewId(R.id.admob_ad_stars)
        .storeViewId(R.id.admob_ad_store)
        .build();
adPopcornSSPNativeAd.setAdForusViewBinder(adForusViewBinder);
```

{% hint style="danger" %}
viewBinder Builder 생성 시, <mark style="color:red;">`view id(R.id.admob_unified_native_ad_view)`</mark>와 <mark style="color:red;">`layout i`</mark>viewBinder Builder 생성 시, <mark style="color:red;">`view id(R.id.admob_unified_native_ad_view)`</mark>와 <mark style="color:red;">`layout id(R.layout.admob_native_ad_unit_layout)`</mark>는 필수로 넘겨주어야 하며, 그 외 ui component에 대해서는 사용하는 리소스에 대해서만 설정해 주면 됩니다.
{% endhint %}

{% hint style="info" %}
아래 링크의 가이드를 준수해야 하며 광고 표시는 수동으로 추가해 주어야 합니다.

<https://support.google.com/admob/answer/6329638>
{% endhint %}

</details>

<details>

<summary>Pangle 네이티브 레이아웃 설정</summary>

AdPopcornSSPNativeAd layout 내에  Pangle 광고 영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml  샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

     <!-- Pangle -->
    <include
        android:id="@+id/pangle_native_ad_view"
        layout="@layout/pangle_native_ad_unit_layout" />

</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* pangle\_native\_ad\_unit\_layout.xml 샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/pangle_native_title"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:singleLine="true"
        android:textColor="@color/black"
        android:text="pangle_native_title"
        android:textSize="14sp" />

    <FrameLayout
        android:id="@+id/pangle_native_media_view"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:layout_below="@id/pangle_native_title"
        android:layout_marginBottom="5dp"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:background="@color/ads_blue_600"
        android:scaleType="centerCrop" />

    <ImageView
        android:id="@+id/pangle_native_icon_image"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:layout_below="@id/pangle_native_media_view"
        android:layout_marginLeft="10dp"
        android:layout_marginStart="10dp" />

    <TextView
        android:id="@+id/pangle_native_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/pangle_native_media_view"
        android:layout_toRightOf="@id/pangle_native_icon_image"
        android:layout_toEndOf="@id/pangle_native_icon_image"
        android:layout_marginBottom="10dp"
        android:layout_marginLeft="5dp"
        android:layout_marginStart="5dp"
        android:layout_marginTop="15dp"
        android:ellipsize="end"
        android:singleLine="true"
        android:textColor="@color/black"
        android:text="pangle_native_text"
        android:textSize="14sp" />

    <Button
        android:id="@+id/pangle_native_cta"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="3dp"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:layout_marginRight="14dp"
        android:layout_marginEnd="14dp"
        android:text="pangle_native_cta"
        android:background="@null"
        android:layout_alignTop="@+id/pangle_native_text"
        android:textSize="10sp"
        />
</RelativeLayout>
```

xml에서 생성한 ui component를 sdk에서 제공하는 <mark style="color:red;">`setPangleViewBinderAPI`</mark>를 이용해 아래와 같이 설정해 줍니다.

```java
PangleViewBinder pangleViewBinder = new PangleViewBinder.Builder(R.id.pangle_native_ad_view, R.layout.pangle_native_ad_unit_layout)
        .titleViewId(R.id.pangle_native_title)
        .descriptionViewId(R.id.pangle_native_text)
        .iconViewId(R.id.pangle_native_icon_image)
        .mediaViewId(R.id.pangle_native_media_view)
        .creativeButtonViewId(R.id.pangle_native_cta)
        .build();
adPopcornSSPNativeAd.setPangleViewBinder(pangleViewBinder);
```

{% hint style="danger" %}
PangleViewBinderBuilder 생성 시, <mark style="color:red;">`view id(R.id.pangle_native_ad_view)`</mark>와 <mark style="color:red;">`layout id(R.layout.pangle_native_ad_unit_layout)`</mark>는 필수로 넘겨주어야 하며, 그 외 ui component에 대해서는 사용하는 리소스에 대해서만 설정해 주면 됩니다.
{% endhint %}

</details>

<details>

<summary>Vungle(LiftOff) 네이티브 레이아웃 설정</summary>

AdPopcornSSPNativeAd layout 내에  Vungle 광고 영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml  샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <!-- Vungle -->
    <include
        android:id="@+id/vungle_native_ad_view"
        layout="@layout/vungle_native_ad_layout"/>

</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* vungle\_native\_ad\_unit\_layout.xml 샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/native_ad_container"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_vertical"
            android:orientation="horizontal"
            android:padding="5dp"
            android:weightSum="1">

            <ImageView
                android:id="@+id/imgAdIcon"
                android:layout_width="48dp"
                android:layout_height="48dp"
                android:contentDescription="@string/empty" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"
                android:orientation="vertical">

                <TextView
                    android:id="@+id/lbAdTitle"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:ellipsize="end"
                    android:hint="Title"
                    android:lines="1"
                    android:textColor="@android:color/black"
                    android:textSize="15sp" />

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="horizontal">

                    <TextView
                        android:id="@+id/lbAdRating"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginRight="10dp"
                        android:hint="rate" />

                    <TextView
                        android:id="@+id/lbAdBody"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:ellipsize="end"
                        android:gravity="center_vertical"
                        android:hint="asdasdsadasd"
                        android:lines="2"
                        android:textColor="@android:color/black"
                        android:textSize="12sp" />
                </LinearLayout>
            </LinearLayout>
        </LinearLayout>

        <com.vungle.ads.internal.ui.view.MediaView
            android:id="@+id/pnlVideoAd"
            android:layout_width="match_parent"
            android:layout_height="150dp"
            android:gravity="center" />

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="5dp">

            <Button
                android:id="@+id/btnAdCta"
                android:layout_width="wrap_content"
                android:layout_height="50dp"
                android:layout_alignParentRight="true"
                android:background="#4286F4"
                android:paddingLeft="3dp"
                android:paddingRight="3dp"
                android:textColor="@android:color/white"
                android:textSize="12sp"
                android:visibility="visible" />

            <TextView
                android:id="@+id/lbAdSponsor"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:ellipsize="end"
                android:hint="sponsored"
                android:textSize="12sp" />
        </RelativeLayout>
    </LinearLayout>
</FrameLayout>
```

xml에서 생성한 ui component를 sdk에서 제공하는 <mark style="color:red;">`setVungleViewBinder`</mark> API를 이용해 아래와 같이 설정해 줍니다.

```java
VungleViewBinder vungleViewBinder = new VungleViewBinder.Builder(R.id.vungle_native_ad_view, R.layout.vungle_native_ad_layout)
                .titleViewId(R.id.lbAdTitle)
                .bodyViewId(R.id.lbAdBody)
                .iconViewId(R.id.imgAdIcon)
                .ctaViewId(R.id.btnAdCta)
                .sponsoredByViewId(R.id.lbAdSponsor)
                .mediaViewId(R.id.pnlVideoAd)
                .ratingViewId(R.id.lbAdRating)
                .build();
adPopcornSSPNativeAd.setVungleViewBinder(vungleViewBinder);
```

{% hint style="danger" %}
VungleViewBinder Builder 생성 시, <mark style="color:red;">`view id(R.id.vungle_native_ad_view)`</mark>와 <mark style="color:red;">`layout id(R.layout.vungle_native_ad_layout)`</mark>는 필수로 넘겨주어야 하며, 그 외 ui component에 대해서는 사용하는 리소스에 대해서만 설정해 주면 됩니다.
{% endhint %}

</details>

<details>

<summary>CoupangCPM 네이티브 레이아웃 설정</summary>

AdPopcornSSPNativeAd layout 내에  Coupang 광고 영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml  샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <com.coupang.ads.custom.AdsNativeView
        android:id="@+id/coupang_ads_native_view"
        android:layout_width="300dp"
        android:layout_height="250dp"
        android:layout_gravity="center_horizontal"
        android:visibility="invisible">
        <include layout="@layout/coupang_native_ad_unit_layout"/>
    </com.coupang.ads.custom.AdsNativeView>    

</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* coupang\_native\_ad\_unit\_layout.xml 샘플

```xml
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/call_to_action"
    android:layout_width="300dp"
    android:layout_height="250dp"
    android:background="@drawable/bg_banner_item_radius">


    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginTop="18dp"
        android:lineSpacingExtra="3sp"
        android:text="이런건 어때요?"
        android:textColor="#111111"
        android:textSize="16sp"
        android:textStyle="bold"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />


    <ImageView
        android:id="@+id/logo"
        android:layout_width="63dp"
        android:layout_height="14dp"
        android:layout_marginTop="20dp"
        android:layout_marginEnd="8dp"
        android:src="@drawable/ic_ads_coupang_logo_350x80"
        app:layout_constraintEnd_toStartOf="@+id/opt_out"
        app:layout_constraintTop_toTopOf="parent" />


    <com.coupang.ads.view.image.RoundImageView
        android:id="@+id/main_image"
        android:layout_width="110dp"
        android:layout_height="110dp"
        android:layout_marginTop="53dp"
        android:layout_marginEnd="16dp"
        android:scaleType="centerCrop"
        android:src="@drawable/ic_ads_placeholder_loading"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:radius="4dp" />


    <TextView
        android:id="@+id/title"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginTop="53dp"
        android:layout_marginEnd="10dp"
        android:ellipsize="end"
        android:maxLines="2"
        android:textColor="#111111"
        android:textSize="14sp"
        android:textStyle="normal"
        app:layout_constraintEnd_toStartOf="@id/main_image"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"/>


    <com.coupang.ads.custom.widget.AdsProductStarRating
        android:id="@+id/rating"
        style="@style/StarRating.Medium"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginTop="10dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/title"/>

    <TextView
        android:id="@+id/price"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginTop="10dp"
        android:ellipsize="end"
        android:includeFontPadding="false"
        android:maxLines="1"
        android:textAppearance="@style/T6.Regular"
        android:textColor="#cb1400"
        android:textSize="16sp"
        android:textStyle="bold"
        app:layout_constraintEnd_toStartOf="@+id/main_image"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/rating" />


    <ImageView
        android:id="@+id/deliver"
        android:layout_width="56dp"
        android:layout_height="14dp"
        android:layout_marginStart="16dp"
        android:layout_marginTop="6dp"
        android:scaleType="centerCrop"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/price" />

    <TextView
        android:id="@+id/positive"
        android:layout_width="268dp"
        android:layout_height="38dp"
        android:layout_margin="16dp"
        android:background="@drawable/bg_bt_blue"
        android:gravity="center"
        android:text="바로가기 >"
        android:textColor="@color/rds_blue_600"
        android:textSize="14sp"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

    <ImageView
        android:id="@id/opt_out"
        style="@style/AdsOptOutImageView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>
```

xml에서 생성한 ui component를 sdk에서 제공하는 <mark style="color:red;">`setCoupangViewBinder`</mark> API를 이용해 아래와 같이 설정해 줍니다.

```java
CoupangViewBinder coupangViewBinder = new CoupangViewBinder.Builder(R.id.coupang_ads_native_view, R.layout.coupang_native_ad_unit_layout)
                .optOutViewId(R.id.opt_out)
                .deliverViewId(R.id.deliver)
                .logoViewId(R.id.logo)
                .callToActionViewId(R.id.call_to_action)
                .mainImageViewId(R.id.main_image)
                .priceViewId(R.id.price)
                .ratingViewId(R.id.rating)
                .titleViewId(R.id.title)
                .build();
adPopcornSSPNativeAd.setCoupangViewBinder(coupangViewBinder);
```

{% hint style="danger" %}
CoupangViewBinder Builder 생성 시, <mark style="color:red;">`view id(R.id.coupang_ads_native_view)`</mark>와 <mark style="color:red;">`layout id(R.layout.coupang_native_ad_unit_layout)`</mark>는 필수로 넘겨주어야 하며, 그 외 ui component에 대해서는 사용하는 리소스에 대해서만 설정해 주면 됩니다.
{% endhint %}

</details>

<details>

<summary>Mobwith 네이티브 레이아웃 설정</summary>

AdPopcornSSPNativeAd layout 내에  MobWith 광고 영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml  샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <!-- MobWith -->
    <FrameLayout
        android:id="@+id/mobwith_native_ad_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:layout_marginTop="30dp" />

</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* mobwith\_native\_ad\_unit\_layout.xml 샘플

```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:layout_gravity="center_horizontal"
    tools:ignore="MissingConstraints,MissingDefaultResource" >

    <FrameLayout
        android:id="@+id/mediaContainerView"
        android:layout_width="300dp"
        android:layout_height="220dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        tools:ignore="MissingConstraints">
        <ImageView
            android:id="@+id/imageViewAD"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            />
    </FrameLayout>


    <ImageView
        android:id="@+id/imageViewLogo"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_marginTop="5dp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toBottomOf="@id/mediaContainerView"
        app:layout_constraintBottom_toBottomOf="parent"
        tools:ignore="MissingConstraints"
        />

    <TextView
        android:id="@+id/textViewTitle"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginLeft="5dp"
        android:layout_marginRight="5dp"
        android:maxLines="1"
        android:text="{ Title }"
        android:textColor="#000000"
        android:textStyle="italic"
        app:layout_constraintLeft_toRightOf="@id/imageViewLogo"
        app:layout_constraintTop_toTopOf="@id/imageViewLogo"
        app:layout_constraintRight_toLeftOf="@id/buttonGo"
        app:layout_constraintBottom_toTopOf="@id/textViewDesc"
        tools:ignore="MissingConstraints"
        />

    <TextView
        android:id="@+id/textViewDesc"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:maxLines="1"
        android:text="{ Description }"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="@id/textViewTitle"
        app:layout_constraintRight_toRightOf="@id/textViewTitle"
        app:layout_constraintTop_toBottomOf="@id/textViewTitle"
        tools:ignore="MissingConstraints"
        />

    <Button
        android:id="@+id/buttonGo"
        android:layout_width="60dp"
        android:layout_height="35dp"
        android:background="#ccffcc"
        android:text="바로가기"
        android:gravity="center"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toTopOf="@id/imageViewLogo"
        tools:ignore="MissingConstraints"
        />


    <FrameLayout
        android:id="@+id/infoViewLayout"
        android:layout_width="15dp"
        android:layout_height="15dp"
        android:layout_marginTop="5dp"
        android:layout_marginRight="5dp"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:ignore="MissingConstraints" >

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


</androidx.constraintlayout.widget.ConstraintLayout>
```

xml에서 생성한 ui component를 sdk에서 제공하는 <mark style="color:red;">`setMobWithViewBinder`</mark> API를 이용해 아래와 같이 설정해 줍니다.

```java
MobWithViewBinder mobWithViewBinder = new MobWithViewBinder.Builder(R.id.mobwith_native_ad_view, R.layout.mobwith_native_ad_unit_layout)
                .mediaContainerViewId(R.id.mediaContainerView)
                .imageViewADId(R.id.imageViewAD)
                .imageViewLogoId(R.id.imageViewLogo)
                .textViewTitleId(R.id.textViewTitle)
                .textViewDescId(R.id.textViewDesc)
                .buttonGoId(R.id.buttonGo)
                .layoutInfoViewId(R.id.infoViewLayout)
                .imageViewInfoId(R.id.imageViewInfo)
                .build();
        adPopcornSSPNativeAd.setMobWithViewBinder(mobWithViewBinder);
```

{% hint style="danger" %}
MobWithViewBinder Builder 생성 시, <mark style="color:red;">`view id(R.id.mobwith_native_ad_view)`</mark>와 <mark style="color:red;">`layout id(R.layout.mobwith_native_ad_unit_layout)`</mark>는 필수로 넘겨주어야 하며, 그 외 ui component에 대해서는 사용하는 리소스에 대해서만 설정해 주면 됩니다.
{% endhint %}

</details>

<details>

<summary>InMobi 네이티브 레이아웃 설정</summary>

AdPopcornSSPNativeAd layout 내에  Inmobi 광고 영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml  샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <!-- InMobi -->
    <include
        android:id="@+id/inmobi_native_ad_view"
        layout="@layout/inmobi_native_ad_unit_layout"/>

</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* inmobi\_native\_ad\_unit\_layout.xml 샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:padding="5dp"
    android:layout_width="match_parent" android:layout_height="match_parent">
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <ImageView
            android:id="@+id/inmobi_adIcon"
            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true"
            android:layout_centerVertical="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <FrameLayout
            android:id="@+id/inmobi_adChoice"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true"
            android:layout_alignParentTop="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <TextView
            android:id="@+id/inmobi_adSponsored"
            android:text="sponsored"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true"
            android:layout_below="@id/inmobi_adChoice"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_toEndOf="@id/inmobi_adIcon"
            android:layout_toRightOf="@id/inmobi_adIcon"
            android:layout_toStartOf="@id/inmobi_adSponsored"
            android:layout_toLeftOf="@id/inmobi_adSponsored"
            android:layout_marginStart="5dp"
            android:layout_marginLeft="5dp"
            android:layout_centerVertical="true"
            android:orientation="vertical">
            <TextView
                android:id="@+id/inmobi_adTitle"
                android:layout_gravity="center_vertical"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />
            <RatingBar
                android:id="@+id/inmobi_adRating"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />
        </LinearLayout>
    </RelativeLayout>

    <FrameLayout
        android:id="@+id/inmobi_adContent"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="5dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <Button
            android:id="@+id/inmobi_adAction"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <TextView
            android:id="@+id/inmobi_adDescription"
            android:layout_toLeftOf="@id/inmobi_adAction"
            android:layout_toStartOf="@id/inmobi_adAction"
            android:layout_centerVertical="true"
            android:maxLines="2"
            android:ellipsize="marquee"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
    </RelativeLayout>
</LinearLayout>
```

xml에서 생성한 ui component를 sdk에서 제공하는 <mark style="color:red;">`setInMobiViewBinder`</mark> API를 이용해 아래와 같이 설정해 줍니다.

```java
// InMobi
InMobiViewBinder inMobiViewBinder = new InMobiViewBinder.Builder(R.id.inmobi_native_ad_view, R.layout.inmobi_native_ad_unit_layout)
                .iconViewId(R.id.inmobi_adIcon) // ImageView
                .titleViewId(R.id.inmobi_adTitle) // TextView
                .descriptionViewId(R.id.inmobi_adDescription) // TextView
                .ratingBarViewId(R.id.inmobi_adRating) // RatingBar
                .mediaContainerViewId(R.id.inmobi_adContent) // FrameLayout
                .ctaViewId(R.id.inmobi_adAction) // Button
                .build();
adPopcornSSPNativeAd.setInMobiViewBinder(inMobiViewBinder);
```

{% hint style="danger" %}
InMobiViewBinder Builder 생성 시, <mark style="color:red;">`view id(R.id.inmobi_native_ad_view)`</mark>와 <mark style="color:red;">`layout id(R.layout.inmobi_native_ad_unit_layout)`</mark>는 필수로 넘겨주어야 하며, 그 외 ui component에 대해서는 사용하는 리소스에 대해서만 설정해 주면 됩니다.
{% endhint %}

</details>

<details>

<summary>Mintegral 네이티브 레이아웃 설정</summary>

AdPopcornSSPNativeAd layout 내에  Mintegral 광고 영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml  샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <!-- Mintegral -->
    <include
        android:id="@+id/mintegral_native_ad_view"
        layout="@layout/mintegral_native_ad_unit_layout" />

</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* mintegral\_native\_ad\_unit\_layout.xml 샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/mintegral_native_outer_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@android:color/white"
    android:textDirection="locale">
    <ImageView
        android:id="@+id/mintegral_native_icon_image"
        android:layout_width="64dp"
        android:layout_height="64dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="10dp"
        android:layout_marginStart="10dp"
        android:layout_marginTop="10dp"
        android:background="@null"
        android:contentDescription="@null" />
    <TextView
        android:id="@+id/mintegral_native_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="84dp"
        android:layout_marginStart="84dp"
        android:layout_marginTop="32dp"
        android:textColor="@android:color/darker_gray"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/mintegral _native_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_below="@+id/ mintegral _native_icon_image"
        android:layout_marginLeft="10dp"
        android:layout_marginStart="10dp"
        android:layout_marginTop="10dp"
        android:textColor="@android:color/darker_gray" />


    <ImageView
        android:id="@+id/mintegral_native_main_image"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_below="@+id/mintegral_native_text"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:layout_marginTop="10dp"
        android:background="@null"
        android:scaleType="centerCrop" />

    <Button
        android:id="@+id/mintegral_native_cta"
        android:layout_width="wrap_content"
        android:layout_height="35dp"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:layout_below="@+id/mintegral_native_main_image"
        android:layout_marginEnd="10dp"
        android:layout_marginRight="10dp"
        android:layout_marginTop="10dp"
        android:clickable="true"
        android:focusable="true"
        android:paddingBottom="10dp"
        android:textColor="@android:color/black"
        android:textSize="12sp"
        android:textStyle="bold" />

    <com.mbridge.msdk.widget.MBAdChoice
        android:id="@+id/mintegral_ad_choice"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:padding="10dp" />

</RelativeLayout>
```

xml에서 생성한 ui component를 sdk에서 제공하는 <mark style="color:red;">`setMintegralViewBinder`</mark> API를 이용해 아래와 같이 설정해 줍니다.

```java
MintegralViewBinder mintegralViewBinder 
= new MintegralViewBinder.Builder(R.id.mintegral_native_ad_view, R.layout.mintegral_native_ad_unit_layout)
        .mainImageViewId(R.id.mintegral_native_main_image)
        .iconViewId(R.id.mintegral_native_icon_image)
        .titleViewId(R.id.mintegral_native_title)
        .descViewId(R.id.mintegral_native_text)
        .adCallViewId(R.id.mintegral_native_cta)
        .adChoiceViewId(R.id.mintegral_ad_choice)
        .build();
adPopcornSSPNativeAd.setMintegralViewBinder(mintegralViewBinder);
```

{% hint style="danger" %}
MintegralViewBinder Builder 생성 시, <mark style="color:red;">`view id(R.id.mintegral_native_ad_view)`</mark>와 <mark style="color:red;">`layout id(R.layout.mintegral_native_ad_unit_layout)`</mark>는 필수로 넘겨주어야 하며, 그 외 ui component에 대해서는 사용하는 리소스에 대해서만 설정해 주면 됩니다.
{% endhint %}

</details>

<details>

<summary>Fyber 네이티브 레이아웃 설정</summary>

AdPopcornSSPNativeAd layout 내에  Fyber 광고 영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml  샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <!-- Fyber -->
    <include
        android:id="@+id/fyber_native_ad_view"
        layout="@layout/fyber_native_ad_unit_layout"/>

</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* fyber\_native\_ad\_unit\_layout.xml 샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/fyber_native_ad_container"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_vertical"
            android:orientation="horizontal"
            android:padding="5dp"
            android:weightSum="1">

            <ImageView
                android:id="@+id/fyber_ad_icon"
                android:layout_width="48dp"
                android:layout_height="48dp" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"
                android:orientation="vertical">

                <TextView
                    android:id="@+id/fyber_ad_title"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:ellipsize="end"
                    android:lines="1"
                    android:textColor="@android:color/black"
                    android:textSize="15sp" />

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="horizontal">

                    <TextView
                        android:id="@+id/fyber_ad_description"
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:ellipsize="end"
                        android:gravity="center_vertical"
                        android:lines="2"
                        android:textColor="@android:color/black"
                        android:textSize="12sp" />
                    <RatingBar
                        android:id="@+id/fyber_ad_rating"
                        style="?android:attr/ratingBarStyleSmall"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:isIndicator="true"
                        android:numStars="5"
                        android:stepSize="0.5"
                        android:layout_marginLeft="10dp"/>
                </LinearLayout>
            </LinearLayout>
        </LinearLayout>

        <FrameLayout
            android:id="@+id/fyber_media_view_container"
            android:layout_width="match_parent"
            android:layout_height="150dp"
            android:gravity="center" />

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="5dp">

            <Button
                android:id="@+id/fyber_ad_cta_btn"
                android:layout_width="300dp"
                android:layout_height="50dp"
                android:layout_alignParentRight="true"
                android:background="#4286F4"
                android:paddingLeft="3dp"
                android:paddingRight="3dp"
                android:textColor="@android:color/white"
                android:textSize="12sp"
                android:visibility="visible" />

            <TextView
                android:id="@+id/fyber_sponsor"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:ellipsize="end"
                android:text="Sponsored"
                android:textSize="12sp" />
        </RelativeLayout>
    </LinearLayout>
</FrameLayout>
```

xml에서 생성한 ui component를 sdk에서 제공하는 <mark style="color:red;">`setFyberViewBinder`</mark>API를 이용해 아래와 같이 설정해 줍니다.

```java
// Fyber
FyberViewBinder fyberViewBinder = new FyberViewBinder.Builder(R.id.fyber_native_ad_view, R.layout.fyber_native_ad_unit_layout)
                .titleViewId(R.id.fyber_ad_title)
                .descriptionViewId(R.id.fyber_ad_description)
                .ratingViewId(R.id.fyber_ad_rating)
                .iconViewId(R.id.fyber_ad_icon)
                .mediaViewContainerId(R.id.fyber_media_view_container)
                .ctaViewId(R.id.fyber_ad_cta_btn)
                .build();
adPopcornSSPNativeAd.setFyberViewBinder(fyberViewBinder);
```

{% hint style="danger" %}
FyberViewBinder Builder 생성 시, <mark style="color:red;">`view id(R.id.fyber_native_ad_view)`</mark>와 <mark style="color:red;">`layout id(R.layout.fyber_native_ad_unit_layout)`</mark>는 필수로 넘겨주어야 하며, 그 외 ui component에 대해서는 사용하는 리소스에 대해서만 설정해 주면 됩니다.
{% endhint %}

</details>

<details>

<summary>Moloco 네이티브 레이아웃 설정</summary>

AdPopcornSSPNativeAd layout 내에  Moloco 광고 영역을 추가해 주세요

* native\_ad\_mediation\_layout.xml  샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <!-- Moloco -->
    <include
        android:id="@+id/moloco_native_ad_view"
        layout="@layout/moloco_native_ad_unit_layout"/>

</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

* moloco\_native\_ad\_unit\_layout.xml 샘플

```xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="10dp">

    <TextView
        android:id="@+id/moloco_native_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_toEndOf="@+id/moloco_native_icon_image"
        android:layout_toRightOf="@+id/moloco_native_icon_image"
        android:layout_marginStart="10dp"
        android:layout_marginLeft="10dp"
        android:ellipsize="end"
        android:singleLine="true"
        android:text=""
        android:textSize="14sp"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/moloco_native_sponsor"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/moloco_native_title"
        android:layout_toEndOf="@+id/moloco_native_icon_image"
        android:layout_toRightOf="@+id/moloco_native_icon_image"
        android:layout_marginStart="10dp"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="2dp"
        android:ellipsize="end"
        android:singleLine="true"
        android:text=""
        android:textColor="#888888"
        android:textSize="12sp" />

    <ImageView
        android:id="@+id/moloco_native_icon_image"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:scaleType="centerCrop" />

    <FrameLayout
        android:id="@+id/moloco_native_media_view"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:layout_below="@id/moloco_native_icon_image"
        android:layout_marginTop="10dp" />

    <TextView
        android:id="@+id/moloco_native_description"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/moloco_native_media_view"
        android:layout_marginTop="8dp"
        android:ellipsize="end"
        android:maxLines="2"
        android:text=""
        android:textSize="13sp" />

    <Button
        android:id="@+id/moloco_native_cta"
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:layout_below="@id/moloco_native_description"
        android:layout_marginTop="8dp"
        android:background="#4CAF50"
        android:text=""
        android:textColor="#FFFFFF"
        android:textSize="13sp" />

</RelativeLayout>
```

xml에서 생성한 ui component를 sdk에서 제공하는 <mark style="color:red;">`setMolocoViewBinder`</mark>API를 이용해 아래와 같이 설정해 줍니다.

```java
// Moloco
MolocoViewBinder molocoViewBinder = new MolocoViewBinder.Builder(R.id.moloco_native_ad_view, R.layout.moloco_native_ad_unit_layout)
        .titleViewId(R.id.moloco_native_title)
        .descriptionViewId(R.id.moloco_native_description)
        .iconViewId(R.id.moloco_native_icon_image)
        .mediaViewId(R.id.moloco_native_media_view)
        .callToActionViewId(R.id.moloco_native_cta)
        .sponsorViewId(R.id.moloco_native_sponsor)
        .build();
adPopcornSSPNativeAd.setMolocoViewBinder(molocoViewBinder);
```

{% hint style="danger" %}
MolocoViewBinder Builder 생성 시, <mark style="color:red;">`view id(R.id.moloco_native_ad_view)`</mark>와 <mark style="color:red;">`layout id(R.layout.moloco_native_ad_unit_layout)`</mark>는 필수로 넘겨주어야 하며, 그 외 ui component에 대해서는 사용하는 리소스에 대해서만 설정해 주면 됩니다.
{% endhint %}

</details>

### 네이티브 샘플

위에 미디에이션 설정을 모두 포함한 샘플 코드입니다.

<details>

<summary>XML 샘플(native_ad_mediation_layout.xml)</summary>

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ap_mediation_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:elevation="10dp">

    <!-- ADPopopcorn SSP-->
    <include
        android:id="@+id/ap_native_ad_view"
        layout="@layout/adpopcorn_ad_layout"/>

    <!-- ADPopopcorn SSP Template -->
    <!--<com.igaworks.ssp.part.nativead.view.AdPopcornSSPNativeAdTemplate
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/adpopcornssp_native_ad_template"/>-->

    <!-- FAN -->
    <com.facebook.ads.NativeAdLayout
        android:id="@+id/fan_native_ad_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">
        <include layout="@layout/fan_native_ad_unit_layout"/>
    </com.facebook.ads.NativeAdLayout>

    <!-- AdMob or GAM or ADOP or AdForus -->
    <com.google.android.gms.ads.nativead.NativeAdView
        android:id="@+id/admob_unified_native_ad_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <include layout="@layout/admob_native_ad_unit_layout"/>
    </com.google.android.gms.ads.nativead.NativeAdView >

    <!-- Mintegral -->
    <include
        android:id="@+id/mintegral_native_ad_view"
        layout="@layout/mintegral_native_ad_unit_layout" />

    <!-- AdFit Native-->
    <com.kakao.adfit.ads.na.AdFitNativeAdView
        android:id="@+id/adFitNativeAdView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginLeft="23dp"
        android:layout_marginTop="15dp"
        android:layout_marginRight="23dp"
        android:layout_marginBottom="15dp">
        <include layout="@layout/adfit_native_ad_unit_layout"/>
    </com.kakao.adfit.ads.na.AdFitNativeAdView>

    <!-- AdFit BizBoard -->
    <!-- <com.kakao.adfit.ads.na.AdFitBizBoardAdTemplateLayout
        android:id="@+id/adFitNativeAdView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>-->

    <!-- NAM NativeAd -->
    <com.naver.gfpsdk.GfpNativeAdView
        android:id="@+id/gfp_native_ad"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <include layout="@layout/nam_native_ad_unit_layout" />
    </com.naver.gfpsdk.GfpNativeAdView>

    <!-- NAM SimpleAd -->
    <com.naver.gfpsdk.GfpNativeSimpleAdView
        android:id="@+id/gfp_native_simple_ad"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    </com.naver.gfpsdk.GfpNativeSimpleAdView>

    <!-- AppLovin Max -->
    <include
        android:id="@+id/applovin_native_ad_view"
        layout="@layout/applovin_native_ad_unit_layout" />

    <!-- Vungle -->
    <include
        android:id="@+id/vungle_native_ad_view"
        layout="@layout/vungle_native_ad_layout"/>

    <!-- Coupang -->
    <com.coupang.ads.custom.AdsNativeView
        android:id="@+id/coupang_ads_native_view"
        android:layout_width="300dp"
        android:layout_height="250dp"
        android:layout_gravity="center_horizontal"
        android:visibility="invisible">
        <include layout="@layout/coupang_native_ad_unit_layout"/>
    </com.coupang.ads.custom.AdsNativeView>

    <!-- Pangle -->
    <include
        android:id="@+id/pangle_native_ad_view"
        layout="@layout/pangle_native_ad_unit_layout"/>

    <!-- Fyber -->
    <include
        android:id="@+id/fyber_native_ad_view"
        layout="@layout/fyber_native_ad_unit_layout"/>

    <!-- MobWith -->
    <FrameLayout
        android:id="@+id/mobwith_native_ad_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:layout_marginTop="30dp" />

    <!-- InMobi -->
    <include
        android:id="@+id/inmobi_native_ad_view"
        layout="@layout/inmobi_native_ad_unit_layout"/>
        
    <!-- Moloco -->
    <include
        android:id="@+id/moloco_native_ad_view"
        layout="@layout/moloco_native_ad_unit_layout"/>
</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

</details>

<details>

<summary>Code 샘플</summary>

```java
private void sampleNativeView(){
    AdPopcornSSPNativeAd adPopcornSSPNativeAd 
        = findViewById(R.id.ap_mediation_native_ad);
    adPopcornSSPNativeAd.setPlacementId("NativeVideo_PlacementID");
    AdPopcornSSPViewBinder adPopcornSSPViewBinder = new AdPopcornSSPViewBinder.Builder(R.id.ap_native_ad_view)
                .mainImageViewId(R.id.ap_native_ad_main_image)
                .iconImageViewId(R.id.ap_native_ad_icon_image)
                .descViewId(R.id.ap_native_ad_desc)
                .titleViewId(R.id.ap_native_ad_title)
                .callToActionId(R.id.ap_native_ad_ctatext)
                .privacyIconVisibility(true)
                .build();
        adPopcornSSPNativeAd.setAdPopcornSSPViewBinder(adPopcornSSPViewBinder);

        CoupangViewBinder coupangViewBinder = new CoupangViewBinder.Builder(R.id.coupang_ads_native_view, R.layout.coupang_native_ad_unit_layout)
                .optOutViewId(R.id.opt_out)
                .deliverViewId(R.id.deliver)
                .logoViewId(R.id.logo)
                .callToActionViewId(R.id.call_to_action)
                .mainImageViewId(R.id.main_image)
                .priceViewId(R.id.price)
                .ratingViewId(R.id.rating)
                .titleViewId(R.id.title)
                .build();
        adPopcornSSPNativeAd.setCoupangViewBinder(coupangViewBinder);

        PangleViewBinder pangleViewBinder = new PangleViewBinder.Builder(R.id.pangle_native_ad_view, R.layout.pangle_native_ad_unit_layout)
                .titleViewId(R.id.pangle_native_title)
                .descriptionViewId(R.id.pangle_native_text)
                .iconViewId(R.id.pangle_native_icon_image)
                .mediaViewId(R.id.pangle_native_media_view)
                .creativeButtonViewId(R.id.pangle_native_cta)
                .build();
        adPopcornSSPNativeAd.setPangleViewBinder(pangleViewBinder);

        MintegralViewBinder mintegralViewBinder
                = new MintegralViewBinder.Builder(R.id.mintegral_native_ad_view, R.layout.mintegral_native_ad_unit_layout)
                .mainImageViewId(R.id.mintegral_native_main_image)
                .iconViewId(R.id.mintegral_native_icon_image)
                .titleViewId(R.id.mintegral_native_title)
                .descViewId(R.id.mintegral_native_text)
                .adCallViewId(R.id.mintegral_native_cta)
                .adChoiceViewId(R.id.mintegral_ad_choice_image)
                .build();
        adPopcornSSPNativeAd.setMintegralViewBinder(mintegralViewBinder);

        // AppLovinMax
        AppLovinMaxViewBinder appLovinViewBinder = new AppLovinMaxViewBinder.Builder(R.id.applovin_native_ad_view, R.layout.applovin_native_ad_unit_layout)
                .titleViewId(R.id.applovin_native_title)
                .bodyViewId(R.id.applovin_native_body_text)
                .iconViewId(R.id.applovin_native_icon_image)
                .mediaViewId(R.id.applovin_native_main_image)
                .ctaViewId(R.id.applovin_native_cta)
                .build();
        adPopcornSSPNativeAd.setAppLovinMaxViewBinder(appLovinViewBinder);

        // FAN NATIVE AD
        FacebookViewBinder facebookViewBinder = new FacebookViewBinder.Builder(R.id.fan_native_ad_view, R.layout.fan_native_ad_unit_layout)
                .adIconViewId(R.id.fan_native_ad_icon)
                .adChoicesLayoutId(R.id.fan_ad_choices_container)
                .callToActionId(R.id.fan_native_ad_call_to_action)
                .adBodyViewId(R.id.fan_native_ad_body)
                .mediaViewId(R.id.fan_native_ad_media)
                .sponsoredViewId(R.id.fan_native_ad_sponsored_label)
                .titleViewId(R.id.fan_native_ad_title)
                .socialContextId(R.id.fan_native_ad_social_context)
                .build();

        adPopcornSSPNativeAd.setFacebookAudienceViewBinder(facebookViewBinder);

        // ADMOB NATIVE AD
        AdMobViewBinder adMobViewBinder = new AdMobViewBinder.Builder(R.id.admob_unified_native_ad_view, R.layout.admob_native_ad_unit_layout)
                .iconViewId(R.id.admob_ad_app_icon)
                .headlineViewId(R.id.admob_ad_headline)
                .bodyViewId(R.id.admob_ad_body)
                .mediaViewId(R.id.admob_ad_media)
                .callToActionId(R.id.admob_ad_call_to_action)
                .advertiserViewId(R.id.admob_ad_advertiser)
                .priceViewId(R.id.admob_ad_price)
                .starRatingViewId(R.id.admob_ad_stars)
                .storeViewId(R.id.admob_ad_store)
                .build();
        adPopcornSSPNativeAd.setAdMobViewBinder(adMobViewBinder);

        // ADManager NATIVE AD
        GAMViewBinder gamViewBinder = new GAMViewBinder.Builder(R.id.admob_unified_native_ad_view, R.layout.admob_native_ad_unit_layout)
                .iconViewId(R.id.admob_ad_app_icon)
                .headlineViewId(R.id.admob_ad_headline)
                .bodyViewId(R.id.admob_ad_body)
                .mediaViewId(R.id.admob_ad_media)
                .callToActionId(R.id.admob_ad_call_to_action)
                .advertiserViewId(R.id.admob_ad_advertiser)
                .priceViewId(R.id.admob_ad_price)
                .starRatingViewId(R.id.admob_ad_stars)
                .storeViewId(R.id.admob_ad_store)
                .build();
        adPopcornSSPNativeAd.setGAMViewBinder(gamViewBinder);

        /*AdForusViewBinder adForusViewBinder = new AdForusViewBinder.Builder(R.id.adforus_unified_native_ad_view, R.layout.adforus_native_ad_unit_layout)
                .iconViewId(R.id.adforus_ad_app_icon)
                .headlineViewId(R.id.adforus_ad_headline)
                .bodyViewId(R.id.adforus_ad_body)
                .mediaViewId(R.id.adforus_ad_media)
                .callToActionId(R.id.adforus_ad_call_to_action)
                .advertiserViewId(R.id.adforus_ad_advertiser)
                .priceViewId(R.id.adforus_ad_price)
                .starRatingViewId(R.id.adforus_ad_stars)
                .storeViewId(R.id.adforus_ad_store)
                .build();
        adPopcornSSPNativeAd.setAdForusViewBinder(adForusViewBinder);*/

        // AdFit Ad or AdFit Bizboard
        AdFitViewBinder adFitViewBinder = new AdFitViewBinder.Builder(R.id.adFitNativeAdView, R.layout.adfit_native_ad_unit_layout)
                .titleViewId(R.id.adfit_title_view)
                .bodyViewId(R.id.adfit_body_view)
                .profileIconViewId(R.id.adfit_profile_icon_view)
                .profileNameViewId(R.id.adfit_profile_name_view)
                .callToActionButtonId(R.id.adfit_call_to_action_button)
                .mediaViewId(R.id.adfit_media_view)
                .testMode(true)
                .build();
        /*AdFitViewBinder adFitViewBinder = new AdFitViewBinder.Builder(R.id.adFitNativeAdView)
                .bizBoardAd(true)
                .build();*/
        adPopcornSSPNativeAd.setAdFitViewBinder(adFitViewBinder);

        // NAM (Naver Ad Manager)
        // NAM - Gfp Native Ad
        // choice, container는 필수이고, 아래 view 중에 clickable view는 하나는 있어야 함.
        /*NAMViewBinder namViewBinder = new NAMViewBinder.Builder(R.id.gfp_native_ad, R.layout.nam_native_ad_unit_layout, true)
                .adChoicesViewId(R.id.nam_ad_choices_view) // 필수
                .assetContainerViewId(R.id.nam_assets_container) // 필수
                .advertiserViewId(R.id.nam_ad_advertiser)
                .bodyViewId(R.id.nam_ad_body)
                .mediaViewId(R.id.nam_ad_media)
                .titleViewId(R.id.nam_ad_headline)
                .iconViewId(R.id.nam_ad_app_icon)
                .callToActionButtonViewId(R.id.nam_ad_call_to_action)
                .socialContextViewId(R.id.nam_ad_social_context)
                .gfpDedupeManager(gfpDedupeManager)
                .build();
        adPopcornSSPNativeAd.setNamViewBinder(namViewBinder);*/

        // Gfp Native Simple Ad
        /*NAMViewBinder namSimpleViewBinder = new NAMViewBinder.Builder(R.id.gfp_native_simple_ad)
                .activateObservingOnBackground(true)
                .build();
        adPopcornSSPNativeAd.setNamViewBinder(namSimpleViewBinder);
        */
        // NAM - Gfp Native Ad && Native Simple Ad
        NAMViewBinder namViewMixBinder = new NAMViewBinder.Builder(R.id.gfp_native_simple_ad, R.id.gfp_native_ad, R.layout.nam_native_ad_unit_layout, true)
                .adChoicesViewId(R.id.nam_ad_choices_view) // 필수
                .assetContainerViewId(R.id.nam_assets_container) // 필수
                .advertiserViewId(R.id.nam_ad_advertiser)
                .bodyViewId(R.id.nam_ad_body)
                .mediaViewId(R.id.nam_ad_media)
                .titleViewId(R.id.nam_ad_headline)
                .iconViewId(R.id.nam_ad_app_icon)
                .callToActionButtonViewId(R.id.nam_ad_call_to_action)
                .socialContextViewId(R.id.nam_ad_social_context
                .build();
        adPopcornSSPNativeAd.setNamViewBinder(namViewMixBinder);
        
        // Vungle
        VungleViewBinder vungleViewBinder = new VungleViewBinder.Builder(R.id.vungle_native_ad_view, R.layout.vungle_native_ad_layout)
                .titleViewId(R.id.lbAdTitle)
                        .bodyViewId(R.id.lbAdBody)
                                .iconViewId(R.id.imgAdIcon)
                                        .ctaViewId(R.id.btnAdCta)
                                                .sponsoredByViewId(R.id.lbAdSponsor)
                                                        .mediaViewId(R.id.pnlVideoAd)
                                                                .ratingViewId(R.id.lbAdRating)
                                                                        .build();
        adPopcornSSPNativeAd.setVungleViewBinder(vungleViewBinder);

        // MobWith
        MobWithViewBinder mobWithViewBinder = new MobWithViewBinder.Builder(R.id.mobwith_native_ad_view, R.layout.mobwith_native_ad_unit_layout)
                .mediaContainerViewId(R.id.mediaContainerView)
                .imageViewADId(R.id.imageViewAD)
                .imageViewLogoId(R.id.imageViewLogo)
                .textViewTitleId(R.id.textViewTitle)
                .textViewDescId(R.id.textViewDesc)
                .buttonGoId(R.id.buttonGo)
                .layoutInfoViewId(R.id.infoViewLayout)
                .imageViewInfoId(R.id.imageViewInfo)
                //.mediaViewId(R.id.mediaView)
                .build();
        adPopcornSSPNativeAd.setMobWithViewBinder(mobWithViewBinder);

        // Fyber Native
        FyberViewBinder fyberViewBinder = new FyberViewBinder.Builder(R.id.fyber_native_ad_view, R.layout.fyber_native_ad_unit_layout)
                .titleViewId(R.id.fyber_ad_title)
                        .descriptionViewId(R.id.fyber_ad_description)
                                .ratingViewId(R.id.fyber_ad_rating)
                                        .iconViewId(R.id.fyber_ad_icon)
                                                .mediaViewContainerId(R.id.fyber_media_view_container)
                                                        .ctaViewId(R.id.fyber_ad_cta_btn)
                                                                .build();
        adPopcornSSPNativeAd.setFyberViewBinder(fyberViewBinder);

        // InMobi Native
        InMobiViewBinder inMobiViewBinder = new InMobiViewBinder.Builder(R.id.inmobi_native_ad_view, R.layout.inmobi_native_ad_unit_layout)
                .iconViewId(R.id.inmobi_adIcon)
                .titleViewId(R.id.inmobi_adTitle)
                .descriptionViewId(R.id.inmobi_adDescription)
                .ratingBarViewId(R.id.inmobi_adRating)
                .mediaContainerViewId(R.id.inmobi_adContent)
                .ctaViewId(R.id.inmobi_adAction)
                .build();

        // Moloco Native
        MolocoViewBinder molocoViewBinder = new MolocoViewBinder.Builder(R.id.moloco_native_ad_view, R.layout.moloco_native_ad_unit_layout)
                .titleViewId(R.id.moloco_native_title)
                .descriptionViewId(R.id.moloco_native_description)
                .iconViewId(R.id.moloco_native_icon_image)
                .mediaViewId(R.id.moloco_native_media_view)
                .callToActionViewId(R.id.moloco_native_cta)
                .sponsorViewId(R.id.moloco_native_sponsor)
                .build();
        adPopcornSSPNativeAd.setMolocoViewBinder(molocoViewBinder);
  adPopcornSSPNativeAd.loadAd();                    
}
```

</details>
