목차
개요
여기에서는 BuzzAd Android용 SDK에서 제공하는 Pop 버튼과 Pop Feed 지면의 UI의 디자인을 변경하기 위한 방법을 안내합니다. Pop 버튼과 Pop Feed 지면 디자인 규격에 대한 자세한 지침은 Pop 디자인 가이드 문서를 확인하세요.
추가적인 디자인 변경을 원하는 경우, Pop 고급 설정 토픽을 참고해 UI를 직접 구현하세요.
Pop 버튼 색상
주요 UI의 색상(Primary color)을 변경할 수 있는 GlobalTheme을 사용해 Pop 버튼의 색상을 변경할 수 있습니다. 자세한 내용은 전체 테마 변경하기 토픽을 참고하세요.
Pop 버튼 아이콘
Application.onCreate에서 BuzzAdPopTheme을 설정하여 Pop 버튼의 평상시 아이콘, 리워드 아이콘, 종료 아이콘 변경할 수 있습니다.
아이콘 유형 | 코드 | 설명 | 권장 사이즈 |
|---|---|---|---|
평상시 아이콘 |
| Pop 버튼의 기본 아이콘입니다. 사용자가 광고에 참여하지 않아도 적립할 수 있는 포인트가 없을 때 나타납니다. |
|
리워드 아이콘 |
| 사용자가 적립할 수 있는 포인트를 있음을 알려줍니다. | |
종료 아이콘 |
| Pop Feed 지면을 종료합니다. |
다음의 Pop 아이콘을 변경하는 예시입니다.
BuzzAdPopTheme buzzAdPopTheme = BuzzAdPopTheme.getDefault()
...생략...
.iconResId(R.drawable.your_pop_icon)
.rewardReadyIconResId(R.drawable.your_pop_icon_reward_ready)
.popFeedCloseIconResId(R.drawable.your_pop_icon_feed_close);
BuzzAdPop.getInstance().setTheme(buzzAdPopTheme);
Pop 버튼 아이콘 리소스 구성하기
Pop 버튼 아이콘의 리소스는 각각 다음과 같이 구성할 수 있습니다.
iconResId: 평상시 아이콘과 종료 아이콘을 지정하세요.
<!-- your_pop_icon.xml -->
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 종료 아이콘 -->
<item android:drawable="@drawable/icon_pop_selected" android:state_selected="true" />
<!-- 평상시 팝 아이콘 -->
<item android:drawable="@drawable/icon_pop"/>
</selector>
rewardReadyIconResId: 적립 가능한 포인트가 있을 때 표시할 아이콘을 지정하세요.
<!-- you_pop_icon_reward_ready.xml -->
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 종료 아이콘 -->
<item android:drawable="@drawable/icon_pop_selected" android:state_selected="true" />
<!-- 적립 가능 포인트가 있을 때 팝 아이콘 -->
<item android:drawable="@drawable/icon_pop_reward_ready"/>
</selector>
Pop 활성화 버튼
Pop 활성화 버튼은 버튼 색상 및 아이콘, 그리고 텍스트로 구성됩니다.
버튼의 색상과 아이콘의 디자인은 전체 테마 변경하기 토픽을 참고해 변경할 수 있습니다.
버튼의 텍스트를 변경하려면 DefaultOptInAndShowPopButtonHandler를 상속받는 클래스를 구현하고 FeedConfig에서 설정하세요.
다음은 Pop 활성화 버튼의 텍스트를 변경하는 예시입니다.
public class CustomOptInAndShowPopButtonHandler extends DefaultOptInAndShowPopButtonHandler {
// 활성화 버튼에 보여지는 텍스트입니다.
@Override
public String getOptInAndShowPopButtonText(Context context) {
return "YOUR_BUTTON_TEXT";
}
}
final FeedConfig feedConfig = new FeedConfig.Builder("YOUR_FEED_UNIT_ID")
.optInAndShowPopButtonHandlerClass(CustomOptInAndShowPopButtonHandler.class)
.build();
Pop 포그라운드 서비스 알림
Pop이 활성화되면 Pop의 포그라운드 서비스 알림이 사용자 모바일 기기 상단의 알림 창에 표시됩니다. BuzzAd Android용 SDK에서 기본으로 제공하는 UI를 설정해 Pop 포그라운드 서비스 알림 디자인을 변경할 수 있습니다.
SDK 기본 UI로 변경할 수 있는 서비스 알림 디자인 요소는 아래 그림과 표를 참고하세요.
번호 | 구성 요소 | 설명 |
|---|---|---|
1 | 앱 아이콘( | Pop을 연동한 앱 아이콘입니다. 아이콘을 정상적으로 표시하기 위해 Adaptive Icon은 권장하지 않습니다. |
2 | 색상( | Pop을 연동한 앱 아이콘과 앱 이름에 적용되는 색상입니다. 포그라운드 서비스 알림의 배경 색상인 흰색은 권장하지 않습니다. |
3 |
| Pop 포그라운드 서비스 알림임을 표시하는 텍스트입니다. |
4 |
| Pop 포그라운드 서비스 알림을 누르면 Pop Feed 지면을 실행할 수 있음을 알리는 텍스트입니다. |
Pop 포그라운드 서비스 알림의 디자인을 변경하려면 PopNotificationConfig에서 구성 요소 값을 설정한 다음 popFeedConfig에 통합하세요.
다음은 Pop 포그라운드 서비스 알림의 디자인을 변경하는 예시입니다.
final PopNotificationConfig popNotificationConfig = new PopNotificationConfig.Builder(getApplicationContext())
.smallIconResId(R.drawable.your_small_icon) // 흰색 아이콘, Adaptive Icon 이 설정하지 않도록 주의 요망
.titleResId(R.string.your_pop_notification_title)
.textResId(R.string.your_pop_notification_text)
.colorResId(R.color.your_pop_notification_color)
.notificationId(5000) // 기본값
.build();
final FeedConfig popFeedConfig = new FeedConfig.Builder("YOUR_POP_UNIT_ID").build();
PopConfig popConfig = new PopConfig.Builder(popFeedConfig)
...생략...
.popNotificationConfig(popNotificationConfig)
.build();
UI 레이아웃 또는 알림의 동작을 변경하려면 알림을 직접 구현해야 합니다. 자세한 내용은 Pop 포그라운드 서비스 알림 자체 구현하기 토픽을 참고하세요.
툴바 아이콘 색상
BuzzAd Android용 SDK에서 제공하는 Pop Feed 지면 내 툴바 영역의 왼쪽 아이콘 색상을 변경할 수 있습니다. 자세한 내용은 전체 테마 변경하기 토픽을 참고하세요.
