Reklamy wyświetlane przy otwarciu aplikacji

Wybierz platformę: Android Nowy Android iOS Unity Flutter

Reklamy wyświetlane przy otwarciu aplikacji to specjalny format reklam przeznaczony dla wydawców, którzy chcą zarabiać na ekranach wczytywania aplikacji. Reklamy wyświetlane przy otwarciu aplikacji można w każdej chwili zamknąć. Są one wyświetlane, gdy użytkownicy przełączają aplikację na pierwszy plan.

Reklamy wyświetlane przy otwarciu aplikacji automatycznie wyświetlają nieduże pole z oznaczeniem marki, dzięki czemu użytkownicy wiedzą, że znajdują się w Twojej aplikacji. Oto przykład reklamy wyświetlanej przy otwarciu aplikacji:

Wymagania wstępne

Zanim przejdziesz dalej, wykonaj te czynności:

Zawsze testuj za pomocą reklam testowych

Podczas tworzenia i testowania aplikacji używaj reklam testowych, a nie reklam produkcyjnych. Jeśli tego nie zrobisz, Twoje konto może zostać zawieszone.

Najłatwiej jest wczytywać reklamy testowe, używając naszych dedykowanych identyfikatorów jednostek reklamowych na reklamy z nagrodą na Androida i iOS:

Android

ca-app-pub-3940256099942544/9257395921

iOS

ca-app-pub-3940256099942544/5575463023

Zostały one specjalnie skonfigurowane tak, aby zwracać reklamy testowe w odpowiedzi na każde żądanie. Możesz ich używać w swoich aplikacjach podczas kodowania, testowania i debugowania. Pamiętaj tylko, aby przed opublikowaniem aplikacji zastąpić je własnym identyfikatorem jednostki reklamowej.

Implementacja

Główne kroki integracji reklam wyświetlanych przy otwarciu aplikacji:

  1. Utwórz klasę narzędziową, która wczytuje reklamę, zanim będzie trzeba ją wyświetlić.
  2. Wczytaj reklamę.
  3. Zarejestruj wywołania zwrotne i wyświetl reklamę.
  4. Subskrybuj AppStateEventNotifier.appStateStream, aby wyświetlać reklamę podczas zdarzeń przełączania na pierwszy plan.

Utwórz klasę narzędziową

Aby wczytać reklamę, utwórz nową klasę o nazwie AppOpenAdManager. Ta klasa zarządza zmienną instancji, która śledzi wczytaną reklamę i identyfikator jednostki reklamowej na każdej platformie.

import 'package:google_mobile_ads/google_mobile_ads.dart';
import 'dart:io' show Platform;

class AppOpenAdManager {
  
  String adUnitId = Platform.isAndroid
    ? 'ca-app-pub-3940256099942544/9257395921'
    : 'ca-app-pub-3940256099942544/5575463023';
  
  AppOpenAd? _appOpenAd;
  bool _isShowingAd = false;

  /// Load an AppOpenAd.
  void loadAd() {
    // We will implement this below.
  }

  /// Whether an ad is available to be shown.
  bool get isAdAvailable {
    return _appOpenAd != null;
  }
}

Wczytaj reklamę

Reklama wyświetlana przy otwarciu aplikacji musi być gotowa, zanim użytkownicy otworzą Twoją aplikację. Zaimplementuj klasę narzędziową, aby wysyłać żądania reklamy z wyprzedzeniem.

Reklamę wczytuje się za pomocą metody load w klasie AppOpenAd. Metoda wczytywania wymaga identyfikatora jednostki reklamowej, trybu orientacji, obiektu AdRequest i procedury obsługi zakończenia, która jest wywoływana, gdy wczytywanie reklamy się powiedzie lub nie. Wczytany obiekt AppOpenAd jest podawany jako parametr w procedurze obsługi zakończenia. Poniższy przykład pokazuje, jak wczytać AppOpenAd.

public class AppOpenAdManager {
  ...

  /// Load an AppOpenAd.
  void loadAd() {
    AppOpenAd.load(
      adUnitId: adUnitId,
      adRequest: AdRequest(),
      adLoadCallback: AppOpenAdLoadCallback(
        onAdLoaded: (ad) {
          _appOpenAd = ad;
        },
        onAdFailedToLoad: (error) {
          print('AppOpenAd failed to load: $error');
          // Handle the error.
        },
      ),
    );
  }
}

Wyświetl reklamę i obsługuj wywołania zwrotne pełnoekranowe

Zanim wyświetlisz reklamę, zarejestruj FullScreenContentCallback dla każdego zdarzenia reklamy, którego chcesz nasłuchiwać.

public class AppOpenAdManager {
  ...

  public void showAdIfAvailable() {
    if (!isAdAvailable) {
      print('Tried to show ad before available.');
      loadAd();
      return;
    }
    if (_isShowingAd) {
      print('Tried to show ad while already showing an ad.');
      return;
    }
    // Set the fullScreenContentCallback and show the ad.
    _appOpenAd!.fullScreenContentCallback = FullScreenContentCallback(
      onAdShowedFullScreenContent: (ad) {
        _isShowingAd = true;
        print('$ad onAdShowedFullScreenContent');
      },
      onAdFailedToShowFullScreenContent: (ad, error) {
        print('$ad onAdFailedToShowFullScreenContent: $error');
        _isShowingAd = false;
        ad.dispose();
        _appOpenAd = null;
      },
      onAdDismissedFullScreenContent: (ad) {
        print('$ad onAdDismissedFullScreenContent');
        _isShowingAd = false;
        ad.dispose();
        _appOpenAd = null;
        loadAd();
      },
    );
  }
}

Jeśli użytkownik wróci do Twojej aplikacji po tym, jak ją opuścił, klikając reklamę wyświetlaną przy otwarciu aplikacji, upewnij się, że nie zobaczy kolejnej reklamy wyświetlanej przy otwarciu aplikacji.

Nasłuchiwanie zdarzeń przełączania aplikacji na pierwszy plan

Aby otrzymywać powiadomienia o zdarzeniach przełączania aplikacji na pierwszy plan, musisz subskrybować AppStateEventNotifier.appStateStream i nasłuchiwać zdarzeń foreground.

import 'package:app_open_example/app_open_ad_manager.dart';
import 'package:google_mobile_ads/google_mobile_ads.dart';

/// Listens for app foreground events and shows app open ads.
class AppLifecycleReactor {
  final AppOpenAdManager appOpenAdManager;

  AppLifecycleReactor({required this.appOpenAdManager});

  void listenToAppStateChanges() {
    AppStateEventNotifier.startListening();
    AppStateEventNotifier.appStateStream
        .forEach((state) => _onAppStateChanged(state));
  }

  void _onAppStateChanged(AppState appState) {
    // Try to show an app open ad if the app is being resumed and
    // we're not already showing an app open ad.
    if (appState == AppState.foreground) {
      appOpenAdManager.showAdIfAvailable();
    }
  }
}

Teraz możesz dodać inicjowanie AppLifecycleReactor i zacząć nasłuchiwać zmian cyklu życia aplikacji. Na przykład na stronie głównej:

import 'package:app_open_example/app_open_ad_manager.dart';
import 'package:flutter/material.dart';
import 'package:google_mobile_ads/google_mobile_ads.dart';

import 'app_lifecycle_reactor.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  MobileAds.instance.initialize();
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'App Open Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'App Open Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

/// Example home page for an app open ad.
class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;
  late AppLifecycleReactor _appLifecycleReactor;

  @override
  void initState() {
    super.initState();
    
    AppOpenAdManager appOpenAdManager = AppOpenAdManager()..loadAd();
    _appLifecycleReactor = AppLifecycleReactor(
      appOpenAdManager: appOpenAdManager);
  }

Uwzględnij czas wygaśnięcia reklamy

Aby uniknąć wyświetlania wygasłych reklam, dodaj sygnaturę czasową do AppOpenAdManager, aby móc sprawdzić, ile czasu minęło od wczytania reklamy. Następnie użyj tej sygnatury czasowej, aby sprawdzić, czy reklama jest nadal ważna.

/// Utility class that manages loading and showing app open ads.
class AppOpenAdManager {
  ...
  
  /// Maximum duration allowed between loading and showing the ad.
  final Duration maxCacheDuration = Duration(hours: 4);

  /// Keep track of load time so we don't show an expired ad.
  DateTime? _appOpenLoadTime;
  
  ...

  /// Load an AppOpenAd.
  void loadAd() {
    AppOpenAd.load(
      adUnitId: adUnitId,
      orientation: AppOpenAd.orientationPortrait,
      adRequest: AdRequest(),
      adLoadCallback: AppOpenAdLoadCallback(
        onAdLoaded: (ad) {
          print('$ad loaded');
          _appOpenLoadTime = DateTime.now();
          _appOpenAd = ad;
        },
        onAdFailedToLoad: (error) {
          print('AppOpenAd failed to load: $error');
        },
      ),
    );
  }

  /// Shows the ad, if one exists and is not already being shown.
  ///
  /// If the previously cached ad has expired, this just loads and caches a
  /// new ad.
  void showAdIfAvailable() {
    if (!isAdAvailable) {
      print('Tried to show ad before available.');
      loadAd();
      return;
    }
    if (_isShowingAd) {
      print('Tried to show ad while already showing an ad.');
      return;
    }
    if (DateTime.now().subtract(maxCacheDuration).isAfter(_appOpenLoadTime!)) {
      print('Maximum cache duration exceeded. Loading another ad.');
      _appOpenAd!.dispose();
      _appOpenAd = null;
      loadAd();
      return;
    }
    // Set the fullScreenContentCallback and show the ad.
    _appOpenAd!.fullScreenContentCallback = FullScreenContentCallback(...);
    _appOpenAd!.show();
  }
}

Uruchomienie „na zimno” i ekrany wczytywania

W dotychczasowej dokumentacji zakładamy, że reklamy wyświetlane przy otwarciu aplikacji są wyświetlane tylko wtedy, gdy użytkownicy przełączają aplikację na pierwszy plan, gdy jest ona zawieszona w pamięci. „Uruchomienie na zimno” następuje, gdy aplikacja jest uruchamiana, ale nie była wcześniej zawieszona w pamięci.

Przykładem uruchomienia „na zimno” jest sytuacja, gdy użytkownik otwiera aplikację po raz pierwszy. W przypadku uruchomienia „na zimno” nie będziesz mieć wcześniej wczytanej reklamy wyświetlanej przy otwarciu aplikacji, która jest gotowa do natychmiastowego wyświetlenia. Opóźnienie między wysłaniem żądania reklamy a jej otrzymaniem może spowodować, że użytkownicy będą mogli przez chwilę korzystać z Twojej aplikacji, zanim zaskoczy ich reklama wyświetlana w nieodpowiednim kontekście. Należy tego unikać, ponieważ jest to złe doświadczenie użytkownika.

Preferowanym sposobem używania reklam wyświetlanych przy otwarciu aplikacji podczas uruchamiania „na zimno” jest użycie ekranu wczytywania do wczytania zasobów gry lub aplikacji i wyświetlanie reklamy tylko na ekranie wczytywania. Jeśli aplikacja została wczytana i przekierowała użytkownika do głównej zawartości, nie wyświetlaj reklamy.

Sprawdzone metody

Reklamy wyświetlane przy otwarciu aplikacji pomagają zarabiać na ekranie wczytywania aplikacji, gdy aplikacja jest uruchamiana po raz pierwszy i podczas przełączania aplikacji. Ważne jest jednak, aby pamiętać o sprawdzonych metodach, aby użytkownicy mogli cieszyć się korzystaniem z Twojej aplikacji. Najlepiej jest:

  • Pokazuj pierwszą reklamę wyświetlaną przy otwarciu aplikacji dopiero wtedy, gdy użytkownicy skorzystają już kilka razy z Twojej aplikacji.
  • Wyświetlaj reklamy wyświetlane przy otwarciu aplikacji w momentach, gdy użytkownicy czekają na wczytanie aplikacji.
  • Jeśli ekran wczytywania znajduje się pod reklamą wyświetlaną przy otwarciu aplikacji i wczyta się przed zamknięciem reklamy, możesz go zamknąć, korzystając z procedury obsługi zdarzenia onAdDismissedFullScreenContent.

Pełny przykład na GitHubie

Reklama przy otwarciu aplikacji