본문 바로가기

APP/Flutter

[플러터] Admob 보상형 광고 - 애드몹, Flutter

반응형

기본 배너 광고에 대한 글은 여기에서!!

2021.12.27 - [플러터] Admob 기본 배너 사용법 - 안드로이드, flutter, 애드몹, 광고

 

[플러터] Admob 기본 배너 사용법 - 안드로이드, flutter, 애드몹, 광고

Admob 사용법을 설명하기 앞서 이 글은 기본적인 배너 광고 사용법 및 안드로이드를 대상으로 한 설명글이다. 전면 광고에 대한 설명이 필요하다면 여기!! 2022.01.04 - [플러터] Admob 전면 광고 - 애드

zzangwoo.tistory.com


보상형 광고

  보상형 광고는 앱 내의 사용자에게 인앱 리워드를 제공하는 광고다.

 

광고 단위 등록

  보상형 광고를 사용하기 위해서는 Admob 페이지에서 광고 단위에 '리워드' 광고 형식의 광고 단위를 추가해주어야 한다.

  • 리워드 수량 부분에 본인이 원하는 수량을 입력하면 된다.
  • 예를 들어 리워드 광고를 본 후에 사용자에게 목숨 1개를 주고싶다면 리워드 수량에 1을 입력하면 된다.

 

광고 로드

await RewardedAd.load(
    // adUnitId: RewardedAd.testAdUnitId,
  adUnitId: <내 리워드 광고 UnitID>,
  request: AdRequest(),
  rewardedAdLoadCallback: RewardedAdLoadCallback(
      onAdLoaded: (ad) {
        _rewardedAd = ad;
      },
      onAdFailedToLoad: (error) {

      }
  )
);
  • _rewardedAd라는 RewardedAd 변수를 전역변수로 선언하고 onAdLoaded 메서드를 통해서 인스턴스화 시켜준다.
  • 리워드 광고에 테스트 UnitID를 넣고 테스트를 해보니 리워드 수량이 10으로 들어와서 제대로 된 테스트를 하기위해 내 리워드 광고 UnitID를 입력하고 에뮬레이터 환경에서 테스트했다.
    (에뮬레이터 환경에서는 본인 UnitID를 입력해도 테스트 광고가 호출된다.)

 

보상형 광고 이벤트

/// 보상형 광고 이벤트
/// 광고 게재, 광고 닫기와 같은 생명 주기 이벤트를 수신할 수 있다.
_rewardedAd?.fullScreenContentCallback = FullScreenContentCallback(
  onAdShowedFullScreenContent: (RewardedAd ad) =>
  /// 광고가 로드되면 호출되는 이벤트
  Logger().d('$ad onAdShowedFullScreenContent.'),
  onAdDismissedFullScreenContent: (RewardedAd ad) {
    /// 사용자가 광고를 종료하면 호출되는 이벤트
    Logger().d('$ad onAdDismissedFullScreenContent.');
    ad.dispose();
  },
  onAdFailedToShowFullScreenContent: (RewardedAd ad, AdError error) {
    Logger().d('$ad onAdFailedToShowFullScreenContent: $error');
    ad.dispose();
  },
  onAdImpression: (RewardedAd ad) => Logger().d('$ad impression occurred.'),
);
  • 광고가 종료되는 이벤트에서 RewardedAd를 dispose 해주라고 한다.

 

보상형 광고 게재

_rewardedAd?.show(onUserEarnedReward: (RewardedAd ad, RewardItem rewardItem) {
  Logger().d('${rewardItem.type} / ${rewardItem.amount}');
});

  • RewardItem 매개변수에서 Admob 페이지에서 광고 단위를 추가하면서 설정한 리워드 수량이 제대로 들어온 것을 확인할 수 있다.

 

전체코드

  테스트로 코드를 작성했기 때문에 버튼을 클릭하면 보상형 광고가 나오게 했다.

RewardedAd? _rewardedAd;

... 버튼 위젯 & 버튼 클릭 이벤트 코드는 생략 ...

_callRewardScreendAd() async {
  await RewardedAd.load(
      // adUnitId: RewardedAd.testAdUnitId,
    adUnitId: <내 광고 UnitID>,
    request: AdRequest(),
    rewardedAdLoadCallback: RewardedAdLoadCallback(
        onAdLoaded: (ad) {
          _rewardedAd = ad;
        },
        onAdFailedToLoad: (error) {

        }
    )
  );

  /// 보상형 광고 이벤트
  /// 광고 게재, 광고 닫기와 같은 생명 주기 이벤트를 수신할 수 있다.
  _rewardedAd?.fullScreenContentCallback = FullScreenContentCallback(
    onAdShowedFullScreenContent: (RewardedAd ad) =>
    /// 광고가 로드되면 호출되는 이벤트
    Logger().d('$ad onAdShowedFullScreenContent.'),
    onAdDismissedFullScreenContent: (RewardedAd ad) {
      /// 사용자가 광고를 종료하면 호출되는 이벤트
      Logger().d('$ad onAdDismissedFullScreenContent.');
      ad.dispose();
    },
    onAdFailedToShowFullScreenContent: (RewardedAd ad, AdError error) {
      Logger().d('$ad onAdFailedToShowFullScreenContent: $error');
      ad.dispose();
    },
    onAdImpression: (RewardedAd ad) => Logger().d('$ad impression occurred.'),
  );

  _rewardedAd?.show(onUserEarnedReward: (RewardedAd ad, RewardItem rewardItem) {
    Logger().d('${rewardItem.type} / ${rewardItem.amount}');

    setState(() {
      _money = rewardItem.amount.toInt();
    });
  });
}
반응형