[플러터] 광고 통합 테스트 [배너, 전면, 리워드]

선행과정

전면 광고를 넣기 전에 환경설정을 완료해야 한다.

[플러터] 앱 광고 환경설정

 

광고 테스트 파일 구조

파일 구조는 다음과 같다.

/lib
  /ads
    banner_ad_manager.dart //배너 광고 관리 파일
    interstitial_ad_manager.dart //전면 광고 관리 파일
    rewarded_ad_manager.dart //리워드 광고 관리 파일
  /screens
    banner_ad_screen.dart // 배너 광고 스크린
    interstitial_ad_screen.dart // 전면 광고 스크린
    rewarded_ad_screen.dart // 리워드 광고 스크린
  main.dart

 

전면 광고 관련 글

[플러터] 전면 광고 추가하기

리워드 광고 관련 글

[플러터] 리워드 광고 추가하기

배너 광고 관련 글

[플러터] 배너 광고 추가하기

main 문 - main.dart

하단 바텀 내비게이션 바를 이동하여 각각의 광고를 확인할 수 있다.

첫번째 옵션은 배너 광고

두번째 옵션은 전면 광고

세번째 옵션은 리워드 광고이다.

import 'package:flutter/material.dart';
import 'screens/banner_ad_screen.dart';
import 'screens/interstitial_ad_screen.dart';
import 'screens/rewarded_ad_screen.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  int _currentIndex = 0;
  final List<Widget> _screens = [
    BannerAdScreen(),
    InterstitialAdScreen(),
    RewardedAdScreen(),
  ];

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: _screens[_currentIndex],
        bottomNavigationBar: BottomNavigationBar(
          currentIndex: _currentIndex,
          onTap: (index) {
            setState(() {
              _currentIndex = index;
            });
          },
          items: [
            BottomNavigationBarItem(
              icon: Icon(Icons.view_module),
              label: '배너 광고',
            ),
            BottomNavigationBarItem(
              icon: Icon(Icons.fullscreen),
              label: '전면 광고',
            ),
            BottomNavigationBarItem(
              icon: Icon(Icons.card_giftcard),
              label: '리워드 광고',
            ),
          ],
        ),
      ),
    );
  }
}

 

실행화면

배너 광고

전면 광고

리워드 광고