---
description: 애드팝콘 네이티브 뷰 설정을 진행합니다.
---

# AdPopcornSSP NativeAdView

애드팝콘 네이티브의 경우 일반 네이티브와  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)
        .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 %}







