4.3. 디자인 커스터마이징
CtaView (버튼) 커스터마이징
BuzzAd SDK 에서 기본으로 제공하는 CtaView UI 및 처리 로직을 사용하지 않고 기획에 맞게 구현할 경우 다음과 같이 진행할 수 있습니다.
4.1. 기본 설정 | Step3 에서 안내한 populateAd 에서, CtaView 부분을 아래와 같이 수정합니다.
public void populateAd(final NativeAd nativeAd) {
final NativeAdView view = findViewById(R.id.native_ad_view);
final Ad ad = nativeAd.getAd();
// create ad component
...생략...
final YourCtaView ctaView = view.findViewById(R.id.your_cta_view);
updateCtaStatus(ctaView, nativeAd);
...생략...
final List<View> clickableViews = new ArrayList<>();
clickableViews.add(customizedCtaView);
...생략...
nativeAdView.addOnNativeAdEventListener(new NativeAdView.OnNativeAdEventListener() {
...(생략)...
@Override
public void onClicked(@NonNull NativeAdView view, @NonNull NativeAd nativeAd) {
updateCtaStatus(ctaView, nativeAd);;
}
@Override
public void onParticipated(@NonNull NativeAdView view, @NonNull NativeAd nativeAd) {
updateCtaStatus(ctaView, nativeAd);
}
});
}
// 기획에 따라 수정될 수 있는 예시 코드입니다.
void updateCtaStatus(YourCtaView ctaView, NativeAd nativeAd) {
final String callToAction = nativeAd.getAd().getCallToAction();
final int reward = nativeAd.getAvailableReward();
final int totalReward = nativeAd.getAd().getReward();
final boolean participated = nativeAd.isParticipated();
final boolean isClicked = nativeAd.isClicked();
final boolean isActionType = nativeAd.getAd().isActionType();
if (isClicked && isActionType && !participated) {
ctaView.setCtaText("참여 확인 중");
ctaView.setRewardIcon(null);
ctaView.setRewardText(null);
} else {
if (totalReward > 0 && participated) {
ctaView.setRewardIcon(R.drawable.your_reward_received_icon);
ctaView.setRewardText(null);
ctaView.setCtaText("참여 완료");
} else if (reward > 0) {
ctaView.showRewardImage(R.drawable.your_reward_icon);
ctaView.setRewardText(String.format(Locale.US, "+%,d", reward));
ctaView.setCtaText(callToAction);
} else {
ctaView.showRewardImage(null);
ctaView.setRewardText(null);
ctaView.setCtaText(callToAction);
}
}
}