Flutter 배너 광고

1

Unit ID 설정하기

Banner (375X80)	PUBLIC_TEST_UNIT_ID_375_80
Banner (320X50)	PUBLIC_TEST_UNIT_ID_320_50
Banner (320X100)	PUBLIC_TEST_UNIT_ID_320_100
Banner(캐러셀)	PUBLIC_TEST_UNIT_ID_CAROUSEL
Banner Video (16:9)	PUBLIC_TEST_UNIT_ID_BANNER_VIDEO_16_9
Banner Video (9:16)	PUBLIC_TEST_UNIT_ID_BANNER_VIDEO_9_16

2

배너 광고 구현하기

class YourComponentState extends State<YourComponent> {
  final unitId = "BANNER_UNIT_ID";
  bool isLoaded = false;
  AdropBannerView? bannerView;

  @override
  void initState() {
    super.initState();

    bannerView = AdropBannerView(
      unitId: unitId,
      listener: AdropBannerListener(
        onAdReceived: (unitId, creativeId) {
          setState(() {
            isLoaded = true;
          });
        },
        onAdClicked: (unitId, creativeId) {},
        onAdFailedToReceive: (unitId, error) {
          setState(() {
            isLoaded = false;
          });
        },
      ),
    );

    bannerView!.load();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        TextButton(
          onPressed: () {
            bannerView?.load();
          },
          child: const Text('Reload Ad!'),
        ),
        bannerView != null && isLoaded
            ? SizedBox(
                width: screenWidth,
                height: 80,
                child: bannerView,
              )
            : Container(),
      ],
    );
  }

  @override
  void dispose() {
    bannerView?.dispose();
    super.dispose();
  }
}

3

BackFill 광고 구현

안드로이드

• 애드컨트롤 콘솔에서 BackFill 설정이 된 유닛을 선택해 주세요.

  • 해당 유닛을 사용하면 간단하게 백필(BackFill) 광고 연동이 가능합니다.

• 아래의 adrop-ads-backfill를 import해 주세요.

implementation "io.adrop:adrop-ads-backfill:1.7.2"

iOS

• 애드컨트롤 콘솔에서 BackFill 설정이 된 유닛을 선택해 주세요.

  • 해당 유닛을 사용하면 간단하게 백필(BackFill) 광고 연동이 가능합니다.

• Podfile에 adrop-ads-backfill을 추가해 주세요.

  pod 'adrop-ads', '~> 1.7.2'
  pod 'adrop-ads-backfill', '>= 1.7.2', '< 1.8.0'

• pod install 실행

pod install --repo-update

• Info.plist에 AdMob에서 발급받은 appId를 추가해주세요.

  • Info.plist 확인하기