Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

CustomPreviewMessage 는 6시간 간격으로 서버에 설정된 CustomPreviewConfig 를 받아와서 frequency capping 후 PreviewMessage 를 보여주는 기능입니다. 따라서 서버에 CustomPreviewConfig 설정하는 작업이 선행되어야합니다. (frequency capping 에 의해 CustomPreviewMessage 가 보여져야 할 경우 AdPreview 와 ArticlePreview 보다 우선적으로 보여집니다.)

서버에서 클라이언트로 전달되는 CustomPreviewMessageConfig 는 다음과 같은 정보를 가지고 있습니다.

Code Block
languagejson
{
  "id": 5,
  "unit_id": 1234567890,
  "message": "오늘도 아케이드 게임하고 최대 90P 팡팡!",
  "landing_url": "deeplink://landing?activity=arcade",
  "start_date": "2020-03-01T00:00:00Z",
  "end_date": "2020-03-31T23:59:59Z",
  "start_hour_minute": "21:00",
  "end_hour_minute": "23:00",
  "dipu": 2,
  "tipu": 60,
  "dcpu": 1,
  "tcpu": 30,
  "icon": "http://imagelocation/arcade_icon.png"
}

...

이름

...

내용

...

id

...

configId (messageId), 서버에서 자동 할당합니다

...

unit_id

...

pop unitId

...

landing_url

...

랜딩 url or deeplink

...

start_date

...

config 시작 일 (UTC, 시간은 무시됩니다)

...

end_date

...

config 종료 일 (UTC, 시간은 무시됩니다)

...

start_hour_minute

...

config 시작 시간 (분은 무시됩니다)

...

end_hour_minute

...

config 종료 시간 (분은 무시됩니다)

...

dipu

...

Frequency capping: daily impression per user

...

tipu

...

Frequency capping: total impression per user

...

dcpu

...

Frequency capping: daily click per user

...

tcpu

...

Frequency capping: total click per user

...

icon

...

icon url

CustomPreviewMessage 는 두가지 영역에 표시됩니다.

  • Pop 의 CustomPreviewMessage 영역 (그림1)

    • 설정된 기간, 시간 내에 dipu, tipu, dcpu, tcpu 에 따라 frequency capping 됩니다.

    • frequency capping 에 의해 CustomPreviewMessage 가 보여져야 할 경우 AdPreview 와 ArticlePreview 보다 우선적으로 보여집니다.

  • PopFeedHeader 의 CustomPreviewMessage 영역 (그림2)

    • frequency capping 되지 않고 설정된 기간, 시간내 라면 보여집니다.

    • FeedConfig 를 customize 가능합니다

    • FeedConfig 를 사용하면서 header 를 설정하지 않으면 CustomPreviewMessage 를 안보이게 설정 가능합니다

그림1. Pop 에 CustomPreviewMessage 가 표시된 모습

...

그림2. PopFeedHeader 에 CustomPreviewMessage 가 표시된 모습

...

Step 1. (Optional) PopFeedHeader CustomizeCustomPreviewMessage 는 두가지 영역에 표시됩니다.

  • Pop 의 CustomPreviewMessage 영역 (그림1)

    • 설정된 기간, 시간 내에 dipu, tipu, dcpu, tcpu 에 따라 frequency capping 됩니다.

    • frequency capping 에 의해 CustomPreviewMessage 가 보여져야 할 경우 AdPreview 와 ArticlePreview 보다 우선적으로 보여집니다.

  • PopFeedHeader 의 CustomPreviewMessage 영역 (그림2)

    • frequency capping 되지 않고 설정된 기간, 시간내 라면 보여집니다.

    • PopConfig 를 통해 customize 가능합니다

    • header 를 설정하지 않으면 CustomPreviewMessage 를 안보이게 설정 가능합니다

그림1. Pop 에 CustomPreviewMessage 가 표시된 모습

...

그림2. PopFeedHeader 에 CustomPreviewMessage 가 표시된 모습

...

1. PopFeedHeader Customize (그림 2)

  1. DefaultPopHeaderViewAdapter 를 상속받아 CustomPopHeaderViewAdapter 를 만들고

  2. getCustomPreviewMessageLayout 를 오버라이드 합니다.

  3. getCustomPreviewMessageLayout 의 파라미터인 CustomPreviewMessage 에 message, landingUrl, iconUrl 정보가 담겨있습니다.

  4. line 9~17 3번에서 받아온 정보를 토대로 직접 layout 을 구성하고, clickEvent 처리할 수 있습니다.

  5. PopConfig.feedHeaderViewAdapterClass를 통해 CustomPopHeaderViewAdapter 를 설정합니다.

Code Block
languagejava
public class CustomPopHeaderViewAdapter extends DefaultPopHeaderViewAdapter {
    @Nullable
    @Override
    protected View getCustomPreviewMessageLayout(Context context, ViewGroup parent, CustomPreviewMessage customPreviewMessage) {
        final LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        if (inflater == null) {
            return null;
        }
        View viewCustomPreviewMessage = inflater.inflate(R.layout.view_custom_preview_message, parent, false);
        final TextView textCustomPreviewMessageTitle = viewCustomPreviewMessage.findViewById(R.id.textCustomPreviewMessageTitle);
        textCustomPreviewMessageTitle.setText(customPreviewMessage.getMessage());
        viewCustomPreviewMessage.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                startDeeplinkActivity(context, customPreviewMessage.getLandingUrl());
            }
        });
        return viewCustomPreviewMessage;
    }
}

final PopConfig popConfig = new PopConfig.Builder(getApplicationContext(), UNIT_ID_POP)
        ...
        .feedHeaderViewAdapterClass(CustomPopHeaderViewAdapter.class)
        ...
        .build();
Expand
title2.17 미만 버전
  1. DefaultPopHeaderViewAdapter 를 상속받아 CustomPopHeaderViewAdapter 를 만들고

  2. getCustomPreviewMessageLayout 를 오버라이드 합니다.

  3. getCustomPreviewMessageLayout 의 파라미터인 CustomPreviewMessage 에 message, landingUrl, iconUrl 정보가 담겨있습니다.

  4. line 9~17 3번에서 받아온 정보를 토대로 직접 layout 을 구성하고, clickEvent 처리할 수 있습니다.

  5. line 24 FeedConfig.feedHeaderViewAdapterClass를 통해 1번에서 생성한 CustomPopHeaderViewAdapter 를 설정합니다.

  6. line 29 PopConfig.feedConfig를 통해 5번에서 설정한 FeedConfig 를 설정합니다.

Code Block
languagejava
public class CustomPopHeaderViewAdapter extends DefaultPopHeaderViewAdapter {
    @Nullable
    @Override
    protected View getCustomPreviewMessageLayout(Context context, ViewGroup parent, CustomPreviewMessage customPreviewMessage) {
        final LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        if (inflater == null) {
            return null;
        }
        View viewCustomPreviewMessage = inflater.inflate(R.layout.view_custom_preview_message, parent, false);
        final TextView textCustomPreviewMessageTitle = viewCustomPreviewMessage.findViewById(R.id.textCustomPreviewMessageTitle);
        textCustomPreviewMessageTitle.setText(customPreviewMessage.getMessage());
        viewCustomPreviewMessage.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                startDeeplinkActivity(context, customPreviewMessage.getLandingUrl());
            }
        });
        return viewCustomPreviewMessage;
    }
}

final FeedConfig popFeedConfig = new FeedConfig.Builder(getApplicationContext(), UNIT_ID_POP)
        ...
        .feedHeaderViewAdapterClass(CustomPopHeaderViewAdapter.class)
        ...
        .build();
final PopConfig popConfig = new PopConfig.Builder(getApplicationContext(), UNIT_ID_POP)
        ...
        .feedConfig(popFeedConfig)
        ...
        .build();

2. (Optional) PopFeedHeader에 CustomPreviewMessage 사용 여부 설정

  • PopFeedHeader 에 CustomPreviewMessage 보이지 않도록 설정

PopConfig 설정시 PopConfig.feedHeaderViewAdapterClass 를 설정 하지 않으면 PopFeedHeader 의 CustomPreviewMessage 를 보이지 않게 설정할 수 있습니다.

...

Step 2. (Optional) FeedConfig 사용 설정

  • PopFeedHeader 에 DefaultPreviewMessage 보이도록 설정

PopConfig 설정시 PopConfig.feedHeaderViewAdapterClass(DefaultPopHeaderViewAdapter.class) 를 설정 하면 기본 제공하는 DefaultPreviewMessage 를 사용할 수 있습니다. (그림 2 참조)

Expand
title2.17 미만 버전
  • PopFeedHeader 에 CustomPreviewMessage 보이지 않도록 설정

PopConfig.feedConfig 설정시 FeedConfig.feedHeaderViewAdapterClass 를 설정 하지 않으면 PopFeedHeader 의 CustomPreviewMessage 를 보이지 않게 설정할 수 있습니다.

  • PopFeedHeader 에 DefaultPreviewMessage 보이도록 설정

PopConfig.feedConfig 설정시 FeedConfig.feedHeaderViewAdapterClass(DefaultPopHeaderViewAdapter.class) 를 설정 하면 기본 제공하는 DefaultPreviewMessage 를 사용할 수 있습니다. (그림 2 참조)

Step 3. (Optional) Preview Interval 설정

...

DefaultPopToolbarHolder 를 상속받아서 사용하는 점은 TemplatePopToolbarHolder 와 동일합니다. 사용합니다. TemplatePopToolbarHolder 와 유사하나 차이점은 PopToolbar 를 사용하지않고 layout 을 직접 구성하여 Toolbar 영역을 전부 customize 할 수 있습니다.

...

위 그림과 같은 toolbar holder를 만들기 위해 CustomPopToolbarHolder class 를 구성하는 예제입니다.

Code Block
// DefaultPopToolbarHolder 상속
public class CustomPopToolbarHolder extends DefaultPopToolbarHolder {
    @Override
    public View getView(Activity activity, @NonNull final String unitId) {
        // 직접 구성한 layout 을 사용합니다
        ViewGroup root =  (ViewGroup) activity.getLayoutInflater().inflate(R.layout.view_pop_custom_toolbar, null);

        View buttonInquiry = root.findViewById(R.id.buttonInquiry);
        buttonInquiry.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // 문의하기 페이지 열기
                showInquiry(activity, unitId);
            }
        });
        return root;
    }
}

CustomPopToolbarHolder에서 사용하는 layout.view_pop_custom_toolbar은 다음과 같습니다.

Code Block
<?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="match_parent"
    android:gravity="center_vertical"
    android:orientation="horizontal"
    android:background="@color/bzv_white_100">

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:gravity="center_vertical"
        android:orientation="horizontal"
        android:paddingLeft="16dp">

        <ImageView
            android:id="@+id/imageIcon"
            android:layout_width="154dp"
            android:layout_height="24dp"
            android:src="@drawable/bz_img_buzzvil_logo" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center_vertical">

        <ImageView
            android:id="@+id/buttonInquiry"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:layout_marginRight="16dp"
            android:src="@drawable/bzv_ic_circle_question"
            android:tint="@color/bzv_gray_light" />

    </LinearLayout>

</LinearLayout>

...

팝 지면에서 보여주는 다양한 피드백을 customize 할 수 있습니다. 오른쪽의 이미지는 피드 오픈 리워드 피드백을 베이스 리워드를 받았을 때 보여주는 Snackbar/Toast 를 customize 했을 때 보여주는 커스텀 피드백입니다.

...