(ver 3.3.x) 3.3. 디자인 커스터마이징

Owned by Olivia Kim
May 09, 2022
2 min read

목차

개요

여기에서는 BuzzAd Android용 SDK에서 제공하는 UI의 디자인을 변경하기 위한 방법을 설명합니다.

추가적인 디자인 변경을 원하는 경우, 고급 설정 토픽을 참고해 UI를 직접 구현하세요.

탭 디자인 변경하기

Feed 탭이 활성화되어 있는 경우, 탭의 UI 디자인을 변경할 수 있습니다.
이때 tabTextColorSelector처럼 이름에 selector가 포함된 옵션은 Android 개발 정책에 따라 설정하는 리소스에 <selector>가 포함되어야 합니다. 자세한 내용은 여기를 참고하세요.

탭 UI 디자인을 변경하려면 다음의 예시를 참고하세요.

// BuzzAdFeedTheme 설정을 통해 색상 등 UI 구성 요소를 변경할 수 있습니다. final BuzzAdFeedTheme buzzAdFeedTheme = BuzzAdFeedTheme.getDefault() ...생략... .tabTextColorSelector(R.color.YOUR_TEXT_COLOR) // 탭의 텍스트 색상(state_selected 필수 적용) .tabBackgroundColor(android.R.color.YOUR_BACKGROUND_COLOR) // 탭의 배경 색상 .tabIndicatorColor(R.color.YOUR_INDICATOR_COLOR); // 탭이 선택되었을때 하단에 표시되는 줄 색상 BuzzAdFeed.setDefaultTheme(buzzAdFeedTheme);

필터 디자인 변경하기

Feed 필터가 활성화되어 있는 경우, 필터의 UI 디자인을 변경할 수 있습니다.
이때 filterTextColorSelector, filterBackgroundColorSelector처럼 이름에 selector가 포함된 옵션은 Android 개발 정책에 따라 설정하는 리소스에 지정한 <selector>가 포함되어야 합니다. Android 개발 정책에 대한 자세한 내용은 여기를 참고하세요.

필터 UI 디자인을 변경하려면 다음의 예시를 참고하세요.

final BuzzAdFeedTheme buzzAdFeedTheme = BuzzAdFeedTheme.getDefault() ...생략... .filterTextColorSelector(R.color.YOUR_TEXT_COLOR) // 필터의 텍스트 색상(state_selected 필수 적용) .filterBackgroundColorSelector(android.R.color.YOUR_BACKGROUND_COLOR); // 필터의 배경 색상 BuzzAdFeed.setDefaultTheme(buzzAdFeedTheme);

CTA 버튼 디자인 변경하기

CTA 버튼의 디자인을 변경하려면 CTA 버튼 커스터마이징하기 토픽을 참고하세요.