1 전체 테마 변경하기
2 광고 참여 방식 변경하기
- 2.1 커스텀 인앱 브라우저 사용하기
  - 2.1.1 커스텀 인앱 브라우저 구현
  - 2.1.2 커스텀 런처 구현
  - 2.1.3 커스텀 런처 설정

전체 테마 변경하기

BuzzAd Android용 SDK에서 제공하는 기본 UI를 사용해 광고 지면의 색상, 아이콘 이미지 등 테마를 변경할 수 있습니다.

테마를 변경하려면 BuzzAdBenefit.init()을 호출해 BuzzAd Android용 SDK를 초기화하기 전에 BuzzAdTheme.setGloabalTheme()을 호출해야 합니다.

버즈빌은 Application.onCreate에서 테마를 설정하는 것을 권장합니다. 각 속성 값에서 커스터마이징할 수 있는 UI에 대해서는 아래의 표를 참고하세요.

속성 값	커스터마이징이 가능한 UI

속성 값	커스터마이징이 가능한 UI
`rewardIcon`	모든 지면: CTA 뷰 리워드 아이콘 Feed: 프로필 배너 리워드 아이콘 Feed: 팝 옵트인 버튼 아이콘 만보기형 Pop: Pop 리워드 아이콘 만보기형 Pop: 헤더 배너 리워드 아이콘 만보기형 Pop: 목표 걸음 수 리워드 아이콘 만보기형 Pop: 푸시 알림 리워드 아이콘 Push: 푸시 알림 리워드 아이콘
`participatedIcon`	모든 지면: CTA 뷰
`ctaBackgroundSelector`	모든 지면: CTA 뷰 안드로이드 뷰가 지원하는 state 적용 가능 (예: state_pressed, state_enabled 등)
`ctaTextColorSelector`	모든 지면: CTA 뷰 안드로이드 TextView가 지원하는 state 적용 가능 (예: stat_pressed, state_enabled 등)
`ctaTextSize`	모든 지면: CTA 뷰
`colorPrimaryDark`	Feed: 탭 UI, 필터 UI, Pop 팝 아이콘 배경색 등 Interstitial: Feed 진입 경로 텍스트 색상 Pop: Pop 아이콘 배경색, Toolbar UI, 다른 앱 위에 그리기 권한 다이얼로그 UI 등 Push: 구독 다이얼로그 UI Ext. Auth: 로그인 바텀 시트 UI 개인 정보 수집 동의 UI
`colorPrimary`
`colorPrimaryLight`
`colorPrimaryLighter`
`colorPrimaryLightest`

주요 색상 변경하기

BuzzAd Android용 SDK에서 제공하는 UI 중 다이얼로그의 버튼 색상, 바텀 시트 UI의 확인 버튼 등 앱에 연동한 모든 지면 내 주요 UI의 색상(Primary color)을 GlobalTheme을 사용해 변경할 수 있습니다.

다음은 앱에 연동한 전체 지면의 주요 색상을 변경하는 예시입니다.

BuzzAdTheme buzzAdTheme = new BuzzAdTheme()
    ...생략...
    .colorPrimary(R.color.your_primary_color)
    .colorPrimaryDark(R.color.your_primary_color_dark)
    .colorPrimaryLight(R.color.your_primary_color_light)
    .colorPrimaryLighter(R.color.your_primary_color_lighter)
    .colorPrimaryLightest(R.color.your_primary_color_lightest);
BuzzAdTheme.setGlobalTheme(buzzAdTheme);

BuzzAdBenefit.init(...);

리워드 아이콘 변경하기

다음은 BuzzAdTheme에 rewardIcon를 추가해 리워드 아이콘을 변경하는 예시입니다.

BuzzAdTheme buzzAdTheme = new BuzzAdTheme()
    ...생략...
    .rewardIcon(R.drawable.your_reward_icon);
BuzzAdTheme.setGlobalTheme(buzzAdTheme);

BuzzAdBenefit.init(...);

CTA 버튼 커스터마이징하기

BuzzAd Android용 SDK에서 제공하는 CTA 버튼의 디자인을 변경할 수 있습니다.

CTA 버튼 디자인을 변경하려면 GlobalTheme을 설정해 앱에 연동된 모든 유형의 지면의 CTA 버튼 디자인을 변경하거나, 각 지면에서 개별적으로 변경해야 합니다.

또는 GlobalTheme을 설정한 후에 각 지면의 CTA 버튼 디자인을 개별적으로 변경할 수 있습니다. 앱에 연동한 모든 지면의 디자인을 효율적인 관리를 위해, 버즈빌은 GlobalTheme을 설정한 후에 각 지면의 CTA 버튼 디자인을 개별적으로 변경하는 방법을 권장합니다.

전체 지면의 CTA 버튼 디자인 변경하기

GlobalTheme을 설정해 Feed, Native, Interstitial의 CTA 버튼 디자인을 일괄적으로 설정할 수 있습니다.

ctaBackgroundSelector, ctaTextColorSelector처럼 이름에 selector가 포함된 옵션은 Android 개발 정책에 따라 설정하는 리소스에 지정한 <selector>가 포함되어야 합니다. 자세한 내용은 여기를 참고하세요.

전체 지면의 CTA 버튼 디자인을 변경하려면 Application의 onCreate에서 다음과 같이 설정하세요.

BuzzAdTheme buzzAdTheme = new BuzzAdTheme()
    ...생략...
    .participatedIcon(R.drawable.your_participated_icon) // 광고 참여 완료 후 CTA 버튼의 아이콘
    .ctaBackgroundSelector(R.drawable.your_cta_background) // CTA 버튼의 배경 색상(state_enabled 필수 적용)
    .ctaTextColorSelector(R.color.your_cta_text_color) // CTA 버튼의 텍스트 색상
    .ctaTextSize(R.dimen.your_cta_text_size);// CTA 버튼의 텍스트 크기
BuzzAdTheme.setGlobalTheme(buzzAdTheme);

BuzzAdBenefit.init(...);

다음은 CTA 버튼의 배경 색상(ctaBackgroundSelector)을 설정하는 예시입니다.

Feed 지면의 CTA 버튼 디자인 변경하기

다음은 BuzzAdFeedTheme에서 구성 요소를 설정해 Feed의 CTA 버튼 디자인을 변경하는 예시입니다.

Interstitial 지면의 CTA 버튼 디자인 변경하기

다음은 BuzzAdInterstitialTheme에서 구성 요소를 설정해 Interstital의 CTA 버튼 디자인을 변경하는 예시입니다.

광고 참여 방식 변경하기

BuzzAd Android용 SDK는 사용자가 클릭한 광고나 콘텐츠에 설정된 URL을 Launcher로 전달하고, launch()에서는 광고를 어떤 브라우저로 보여줄지 결정합니다. 광고를 보여주는 브라우저는 외부 브라우저, 버즈빌의 인앱 브라우저, 그리고 직접 구현하는 커스텀 인앱 브라우저가 있습니다.

외부 브라우저나 버즈빌 인앱 브라우저의 경우 BuzzAd Android용 SDK의 기본 런처를 통해 둘 중 어느 브라우저를 사용할지 광고 설정에 따라 자동으로 결정됩니다. 커스텀 인앱 브라우저로 광고를 보여주려면 커스텀 런처를 등록해야 합니다.

커스텀 인앱 브라우저 사용하기

커스텀 인앱 브라우저로 광고를 보여주려면 먼저 커스텀 인앱 브라우저를 구현하고, 브라우저를 실행하기 위해 런처를 구현한 다음 BuzzAdBenefit에 설정해야 합니다.

커스텀 인앱 브라우저 구현

다음은 커스텀 인앱 브라우저를 구현하는 예시입니다. 커스텀 인앱 브라우저를 구현하려면 BuzzAdBrowser.getInstance(this).getFragment(url)을 사용해야 합니다. 그렇지 않으면 액션형 광고와 체류 리워드 광고가 제대로 동작하지 않을 수 있습니다.

다음은 커스텀 인앱 브라우저의 레이아웃을 구현하는 예시입니다.

커스텀 런처 구현

구현한 인앱 브라우저를 사용하려면 커스텀 런처를 구현해야 합니다. 커스텀 런처를 구현할 때 광고와 콘텐츠에 따라 동작을 다르게 설정할 수 있으며, 콘텐츠의 sourceUrl에는 딥 링크를 설정할 수 있습니다.

다음은 커스텀 런처를 구현하고 커스텀 인앱 브라우저에서 광고를 실행하도록 구현한 예시입니다.

커스텀 런처 설정

BuzzAdBenefit에 구현한 커스텀 런처를 설정하세요. 다음은 커스텀 런처를 설정하는 예시입니다.

Buzzvil Developer Guides

(ver 3.0.x) 8. 커스터마이징