Dodawanie reklamy AdMob wyświetlanej przy otwarciu aplikacji do aplikacji na platformie Unity

1. Wprowadzenie

W ramach tego ćwiczenia w Codelabs dowiesz się, jak zaimplementować reklamę AdMob wyświetlaną przy otwarciu aplikacji w aplikacji na Unity.

Co utworzysz

Dzięki temu ćwiczeniu w Codelabs dowiesz się, jak wdrożyć reklamę AdMob wyświetlaną przy otwarciu aplikacji w aplikacji Unity za pomocą wtyczki do reklam mobilnych Google dla Unity.

Jeśli podczas pracy z programem masz jakieś problemy (błędy w kodzie, błędy gramatyczne, niejasne sformułowania itp.), zgłoś je, korzystając z linku Zgłoś błąd w lewym dolnym rogu ćwiczenia.

Czego się nauczysz

• Jak skonfigurować wtyczkę do reklam mobilnych Google dla Unity
• Jak wdrożyć reklamę wyświetlaną przy otwarciu aplikacji w aplikacji na Unity

Czego potrzebujesz

• Unity w wersji 2018.4 lub nowszej
• Xcode 12 lub nowsza wersja i CocoaPods (do wdrożenia w iOS)

Jak oceniasz swój poziom znajomości AdMob?

Początkujący Poziom średnio zaawansowany Biegły

2. Konfigurowanie środowiska programistycznego

Pobierz kod

Pobierz kod źródłowy Wyświetl repozytorium na GitHubie

Po pobraniu pliku ZIP rozpakuj jego zawartość. Zostanie utworzony folder o nazwie admob-appopen-unity-main.

Możesz też skopiować repozytorium GitHub za pomocą wiersza poleceń:

$ git clone https://github.com/googlecodelabs/admob-appopen-unity

Repozytorium zawiera 2 foldery:

• starter: rozpoczęcie kodu, który utworzysz w ramach tego ćwiczenia z programowania.
• complete (ukończony): kod ukończony w ramach tego ćwiczenia z programowania.

3. Skonfiguruj aplikację i jednostki reklamowe AdMob

Ponieważ Unity to wieloplatformowy pakiet SDK, musisz w AdMob dodać aplikację i jednostki reklamowe na Androida i iOS.

Uwaga: jeśli nie chcesz samodzielnie tworzyć nowej aplikacji i jednostek reklamowych, przejdź do sekcji Używanie testowej aplikacji i jednostek reklamowych AdMob, jeśli nie chcesz samodzielnie tworzyć nowej aplikacji i jednostek reklamowych.

Skonfiguruj na urządzeniu z Androidem

Aby skonfigurować aplikację na Androida, musisz dodać aplikację na Androida i utworzyć jednostki reklamowe.

Dodawanie aplikacji na Androida

1. W konsoli AdMob w menu Aplikacje kliknij DODAJ APLIKACJĘ.
2. Jako platformę wybierz Android. Gdy pojawi się pytanie Czy aplikacja jest dostępna w obsługiwanym sklepie z aplikacjami?, kliknij NIE.
3. W polu nazwy aplikacji wpisz AdMob app open ad.
4. Włączenie danych o użytkownikach nie jest konieczne do wykonania tego ćwiczenia z programowania. Zalecamy jednak, aby to zrobić, ponieważ pozwala to lepiej poznać zachowania użytkowników. Aby zakończyć proces, kliknij DODAJ.

Tworzenie jednostki reklamowej

1. W menu Aplikacje w konsoli AdMob wybierz aplikację Reklama wyświetlana przy otwarciu aplikacji AdMob (Android).
2. Kliknij menu Jednostki reklamowe.

Kliknij DODAJ JEDNOSTKĘ REKLAMOWĄ. Jako format wybierz Przy otwarciu aplikacji. W polu Nazwa jednostki reklamowej wpisz android-appopen. Aby zakończyć proces, kliknij UTWÓRZ JEDNOSTKĘ REKLAMOWĄ.

Ważne: podczas tworzenia i testowania aplikacji upewnij się, że korzystasz z reklam testowych, a nie aktywnych reklam. Jeśli tego nie zrobisz, możemy zawiesić Twoje konto. Więcej informacji o działaniu reklam testowych w pakiecie SDK do reklam mobilnych znajdziesz w artykule Reklamy testowe.

Zazwyczaj zajmuje to kilka godzin, zanim nowa jednostka reklamowa zacznie wyświetlać reklamy.

Jeśli chcesz od razu przetestować działanie reklamy, użyj identyfikatora aplikacji testowej i identyfikatora jednostki reklamowej wymienionych w tabelach identyfikatorów aplikacji na Androida lub jednostki reklamowej, a także identyfikatorów aplikacji na iOS / jednostek reklamowych na iOS.

Skonfiguruj na urządzeniu z iOS

Aby skonfigurować kampanię pod kątem iOS, musisz dodać aplikację na iOS i utworzyć jednostki reklamowe.

Dodawanie aplikacji na iOS

1. W konsoli AdMob w menu Aplikacje kliknij DODAJ APLIKACJĘ.
2. Jako platformę wybierz iOS. Gdy pojawi się pytanie Czy aplikacja jest dostępna w obsługiwanym sklepie z aplikacjami?, kliknij NIE.
3. W polu nazwy aplikacji wpisz AdMob app open ad.
4. Włączenie danych o użytkownikach nie jest konieczne do wykonania tego ćwiczenia z programowania. Zalecamy jednak, aby to zrobić, ponieważ pozwala to lepiej poznać zachowania użytkowników. Aby zakończyć proces, kliknij DODAJ.

Tworzenie jednostki reklamowej

1. W menu Aplikacje w konsoli AdMob wybierz aplikację Reklamy wbudowane AdMob (iOS).
2. Kliknij menu Jednostki reklamowe.

Kliknij DODAJ JEDNOSTKĘ REKLAMOWĄ. Jako format wybierz Przy otwarciu aplikacji. W polu Nazwa jednostki reklamowej wpisz ios-appopen. Aby zakończyć proces, kliknij UTWÓRZ JEDNOSTKĘ REKLAMOWĄ.

Ważne: podczas tworzenia i testowania aplikacji upewnij się, że korzystasz z reklam testowych, a nie aktywnych reklam. Jeśli tego nie zrobisz, możemy zawiesić Twoje konto. Więcej informacji o działaniu reklam testowych w pakiecie SDK do reklam mobilnych znajdziesz w artykule Reklamy testowe.

Zazwyczaj zajmuje to kilka godzin, zanim nowa jednostka reklamowa zacznie wyświetlać reklamy.

Jeśli chcesz od razu przetestować działanie reklamy, użyj identyfikatora aplikacji testowej i identyfikatorów jednostki reklamowej wymienionych w tabeli poniżej.

Opcjonalnie: używanie testowej aplikacji i jednostek reklamowych AdMob

Jeśli chcesz wykonać ćwiczenia w Codelabs, zamiast samodzielnie tworzyć nową aplikację i jednostki reklamowe, możesz użyć testowego identyfikatora aplikacji AdMob i identyfikatorów jednostek reklamowych wymienionych w tabelach poniżej.

Identyfikator aplikacji na Androida/identyfikator jednostki reklamowej

Element	identyfikator aplikacji/identyfikator jednostki reklamowej
Identyfikator aplikacji AdMob	ca-app-pub-3940256099942544~3347511713
Identyfikator jednostki reklamowej	ca-app-pub-3940256099942544/3419835294

Identyfikator aplikacji na iOS lub identyfikator jednostki reklamowej

Element	identyfikator aplikacji/identyfikator jednostki reklamowej
Identyfikator aplikacji AdMob	ca-app-pub-3940256099942544~1458002511
Identyfikator jednostki reklamowej	ca-app-pub-3940256099942544/5662855259

Więcej informacji o reklamach testowych znajdziesz w artykułach na temat reklam testowych na Androida i reklam testowych na iOS dla deweloperów.

4. Dodaj wtyczkę do reklam mobilnych Google dla Unity

Zintegrowanie wtyczki do reklam mobilnych Google dla Unity to pierwszy krok na drodze do wyświetlania reklam AdMob i uzyskania przychodów.

Pobierz wtyczkę do reklam mobilnych dla Unity

Wtyczka Unity do reklam mobilnych Google ułatwia programistom Unity wyświetlanie reklam mobilnych Google w aplikacjach na Androida i iOS. Wtyczka udostępnia interfejs C# do żądania reklam, który jest używany przez skrypty C# w projekcie Unity.

Użyj linku poniżej, aby pobrać pakiet Unity z wtyczką.

Pobierz wtyczkę

Otwórz projekt początkowy

1. Uruchom Unity Hub.
2. Na karcie Projekty kliknij przycisk DODAJ.
3. Przejdź do folderu, do którego został wyodrębniony pobrany kod w kroku Skonfiguruj środowisko programistyczne.
4. Otwórz folder starter.
5. Na liście projektów zobaczysz projekt starter. Kliknij projekt, aby otworzyć go w edytorze Unity.

Importowanie wtyczki do reklam mobilnych Unity

1. W edytorze Unity wybierz Zasoby > Importuj pakiet > pakiet niestandardowy w menu.
2. Wybierz plik GoogleMobileAds-{VERSION}.unitypackage pobrany w poprzednim kroku.
3. Upewnij się, że wszystkie pliki są zaznaczone, i kliknij Importuj.

Ustawianie identyfikatora aplikacji AdMob

1. W edytorze Unity wybierz Zasoby > Reklamy mobilne Google > Ustawienia w menu.
2. W każdym polu wpisz identyfikator aplikacji AdMob na Androida i iOS. Jeśli nie chcesz samodzielnie tworzyć nowej aplikacji i jednostek reklamowych, wpisz identyfikator testowej aplikacji AdMob w ten sposób:

Ważne: jeśli nie podasz identyfikatora aplikacji AdMob, spowoduje to jej awarię.

5. Utwórz klasę narzędzia

Utwórz nową klasę o nazwie AppOpenAdManager w folderze Scripts. Ta klasa zarządza zmienną instancji, aby śledzić wczytaną reklamę i identyfikator jednostki reklamowej dla każdej platformy.

AppOpenAdManager.cs

using System;
using GoogleMobileAds.Api;
using UnityEngine;

public class AppOpenAdManager
{
#if UNITY_ANDROID
    // Test ad unit ID: ca-app-pub-3940256099942544/3419835294
    private const string AD_UNIT_ID = "<YOUR_ANDROID_APPOPEN_AD_UNIT_ID>";
#elif UNITY_IOS
    // Test ad unit ID: ca-app-pub-3940256099942544/5662855259
    private const string AD_UNIT_ID = "<YOUR_IOS_APPOPEN_AD_UNIT_ID>";
#else
    private const string AD_UNIT_ID = "unexpected_platform";
#endif

    private static AppOpenAdManager instance;

    private AppOpenAd ad;

    private bool isShowingAd = false;

    public static AppOpenAdManager Instance
    {
        get
        {
            if (instance == null)
            {
                instance = new AppOpenAdManager();
            }

            return instance;
        }
    }

    private bool IsAdAvailable
    {
        get
        {
            return ad != null;
        }
    }

    public void LoadAd()
    {
        // TODO: Load an app open ad.
    }
}

Wczytywanie reklamy

Reklamę można wczytać za pomocą statycznej metody AppOpenAd.LoadAd(). Metoda wczytywania wymaga identyfikatora jednostki reklamowej, trybu ScreenOrientation, obiektu AdRequest i modułu obsługi uzupełniania, który jest wywoływany w przypadku udanego lub nieudanego wczytywania reklamy.

Wczytany obiekt AppOpenAd jest udostępniany jako parametr w module obsługi uzupełniania. Zaimplementuj metodę LoadAd() w ten sposób.

AppOpenAdManager.cs

public class AppOpenAdManager
{
    ...

    public void LoadAd()
    {
        AdRequest request = new AdRequest.Builder().Build();

        // Load an app open ad for portrait orientation
        AppOpenAd.LoadAd(AD_UNIT_ID, ScreenOrientation.Portrait, request, ((appOpenAd, error) =>
        {
            if (error != null)
            {
                // Handle the error.
                Debug.LogFormat("Failed to load the ad. (reason: {0})", error.LoadAdError.GetMessage());
                return;
            }

            // App open ad is loaded.
            ad = appOpenAd;
        }));
    }
}

Wyświetl reklamę

Przed wyświetleniem reklamy zarejestruj się w przypadku każdego modułu obsługi zdarzeń, aby nasłuchiwać poszczególnych zdarzeń.

AppOpenAdManager.cs

public class AppOpenAdManager
{
    ...

    public void ShowAdIfAvailable()
    {
        if (!IsAdAvailable || isShowingAd)
        {
            return;
        }

        ad.OnAdDidDismissFullScreenContent += HandleAdDidDismissFullScreenContent;
        ad.OnAdFailedToPresentFullScreenContent += HandleAdFailedToPresentFullScreenContent;
        ad.OnAdDidPresentFullScreenContent += HandleAdDidPresentFullScreenContent;
        ad.OnAdDidRecordImpression += HandleAdDidRecordImpression;
        ad.OnPaidEvent += HandlePaidEvent;

        ad.Show();
    }

    private void HandleAdDidDismissFullScreenContent(object sender, EventArgs args)
    {
        Debug.Log("Closed app open ad");
        // Set the ad to null to indicate that AppOpenAdManager no longer has another ad to show.
        ad = null;
        isShowingAd = false;
        LoadAd();
    }

    private void HandleAdFailedToPresentFullScreenContent(object sender, AdErrorEventArgs args)
    {
        Debug.LogFormat("Failed to present the ad (reason: {0})", args.AdError.GetMessage());
        // Set the ad to null to indicate that AppOpenAdManager no longer has another ad to show.
        ad = null;
        LoadAd();
    }

    private void HandleAdDidPresentFullScreenContent(object sender, EventArgs args)
    {
        Debug.Log("Displayed app open ad");
        isShowingAd = true;
    }

    private void HandleAdDidRecordImpression(object sender, EventArgs args)
    {
        Debug.Log("Recorded ad impression");
    }

    private void HandlePaidEvent(object sender, AdValueEventArgs args)
    {
        Debug.LogFormat("Received paid event. (currency: {0}, value: {1}",
                args.AdValue.CurrencyCode, args.AdValue.Value);
    }
}

Weź pod uwagę czas wygaśnięcia reklamy

Odniesienia do reklam w aplikacji wyświetlanej przy otwarciu aplikacji przekroczą limit czasu po 4 godzinach. Reklamy renderowane po upływie 4 godzin od żądania staną się nieprawidłowe i mogą nie generować przychodów.

Aby nie wyświetlać nieaktualnej reklamy, zmień właściwość IsAdAvailable na AppOpenAdManager, która sprawdza, ile czasu minęło od wczytania reklamy. Następnie użyj tej metody, aby sprawdzić, czy reklama jest nadal prawidłowa.

AppOpenAdManager.cs

public class AppOpenAdManager
{
    ...

    // TODO: Add loadTime field
    private DateTime loadTime;

    private bool IsAdAvailable
    {
        get
        {
            // TODO: Consider ad expiration
            return ad != null && (System.DateTime.UtcNow - loadTime).TotalHours < 4;
        }
    }

    public void LoadAd()
    {
        if (IsAdAvailable)
        {
            return;
        }

        AdRequest request = new AdRequest.Builder().Build();
        AppOpenAd.LoadAd(AD_UNIT_ID, ScreenOrientation.Portrait, request, ((appOpenAd, error) =>
        {
            if (error != null)
            {
                Debug.LogFormat("Failed to load the ad. (reason: {0})", error.LoadAdError.GetMessage());
                return;
            }

            ad = appOpenAd;
            Debug.Log("App open ad loaded");

            // TODO: Keep track of time when the ad is loaded.
            loadTime = DateTime.UtcNow;
        }));
    }
}

6. Zaktualizuj scenę, aby wczytać lub wyświetlić reklamę

Zaktualizuj metodę Start() w klasie MainScene, aby w momencie rozpoczęcia sceny ładowała się reklama wyświetlana przy otwarciu aplikacji.

Aby otrzymywać powiadomienia o zdarzeniach działania aplikacji na pierwszym planie, zalecamy nasłuchiwanie zdarzenia AppStateEventNotifier singleton. Gdy zaimplementujesz delegata AppStateEventNotifier.AppStateChanged, Twoja aplikacja będzie otrzymywać alerty o zdarzeniach uruchomienia i zdarzeń na pierwszym planie, dzięki czemu będzie mogła wyświetlać reklamę.

MainScene.cs

using GoogleMobileAds.Api;
using GoogleMobileAds.Common;
using UnityEngine;

public class MainScene : MonoBehaviour
{
    public void Start()
    {
        // TODO: Request an app open ad.
        MobileAds.Initialize((initStatus) =>
        {
            AppOpenAdManager.Instance.LoadAd();
            AppStateEventNotifier.AppStateChanged += OnAppStateChanged;
        });
    }

    public void OnAppStateChanged(AppState state)
    {
        if (state == AppState.Foreground)
        {
            // TODO: Show an app open ad if available.
            AppOpenAdManager.Instance.ShowAdIfAvailable();
        }
    }
}

Ważne: zalecamy stosowanie AppStateEventNotifier, ponieważ gdy aplikacja wyświetla reklamę pełnoekranową, OnApplicationPause będzie podawać fałszywy sygnał pierwszego planu i w tle.

Uwaga: reklamy wyświetlane przy otwarciu aplikacji mogą się wyświetlać, gdy użytkownik wróci do aplikacji z innej aplikacji (np. aby wybrać zdjęcie z galerii), ponieważ uważa się je również za „przełącznik aplikacji” . Zalecamy wyłączenie lub włączenie reklam wyświetlanych przy otwarciu aplikacji, aby nie wyświetlały się w centrum ważnego wzorca przeglądania.

Znakomicie. Skompiluj i uruchom projekt na urządzeniu lub w emulatorze. Po uruchomieniu aplikacji poczekaj kilka sekund, aż reklama zostanie w pełni załadowana.

Po tym czasie, gdy wrócisz do aplikacji z innych aplikacji lub ekranu głównego, reklama wyświetlana przy otwarciu aplikacji będzie wyglądać tak jak poniżej.

7. Wszystko gotowe

Ćwiczenie z programowania zostało ukończone. Ukończony kod tego ćwiczenia z programowania znajdziesz w folderze complete.