> 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-1.md).

# 네이티브 동영상 레이아웃 가이드

애드팝콘 v3.9.4 버전부터 동영상 광고를 지원합니다. 현재 지원 및 지원 예정인 업체는 아래와 같습니다.

* NAM
* AdFit
* AdMob, GAM
* Pangle
* Vungle(v3.10.6 버전 부터 지원 시작)
* AdPopcornSSP(지원 예정)

## 1. 네이티브 동영상 레이아웃 기본 설정

네이티브 동영상구성을 위한 기본 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>
```

## 2. 네이티브 동영상 샘플

아래에는 전체 레이아웃 설정과 심플 레이아웃 설정을 구분하여 샘플로 제공합니다.

### 2.1  전체 레이아웃 설정 샘플

#### 2.1.1 네이티브 동영상 전체 레이아웃 미디에이션 설정

각 미디에이션 업체의 네이티브 레이아웃 구성에서 media View에 이미지 광고 대신 동영상 광고가 노출될 예정입니다. 상세한 설정은 아래에서 다시 한번 확인 가능합니다.

<details>

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

#### GfpNativeAdView <a href="#gfpnativeadview" id="gfpnativeadview"></a>

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>
```

그리고 지정한 영역을 아래와 같이 `setNamViewBinder`를 통해 전달해 주면 됩니다.

```
// 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

viewBinder Builder 생성 시, GfpNativeAdView id, native adview의 layout, hasMediaView 설정값을 반드시 넘겨줍니다.

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

</details>

<details>

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

### AdFitNativeAdView

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에서 제공하는 <mark style="color:red;">`setAdFitViewBinder`</mark> 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);
```

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

</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>

#### 2.1.2 네이티브 동영상 전체 레이아웃 연동 샘플

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

<details>

<summary>XML 샘플(native_video_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"
    android:elevation="10dp">

    <!-- AdMob or GAM  -->
    <com.google.android.gms.ads.nativead.NativeAdView
        android:id="@+id/shortform_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 >

    <!-- AdFit Native-->
    <com.kakao.adfit.ads.na.AdFitNativeAdView
        android:id="@+id/shortform_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_video_ad_unit_layout"/>
    </com.kakao.adfit.ads.na.AdFitNativeAdView>

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

    <!-- Pangle -->
    <include
        android:id="@+id/shortform_pangle_native_ad_view"
        layout="@layout/pangle_native_ad_unit_layout"/>
</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

</details>

<details>

<summary>Code 샘플</summary>

```java
private void sampleNativeVideoView(){
    AdPopcornSSPNativeAd adPopcornSSPNativeAd 
        = findViewById(R.id.ap_mediation_native_ad);
    adPopcornSSPNativeAd.setPlacementId("NativeVideo_PlacementID");
    AdMobViewBinder adMobViewBinder = new AdMobViewBinder.Builder(
                            R.id.shortform_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);
   AdFitViewBinder adFitViewBinder = new AdFitViewBinder.Builder(
                            R.id.shortform_adFitNativeAdView,
                            R.layout.adfit_native_video_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)
                            .videoAutoPlayPolicy(2)
                            .build();
   adPopcornSSPNativeAd.setAdFitViewBinder(adFitViewBinder);
   NAMViewBinder namViewBinder = new NAMViewBinder.Builder(
                            R.id.shortform_gfp_native_ad,
                            R.layout.nam_native_video_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(namViewBinder);
  PangleViewBinder pangleViewBinder = new PangleViewBinder.Builder(
                            R.id.shortform_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);
  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);
  adPopcornSSPNativeAd.loadAd();                    
}
```

</details>

### 2.2 심플 레이아웃 샘플

아래 설정은 다음 2가지 기본 값을 가지고 네이티브 동영상을 구성하고자 할 때 바로 사용 가능한 샘플입니다.

* MediaView
* CTA

#### 2.2.1 네이티브 동영상 심플레이아웃 미디에이션 설정

<details>

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

### NativeAdView

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

* native\_ad\_mediation\_simple\_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_video_simple_ad_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <include layout="@layout/admob_native_video_ad_unit_layout_simple"/>
    </com.google.android.gms.ads.nativead.NativeAdView>

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

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

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

    <TextView
        android:id="@+id/admob_ad_headline"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:visibility="gone" />

    <com.google.android.gms.ads.nativead.MediaView
        android:id="@+id/admob_ad_media"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <Button
        android:id="@+id/admob_ad_call_to_action"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="8dp"
        android:background="#99000000"
        android:paddingLeft="14dp"
        android:paddingRight="14dp"
        android:paddingTop="6dp"
        android:paddingBottom="6dp"
        android:textColor="#FFFFFF"
        android:textStyle="bold"
        android:textSize="12sp" />
</FrameLayout>
```

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

```java
// AdMob
AdMobViewBinder adMobVideoViewBinder = new AdMobViewBinder.Builder(
                R.id.admob_unified_native_video_simple_ad_view,
                R.layout.admob_native_video_ad_unit_layout_simple)
                .headlineViewId(R.id.admob_ad_headline)
                .mediaViewId(R.id.admob_ad_media)
                .callToActionId(R.id.admob_ad_call_to_action)
                .build();
 adPopcornSSPNativeVideoAd.setAdMobViewBinder(adMobVideoViewBinder);
```

{% 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 %}

* headline의 경우 필수 값이기에, 영역만 생성하고 노출은 제외 시킵니다.

</details>

<details>

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

### AdFitNativeAdView

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

* native\_ad\_mediation\_simple\_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/adfit_native_video_simple_ad_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <include layout="@layout/adfit_native_video_ad_unit_layout_simple"/>
    </com.kakao.adfit.ads.na.AdFitNativeAdView>
...
</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>
```

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

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

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

    <Button
        android:id="@+id/adfit_call_to_action_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="8dp"
        android:background="#99000000"
        android:paddingLeft="14dp"
        android:paddingRight="14dp"
        android:paddingTop="6dp"
        android:paddingBottom="6dp"
        android:textColor="#FFFFFF"
        android:textStyle="bold"
        android:textSize="12sp" />
</FrameLayout>
```

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

```java
AdFitViewBinder adFitVideoViewBinder = new AdFitViewBinder.Builder(
                R.id.adfit_native_video_simple_ad_view,
                R.layout.adfit_native_video_ad_unit_layout_simple)
                .callToActionButtonId(R.id.adfit_call_to_action_button)
                .mediaViewId(R.id.adfit_media_view)
                .build();
adPopcornSSPNativeVideoAd.setAdFitViewBinder(adFitVideoViewBinder);
```

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

</details>

<details>

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

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

* native\_ad\_mediation\_simple\_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_video_simple_ad_view"
        layout="@layout/pangle_native_video_ad_unit_layout_simple"/>

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

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

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

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

    <Button
        android:id="@+id/pangle_native_cta"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="8dp"
        android:background="#99000000"
        android:paddingLeft="14dp"
        android:paddingRight="14dp"
        android:paddingTop="6dp"
        android:paddingBottom="6dp"
        android:textColor="#FFFFFF"
        android:textStyle="bold"
        android:textSize="12sp" />
</FrameLayout>
```

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

```java
PangleViewBinder pangleVideoViewBinder = new PangleViewBinder.Builder(
                R.id.pangle_native_video_simple_ad_view,
                R.layout.pangle_native_video_ad_unit_layout_simple)
                .mediaViewId(R.id.pangle_native_media_view)
                .creativeButtonViewId(R.id.pangle_native_cta)
                .build();
adPopcornSSPNativeVideoAd.setPangleViewBinder(pangleVideoViewBinder);
```

{% 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\_simple\_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_simple_ad_view"
        layout="@layout/vungle_native_video_ad_layout_simple"/>

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

* vungle\_native\_ad\_unit\_layout\_simple.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="match_parent"
    android:background="#000000">

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

    <Button
        android:id="@+id/btnAdCta"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="8dp"
        android:background="#99000000"
        android:paddingLeft="14dp"
        android:paddingRight="14dp"
        android:paddingTop="6dp"
        android:paddingBottom="6dp"
        android:textColor="#FFFFFF"
        android:textStyle="bold"
        android:textSize="12sp" />
</FrameLayout>
```

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

```java
VungleViewBinder vungleVideoViewBinder = new VungleViewBinder.Builder(
                R.id.vungle_native_simple_ad_view,
                R.layout.vungle_native_video_ad_layout_simple)
                .ctaViewId(R.id.btnAdCta)
                .mediaViewId(R.id.pnlVideoAd)
                .build();
adPopcornSSPNativeVideoAd.setVungleViewBinder(vungleVideoViewBinder);
```

{% 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>

#### 2.2.2 네이티브 동영상 심플 레이아웃 연동 샘플

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

<details>

<summary>XML 샘플(native_video_mediation_simple_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_video_simple_ad"
    android:layout_width="match_parent"
    android:layout_height="250dp"
    android:layout_gravity="center"
    android:elevation="10dp">
    <!-- AdMob -->
    <com.google.android.gms.ads.nativead.NativeAdView
        android:id="@+id/admob_unified_native_video_simple_ad_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <include layout="@layout/admob_native_video_ad_unit_layout_simple"/>
    </com.google.android.gms.ads.nativead.NativeAdView>
    <!-- AdFit Native-->
    <com.kakao.adfit.ads.na.AdFitNativeAdView
        android:id="@+id/adfit_native_video_simple_ad_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <include layout="@layout/adfit_native_video_ad_unit_layout_simple"/>
    </com.kakao.adfit.ads.na.AdFitNativeAdView>
    <!-- Pangle -->
    <include
        android:id="@+id/pangle_native_video_simple_ad_view"
        layout="@layout/pangle_native_video_ad_unit_layout_simple"/>
    <!-- Vungle -->
    <include
        android:id="@+id/vungle_native_simple_ad_view"
        layout="@layout/vungle_native_video_ad_layout_simple"/>
</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>

```

</details>

<details>

<summary>Code 샘플</summary>

```java
private void sampleNativeVideoView(){
    AdPopcornSSPNativeAd adPopcornSSPNativeAd 
        = findViewById(R.id.ap_mediation_native_video_simple_ad);
    adPopcornSSPNativeAd.setPlacementId("NativeVideo_PlacementID");
    PangleViewBinder pangleVideoViewBinder = new PangleViewBinder.Builder(
                R.id.pangle_native_video_simple_ad_view,
                R.layout.pangle_native_video_ad_unit_layout_simple)
                .mediaViewId(R.id.pangle_native_media_view)
                .creativeButtonViewId(R.id.pangle_native_cta)
                .build();
    adPopcornSSPNativeVideoAd.setPangleViewBinder(pangleVideoViewBinder);

    AdMobViewBinder adMobVideoViewBinder = new AdMobViewBinder.Builder(
                R.id.admob_unified_native_video_simple_ad_view,
                R.layout.admob_native_video_ad_unit_layout_simple)
                .headlineViewId(R.id.admob_ad_headline)
                .mediaViewId(R.id.admob_ad_media)
                .callToActionId(R.id.admob_ad_call_to_action)
                .build();
    adPopcornSSPNativeVideoAd.setAdMobViewBinder(adMobVideoViewBinder);

    AdFitViewBinder adFitVideoViewBinder = new AdFitViewBinder.Builder(
                R.id.adfit_native_video_simple_ad_view,
                R.layout.adfit_native_video_ad_unit_layout_simple)
                .callToActionButtonId(R.id.adfit_call_to_action_button)
                .mediaViewId(R.id.adfit_media_view)
                .build();
    adPopcornSSPNativeVideoAd.setAdFitViewBinder(adFitVideoViewBinder);

    VungleViewBinder vungleVideoViewBinder = new VungleViewBinder.Builder(
                R.id.vungle_native_simple_ad_view,
                R.layout.vungle_native_video_ad_layout_simple)
                .ctaViewId(R.id.btnAdCta)
                .mediaViewId(R.id.pnlVideoAd)
                .build();
    adPopcornSSPNativeVideoAd.setVungleViewBinder(vungleVideoViewBinder);
    adPopcornSSPNativeAd.loadAd();                    
}
```

</details>
