개요

여기에서는 BuzzAd Android용 SDK의 Pop 지면에서 구현하는 기능을 설명하고 각 기능을 변경하는 방법을 설명합니다.

...

PopConfig 설정하기

PopConfig를 사용해 기존 Feed 지면과 별개의 Unit ID로 Pop 지면을 관리하거나 FeedConfig을 통해 설정된 기능 외에 다른 기능을 설정할 수 있습니다.
다음은 PopConfig를 BuzzAdBenefitConfig에 추가하는 예시입니다.

Code Block

language	java

final FeedConfig popFeedConfig = new FeedConfig.Builder("YOUR_POP_UNIT_ID").build();
final PopConfig popConfig = new PopConfig.Builder(popFeedConfig)
                      .build();
        
final BuzzAdBenefitConfig buzzAdBenefitConfig = new BuzzAdBenefitConfig.Builder(context)
        ...생략...
        .setPopConfig(popConfig)
        .build();
        
BuzzAdBenefit.init(this, buzzAdBenefitConfig);

Info
`FeedConfig`로 설정하는 기능에 대한 자세한 내용은 Feed 고급 설정 토픽을 참고하세요.

Pop 표시 시간 변경하기

Pop 버튼이 뜬 후 사라지기 전까지 노출되는 시간을 수정할 수 있습니다. 초기 설정 값은 5초입니다.

Code Block

language	java

PopConfig popConfig = new PopConfig.Builder(feedConfig)
    .idleTimeInMillis(10005000) //Pop 표시 시간
    .build();

Pop 표시 위치 변경하기

사용자가 기기의 화면을 잠금해제할 때마다 Pop이 표시되는 위치를 설정할 수 있습니다. 초기 설정 값은 SidePosition.Side.RIGHT, 0.6f(사용자 기기 화면 우측에서 하단 상단 기준으로 60% 높이)입니다.

Code Block

language	java

PopConfig popConfig = new PopConfig.Builder(feedConfig)
    .initialSidePosition(SidePosition(SidePosition.Side.RIGHT, 0.6f)) // Pop 표시 위치
    .build();

Pop

...

Pop 지면 닫기 버튼을 눌러 지면을 종료하기 전 뷰에 Unit ID를 설정해 사용자에게 광고를 추가적으로 노출할 수 있습니다.

Code Block

language	java

PopConfig popConfig = new PopConfig.Builder(feedConfig)
    .popExitUnitId(R.id.your_pop_exit_unit_id) //Pop 종료 광고 지면 Unit ID
    .build();

Pop 포그라운드 서비스 알림 자체 구현하기

PopConfig를 사용해 Pop 포그라운드 서비스 알림을 직접 구현해 알림의 동작, UI 레이아웃까지 변경할 수 있습니다.

...

포그라운드 서비스 알림 자체 구현하기

PopConfig를 사용해 Pop 포그라운드 서비스 알림을 직접 구현해 알림의 동작과 UI 레이아웃을 변경할 수 있습니다.

Pop을 사용하면 Pop의 포그라운드 서비스 알림이 활성화되며 PopConfig를 사용해 직접 구현하지 않으면 사용자 모바일 기기 상단의 알림 창에는 BuzzAd Android용 SDK에서 기본으로 제공하는 포그라운드 서비스 알림이 표시됩니다.

Info
BuzzAd Android용 SDK에서 기본으로 제공하는 포그라운드 서비스 알림의 디자인을 변경하려면 Pop 포그라운드 서비스 알림 디자인 변경하기 토픽을 참고하세요.

...

Pop 포그라운드 서비스 알림을 직접 구현하려면 다음의 절차를 따르세요.

PopControlService의 상속 클래스를 구현하세요.

notificationChannel을 생성하거나 View를 등록할 수 있습니다.

getPopPendingIntent(unitId, context)를 등록해 으로 Pop 지면으로 진입하는 PendingIntent를 제공할 이용할 수 있습니다.
다음은 PopControlService의 상속 클래스를 구현하는 예시입니다.

Code Block

language	java

public class YourControlService extends PopControlService {

    @Override
    protected Notification buildForegroundNotification(@NonNull String unitId, @NonNull PopNotificationConfig popNotificationConfig) {
        // Pop을 표시하는 PendingIntent (원형 아이콘)
        PendingIntent popPendingIntent = getPopPendingIntent(unitId, this);

        // 필요에 따라 notificationChannel을 등록합니다.
        NotificationCompat.Builder builder;
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
            createNotificationChannelIfNeeded();
            builder = new NotificationCompat.Builder(this, NOTIFICATION_CHANNEL_ID);
        } else {
            builder = new NotificationCompat.Builder(this);
        }

        // Pop Service Notification 에 사용할 View 를 등록합니다.
        RemoteViews remoteView = new RemoteViews(getPackageName(), R.layout.view_custom_notification);
        builder.setSmallIcon(popNotificationConfig.getSmallIconResId())
                .setContent(remoteView)
                .setContentIntent(popPendingIntent)
                .setPriority(PRIORITY_LOW)
                .setShowWhen(false);
        if (popNotificationConfig.getColor() != null) {
            builder.setColor(popNotificationConfig.getColor());
        }
        return builder.build();
    }

    @TargetApi(Build.VERSION_CODES.O)
    protected void createNotificationChannelIfNeeded() {
        final NotificationManager notificationManager = (NotificationManager) getSystemService(Context.NOTIFICATION_SERVICE);
        if (notificationManager.getNotificationChannel(NOTIFICATION_CHANNEL_ID) == null) {
            final NotificationChannel channel = new NotificationChannel(NOTIFICATION_CHANNEL_ID, NOTIFICATION_CHANNEL_NAME, NotificationManager.IMPORTANCE_LOW);
            channel.setShowBadge(false);
            notificationManager.createNotificationChannel(channel);
        }
    }
}

NotificationId

notificationId는 PopNotificationConfig

에서

객체에 설정하세요. 다음의 예시를 참고하세요.

Code Block

language	java

final PopNotificationConfig popNotificationConfig = new PopNotificationConfig.Builder(

getApplicationContext(

context)

)


                .notificationId(NOTIFICATION_ID)
                .build();

final FeedConfig popFeedConfig = new FeedConfig.Builder("YOUR_POP_UNIT_ID").build();
final PopConfig popConfig = new PopConfig.Builder(popFeedConfig)
        .popNotificationConfig(popNotificationConfig)
        .controlService(YourControlService.class)
        .build();

final BuzzAdBenefitConfig buzzAdBenefitConfig = new BuzzAdBenefitConfig.Builder(context)
        .setPopConfig(popConfig)
        .build();

구현한 상속 클래스를 AndroidManifest.xml 파일에 에 service로 등록하세요.
// AndroidManifest.xml <application ...생략...
Code Block
language java
xml
 <application <service android:name=".YourControlService" /> ...생략... </application>

Pop 활성화 버튼 숨기기

Pop 지면을 추가하면 기존에 연동한 Feed에 Pop 활성화 버튼이 자동으로 표시됩니다. Pop을 활성화하지 않은 사용자는 이 버튼을 통해 자연스럽게 Pop을 활성화할 수 있으며, Pop을 한 번 활성화하면 버튼은 Feed 지면에서 사라집니다.

...

Code Block

language	java

final FeedConfig feedConfig = new FeedConfig.Builder("YOUR_POP_UNIT_ID")
        .optInAndShowPopButtonHandlerClass(null) // Pop 활성화 버튼 숨김
        .build();

툴바 자체 구현하기

Pop 지면 내 툴바의 디자인을 변경할 수 있습니다. 툴바 영역의 UI를 변경하는 방법은 2가지입니다. 아래 2가지 방법 중 하나를 선택하여 연동하세요.

...

SDK 기본 UI 사용하기

BuzzAd Android용 SDK에서 제공하는 기본 UI를 수정하여 Pop 지면 툴바의 디자인을 변경할 수 있습니다.

...

BuzzAd Android용 SDK에서 제공하는 기본 UI의 디자인을 변경하려면 DefaultFeedToolbarHolder를 상속받은 클래스를 구현하고, 기본 UI인 FeedToolbar를 사용하여 타이틀 혹은 배경색을 변경합니다. 그리고 FeedConfig에 구현한 클래스를 추가합니다.BuzzAd Android용 SDK에서 제공하는 기본 UI의 디자인을 변경하려면 DefaultPopToolbarHolder를 상속받은 클래스를 구현하고 기본 UI인 PopToolbar 를 사용하여 레이아웃에서 변경합니다. 그리고 PopConfig FeedConfig의 feedToolbarHolderClass에 구현한 클래스를 추가합니다.

다음은 BuzzAd Android Android용 SDK에서 제공하는 UI를 이용하여 Pop 지면의 툴바를 직접 구현하는 예시입니다.

Code Block

language	java

class YourPopToolbarHolder extends DefaultPopToolbarHolder {
    @Override
    public View getView(Activity activity, @NonNull final String unitId) {
        toolbar = new PopToolbar(activity); // PopToolbar 에서 제공하는 기본 Template 사용
        toolbar.setTitle("TemplatePopToolbarHolder"); // 툴바 타이틀 문구를 변경합니다.
        toolbar.setIconResource(R.mipmap.ic_launcher); // 툴바 좌측 아이콘을 변경합니다. 
        toolbar.setBackgroundColor(Color.LTGRAY); // 툴바 배경색을 변경합니다.

        addSettingsMenuItemView(activity, unitId); // 메뉴 버튼 추가 (메뉴 안에 문의하기 버튼이 있습니다)
//        addInquiryMenuItemView(activity, unitId); // 문의하기 버튼은 이 함수를 통해 간단하게 추가 가능합니다.
        addRightMenuItemView(activity, unitId); // custom 버튼 추가
        return toolbar;
    }

    // custom 버튼 추가는 toolbar.buildPopMenuItemView 를 사용하여 PopMenuImageView 를 생성하고
    // toolbar.addRightMenuButton 를 사용하여 toolbar 에 추가합니다.
    private void addRightMenuItemView(@NonNull final Activity activity, @NonNull final String unitId) {
        PopMenuImageView menuItemView = toolbar.buildPopMenuItemView(activity, R.mipmap.ic_launcher);
        menuItemView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                showInquiry(activity, unitId); // 문의하기 페이지로 연결합니다. 
            }
        });
        toolbar.addRightMenuButton(menuItemView);
    }
}

...

Code Block

language	java

final FeedConfig popFeedConfig = new FeedConfig.Builder("YOUR_POP_UNIT_ID")
    ...생략...
    .feedToolbarHolderClass(YourPopToolbarHolder.class)
    .build();
new PopConfig.Builder(popFeedConfig)
    ...생략...
    .build();

직접 구현한 Custom View 사용하기

BuzzAd Android용 SDK에서 제공하는 UI를 사용하지 않고 직접 Custom View를 구현하여 Pop지면의 툴바를 변경할 수 있습니다.

...

다음은 Custom View를 직접 생성하여 툴바를 변경하는 예시입니다. 이 예시에서는 DefaultPopToolbarHolder의 상속 클래스를 구현합니다. 그런 다음 PopConfig에 구현한 클래스를 추가합니다.

Code Block

language	java

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

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

Code Block

language	java

final FeedConfig popFeedConfig = new FeedConfig.Builder("YOUR_POP_UNIT_ID")
    ...생략...
    .feedToolbarHolderClass(YourPopToolbarHolder.class)
    .build();
new PopConfig.Builder(popFeedConfig)
    ...생략...
    .build();

Pop 유틸리티 영역 변경하기

Pop 지면 우측 하단의 유틸리티 영역에는 앱 메뉴 실행, 다른 페이지로 이동 등 원하는 기능을 추가할 수 있습니다.

...

Code Block

language	java

new PopConfig.Builder(popFeedConfig)
      .popUtilityLayoutHandlerClass(CustomPopUtilityLayoutHandler.class)
      .build();

유틸리티 영역 아이콘 이미지 규격

유틸리티 영역에 추가하는 기능의 아이콘의 이미지 규격은 아래의 표를 참고하세요.

항목	규격
이미지 유형	픽셀 또는 벡터 이미지
사이즈	mdpi 기준: 24 x 24 dp 96 x 96 px (xxxhdpi까지 지원, 픽셀 기준 최대 4배)
색상	흑백 또는 채색

커스텀 페이지 추가하기

Pop 지면에 직접 내용을 구성하는 커스텀 페이지를 추가할 수 있습니다. 커스텀 페이지는 툴바와 콘텐츠로 구성됩니다. 툴바에는 타이틀을 설정할 수 있으며, 콘텐츠 영역에는 원하는 프래그먼트를 설정할 수 있습니다.

...

Versions Compared

Old Version 13

New Version Current

Key

목차

개요

PopConfig 설정하기

Pop 표시 시간 변경하기

Pop 표시 위치 변경하기

Pop

Pop 포그라운드 서비스 알림 자체 구현하기

포그라운드 서비스 알림 자체 구현하기

Pop 활성화 버튼 숨기기

툴바 자체 구현하기

SDK 기본 UI 사용하기

직접 구현한 Custom View 사용하기

Pop 유틸리티 영역 변경하기

유틸리티 영역 아이콘 이미지 규격

커스텀 페이지 추가하기

Page Comparison

Versions Compared

Old Version 13

New Version Current

Key

목차

개요

PopConfig 설정하기

Pop 표시 시간 변경하기

Pop 표시 위치 변경하기

Pop

Pop 포그라운드 서비스 알림 자체 구현하기

포그라운드 서비스 알림 자체 구현하기

Pop 활성화 버튼 숨기기

툴바 자체 구현하기

SDK 기본 UI 사용하기

직접 구현한 Custom View 사용하기

Pop 유틸리티 영역 변경하기

유틸리티 영역 아이콘 이미지 규격

커스텀 페이지 추가하기