Flutter Admob 사용자를 위한 Adrop adapter 연결 가이드

사전 준비 사항

선호하는 에디터 또는 IDE를 준비해주세요. Adrop은 다음의 환경에서 동작합니다.

안드로이드 :
- API 레벨 23(M) 혹은 그 이상을 타겟팅
- Android 6.0 혹은 그 이상 버전을 사용
  - minSdkVersion 23
- 다음의 버전을 충족하는 Jetpack (AndroidX)을 사용
  - com.android.tools.build:gradle v7.3.0 버전 이상
    compileSdkVersion 34
- Kotlin 1.7.10 버전 이상
iOS:
- iOS 13
- Swift 5.0
다음 사항을 포함하여 운영체제에 맞게 Flutter 를 설치해주세요:
- Flutter SDK
- Supporting libraries
- 특정 플랫폼에 최적화된 소프트웨어와 SDKs

이제 이메일 또는 구글 계정을 통해 Adrop에 로그인하세요.

Adrop 서비스는 Dart packagesadrop_ads_flutter | Flutter package 라이브러리를 설치하여 이용하실 수 있습니다. 라이브러리를 설치하기 전에 프로젝트 생성과 앱 등록이 선행되어야 합니다. 아래 가이드를 순서대로 따라와주세요. 이미 프로젝트 생성과 앱 등록이 되어있다면, Adrop 설정파일 추가하기 섹션을 확인해 주세요.

1. Adrop 설정 파일 추가하기

설정 파일 준비하기 가이드를 참고해 주세요.

2. 앱에 Adrop 플러그인을 추가

adrop_ads_admob | Flutter packageDart packages

플러그인을 추가하기 전에 사전 준비 사항을 확인해 주세요.

준비 사항이 잘 확인되었다면, Flutter 프로젝트 디렉토리에서 하단의 커맨드를 실행시켜 플러그인을 설치해주세요.

flutter pub add adrop_ads_flutter
flutter pub add adrop_ads_admob
cd ios
pod install --repo-update

3. 앱에서 Adrop 초기화(Initialize)하기

마지막으로, 앱 시작 시 Adrop을 초기화 하기 위하여 프로젝트 루트 위젯에 하단 초기화 코드를 추가해 주세요.

adrop 을 초기화 하기 위하여, 프로젝트 루트에 하단 코드를 추가하여 주세요.

import 'package:adrop_ads_admob/adrop_ads_admob.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  unawaited(MobileAds.instance.initialize());
  runApp(const MyApp());
  Adrop.initialize(false);
}

광고를 노출하고자 하는 곳에 하단 코드를 참고하여 코드 조각을 넣어주세요.

import 'dart:async';
import 'dart:io';

import 'package:adrop_ads_admob/adrop_ads_admob.dart';
class MyApp extends StatefulWidget {
  const MyApp({super.key});

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final adUnitId =
      Platform.isAndroid ? 'YOUR ADMOB UNIT ID or YOUR ADMOB TEST UNIT ID' : 'ca-app-pub-3141837772329875/5227710010';

  InitializationStatus? status;
  BannerAd? _bannerAd;
  bool _isLoaded = false;

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

  Future<void> initAdmob() async {
    if (Platform.isIOS) {
      MobileAds.instance
          .updateRequestConfiguration(RequestConfiguration(testDeviceIds: ["bfd8f1928d23842fc203132fe75de135"]));
    }
  }

  void loadAd() {
    _bannerAd = BannerAd(
      adUnitId: adUnitId,
      request: const AdRequest(),
      size: AdSize.largeBanner,
      listener: BannerAdListener(
        onAdLoaded: (ad) {
          debugPrint('$ad loaded.');
          setState(() {
            _isLoaded = true;
          });
        },
        onAdFailedToLoad: (ad, err) {
          setState(() {
            _isLoaded = false;
          });
          debugPrint('BannerAd failed to load: $err');
          ad.dispose();
        },
      ),
    );

    MobileAds.instance.initialize().then((value) {
      _bannerAd?.load();
    });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Center(child: Text('Adrop for Admob mediation')),
        ),
        body: Center(
          child: Column(
            children: [
              TextButton(onPressed: loadAd, child: const Text("Load Ad")),
              const SizedBox(height: 32),
              if (_isLoaded && _bannerAd != null)
                Align(
                  alignment: Alignment.bottomCenter,
                  child: SafeArea(
                    child: SizedBox(
                      width: _bannerAd!.size.width.toDouble(),
                      height: _bannerAd!.size.height.toDouble(),
                      child: AdWidget(ad: _bannerAd!),
                    ),
                  ),
                ),
            ],
          ),
        ),
      ),
    );
  }
}

Flutter 애플리케이션을 리빌드해주세요.

flutter run

4. 적용하기

앱 수익화 담당자 혹은 광고 담당자에게 다음 설정을 요청합니다.

PreviousiOS Admob 사용자를 위한 Adrop adapter 연결 가이드 NextMetrics

Last updated 2 months ago