본문 바로가기

APP/Flutter

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

반응형

  Admob 사용법을 설명하기 앞서 이 글은 기본적인 배너 광고 사용법 및 안드로이드를 대상으로 한 설명글이다.

전면 광고에 대한 설명이 필요하다면 여기!!

2022.01.04 - [플러터] Admob 전면 광고 - 애드몹, Flutter

 

[플러터] Admob 전면 광고 - 애드몹, Flutter

기본 배너 광고에 대한 글은 여기에서!! 2021.12.27 - [플러터] Admob 기본 배너 사용법 - 안드로이드, flutter, 애드몹, 광고 앱 추가를 클릭하여 앱을 추가해준다. 광" data-og-host="zzangwoo.tistory.com" dat..

zzangwoo.tistory.com


Admob 설정

앱 추가

  • Admob 홈페이지에서 앱 -> 앱 추가를 클릭하여 앱을 추가해준다.

 

 

광고 단위 추가

  • Admob에서 광고를 설정하는 날짜에 따라 위의 캡쳐 화면이 다를 수도 있다.
  • 앱 -> 광고 단위에서도 게재할 광고 단위를 만들 수 있다.

 

  • 테스트로 만들어 볼 배너 광고 단위를 선택해준다.

 

  • 1번 앱 ID는 AndroidManifest.xml에서 사용하게 될 ID이다.
  • 2번 광고 단위 ID는 앱 내에서 보여줄 광고의 ID이다. 테스트 하거나 개발환경인 경우 Admob에서 제공하는 테스트 광고 단위 ID를 사용해야 한다.
  • 배터 광고의 테스트 광고 단위 ID : ca-app-pub-3940256099942544/6300978111
  • 에뮬레이터로 개발하게 되면 본인 광고 단위 ID를 사용하더라도 테스트 광고가 나오기 때문에 에뮬레이터 환경은 테스트 광고 단위 ID를 입력해주지 않아도 될 듯 하다.

패키지 선택

  처음에 Admob을 사용하기 위해서 'admob_flutter'라는 패키지를 사용했는데 플러터 버전을 업그레이드 시키면서 해당 패키지에서 deprecated 에러가 발생하여 사용하기 불안한 감이 있었다.

  좀 더 찾아보니깐 google.dev가 Publisher인 'google_mobile_ads'라는 패키지가 있어서 해당 패키지를 사용하기로 했다.

 

패키지 설치

  2021년 12월 24일 기준 'google_mobile_ads v1.0.1' 패키지를 설치해서 사용했다.

 

Admob 사용하기

기본 요건

  • Flutter 1.22.0 이상
  • Android
    • Android Studio 3.2 이상
    • Android API 레벨 19 이상 타겟팅
    • compileSdkVersion을 28이상으로 설정

 

AndroidMainifest.xml 설정

  • value 부분에 광고 단위를 만들면서 본인 앱 ID를 입력해주면 된다.
  • 앱 ID를 입력하지 않으면 앱이 시작될 때 비정상 종료된다.

 

모바일 광고 SDK 초기화

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  MobileAds.instance.initialize();      // 모바일 광고 SDK 초기화
  
  runApp(const MyApp());
}
  • 광고를 로드하기 전에 Future를 반환하는 'MobildAds.instance.initialize()'를 호출하여 앱에서 모바일 광고 SDK를 초기화시킨다.
  • 이 작업은 한 번만 처리하면 되고, 가장 좋은 시점은 앱을 실행하기 직전이기 때문에 앱 실행시 첫 진입지점인 main.dart에서 초기화 시켜주었다.

 

배너 광고 테스트

주의사항

  앱을 개발하고 테스트할 때에는 본인의 광고 단위 ID가 아닌 테스트 광고 단위 ID를 사용해야 한다. 그렇지 않으면 계정이 정지될 수 있다.

 

광고 인스턴스화

final BannerAd _banner = BannerAd(
  adUnitId: 'ca-app-pub-3940256099942544/6300978111',
  size: AdSize.banner,
  request: AdRequest(),
  listener: BannerAdListener(
    // Called when an ad is successfully received.
    onAdLoaded: (Ad ad) => print('Ad loaded.'),
    // Called when an ad request failed.
    onAdFailedToLoad: (Ad ad, LoadAdError error) {
      // Dispose the ad here to free resources.
      ad.dispose();
      print('Ad failed to load: $error');
    },
    // Called when an ad opens an overlay that covers the screen.
    onAdOpened: (Ad ad) => print('Ad opened.'),
    // Called when an ad removes an overlay that covers the screen.
    onAdClosed: (Ad ad) => print('Ad closed.'),
    // Called when an impression occurs on the ad.
    onAdImpression: (Ad ad) => print('Ad impression.'),
  )
)..load();
  • 배너 광고를 만들기 위해서는 BannerAd 객체에 adUnitID(광고 단위 ID), AdSize, AdRequest, BannerAdListener를 채워 넣어줘야 한다.
  • 광고 생명주기를 관리하고 싶으면 BannerAdListener에 본인이 사용하고 싶은 이벤트에 코드를 작성하면 된다.
  • 다음과 같이 광고 객체를 load 해줘야 사용가능하다.

 

배너 크기

 

배너 광고 사용

Container(
  alignment: Alignment.center,
  child: AdWidget(ad: _banner,),
  width: _banner.size.width.toDouble(),
  height: _banner.size.height.toDouble(),
)
  • AdWidget 객체에 만들어놓은 배너 광고 객체를 넣어서 위젯에 넣어주면 된다.

 

결과 (기본 배너 광고)

 

결과 (여러 배너 광고)


오류

minSdkVersion 16 cannot be smaller than version 19 declared in library [:google_mobile_ads]

  • android - app - build.gradle 에서 'minSdkVersion'을 19로 변경해준다.

 

The minCompileSdk (31) specified in a dependency’s AAR metadata

 

  • andoird - app - build.gradle 에서 'compileSdkVersion'을 31로 변경해준다.

 

The binary version of its metadata is 1.5.1, expected version is 1.1.15.

  • android - build.gradle 에서 코틀린 버전을 1.4.32로 변경해준다.
  • 2021년 12월 24일 기준으로 1.4.32 버전으로 변경해주었을 때 오류없이 해결이 됐었는데 추후에 날짜가 지나면 해당 버전으로 오류가 해결되지 않을 수도 있다.
반응형