Reklamy wyświetlane przy otwarciu aplikacji

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 zamknąć w dowolnym momencie. Są one przeznaczone do wyświetlania, gdy użytkownicy przenoszą 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

• wtyczka Flutter w wersji 0.13.6 lub nowszej,
• Wykonaj instrukcje w sekcji Pierwsze kroki. W aplikacji Flutter powinien być zaimportowany wtyczka reklam mobilnych Google dla Fluttera.

Zawsze testuj reklamy 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 wczytywać reklamy testowe, używając naszych dedykowanych identyfikatorów testowych jednostek reklamowych 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 przypadku każdego żądania. Możesz ich używać w swoich aplikacjach podczas kodowania, testowania i debugowania. Pamiętaj, aby przed opublikowaniem aplikacji zastąpić je własnymi identyfikatorami jednostek reklamowych.

Implementacja

Oto główne kroki, które należy wykonać, aby zintegrować reklamy wyświetlane przy otwarciu aplikacji:

1. Utwórz klasę pomocniczą, która wczytuje reklamę przed jej wyświetleniem.
2. Wczytaj reklamę.
3. Zarejestruj się na potrzeby wywołań zwrotnych i wyświetl reklamę.
4. Zasubskrybuj AppStateEventNotifier.appStateStream, aby wyświetlać reklamę podczas zdarzeń tła.

Tworzenie klasy pomocniczej

Aby załadować reklamę, utwórz nową klasę o nazwie AppOpenAdManager. Ta klasa zarządza zmienną instancji, która służy do śledzenia załadowanej reklamy i identyfikatora 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;
  }
}

Wczytywanie reklamy

Reklama wyświetlana przy otwarciu aplikacji musi być gotowa, zanim użytkownicy wejdą do aplikacji. Zaimplementuj klasę pomocniczą, aby wysyłać żądania reklamy przed momentem, w którym chcesz ją wyświetlić.

Ładowanie reklamy odbywa się za pomocą metody load w klasie AppOpenAd. Metoda load wymaga identyfikatora jednostki reklamowej, trybu orientacji, obiektu AdRequest oraz obsługi zakończenia, która jest wywoływana po pomyślnym lub nieudanym wczytaniu reklamy. Załadowany obiekt AppOpenAd jest przekazywany jako parametr w module 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świetlanie reklamy i obsługa wywołań zwrotnych w trybie pełnoekranowym

Przed wyświetleniem reklamy zarejestruj FullScreenContentCallback dla każdego zdarzenia reklamy, które chcesz przechwycić.

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 aplikacji po jej opuszczeniu i kliknięciu reklamy, upewnij się, że nie wyświetli się mu kolejna reklama.

Nasłuchiwanie zdarzeń dotyczących uruchamiania aplikacji na pierwszym planie

Aby otrzymywać powiadomienia o zdarzeniach aplikacji na pierwszym planie, musisz zasubskrybować zdarzenie 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ć inicjalizację AppLifecycleReactor i zacząć słuchać zmian w 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 reklam

Ważna informacja: odniesienia do reklam w wersji beta reklam wyświetlanych przy otwarciu aplikacji wygasają po 4 godzinach. Reklamy renderowane po upływie 4 godzin od żądania nie będą ważne i mogą nie wygenerować przychodów. Ten limit czasu jest dokładnie analizowany i może ulec zmianie w przyszłych wersjach beta formatu otwierania aplikacji.

Aby uniknąć wyświetlania wygasłych reklam, dodaj do nich znacznik czasu AppOpenAdManager, dzięki któremu będziesz mieć podgląd, ile czasu minęło od wczytania reklamy. Następnie na podstawie tego sygnatury czasowe sprawdź, 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();
  }
}

Uruchomienia „na zimno” i ekrany wczytywania

Dotychczasowa dokumentacja zakłada, że reklamy wyświetlane przy otwarciu aplikacji są wyświetlane tylko wtedy, gdy użytkownicy otwierają aplikację, która jest zawieszona w pamięci. „Uruchomienie na zimno” wystę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 uruchamiania „na zimno” nie będziesz mieć wcześniej załadowanej reklamy wyświetlanej przy otwarciu aplikacji, która jest gotowa do natychmiastowego wyświetlenia. Opóźnienie między wysłaniem żądania reklamy a otrzymaniem informacji zwrotnych może spowodować, że użytkownicy będą mogli krótko korzystać z aplikacji, zanim zaskoczy ich reklama niezwiązana z treścią. Należy tego unikać, ponieważ może to negatywnie wpłynąć na wrażenia użytkownika.

Najlepszym sposobem na wyświetlanie reklam przy uruchamianiu aplikacji „na zimno” jest użycie ekranu wczytywania do wczytania zasobów gry lub aplikacji i wyświetlanie reklamy tylko na tym ekranie. Jeśli aplikacja została już w pełni załadowana i przesłała użytkownika do głównej treści aplikacji, nie wyświetlaj reklamy.

Ważne: aby wczytywanie komponentów z linkiem do aplikacji było kontynuowane podczas wyświetlania reklamy wyświetlanej przy otwarciu aplikacji, zawsze wczytuj komponenty w wątku tła.

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. Należy jednak pamiętać o sprawdzonych metodach, aby użytkownicy chętnie korzystali z aplikacji. Najlepiej:

• 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 czasie, 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 metody onAdDismissedFullScreenContent.

Pełny przykład w GitHub

Reklama wyświetlana przy otwarciu aplikacji