إضافة إعلان على شاشة فتح تطبيق AdMob إلى تطبيق Unity

1. مقدمة

في هذا الدرس التطبيقي حول الترميز، يمكنك تنفيذ إعلان على شاشة فتح التطبيق على AdMob في تطبيق Unity.

ما الذي ستقوم ببنائه

يرشدك هذا الدرس التطبيقي حول الترميز خلال تنفيذ إعلان على شاشة فتح التطبيق في AdMob في أحد تطبيقات Unity باستخدام مكوّن Unity الإضافي لإعلانات Google على الأجهزة الجوّالة.

6338548c3f73e7cf.gif

إذا واجهت أيّ مشاكل (أخطاء في الرموز أو أخطاء نحوية أو صياغة غير واضحة أو غير ذلك) أثناء العمل على هذا الدرس التطبيقي حول الترميز، يمكنك الإبلاغ عن المشكلة باستخدام رابط الإبلاغ عن خطأ في أسفل يمين القسم المتعلّق بالترميز.

المعلومات التي ستطّلع عليها

  • كيفية ضبط مكوّن Unity الإضافي لإعلانات Google على الأجهزة الجوّالة
  • كيفية تنفيذ إعلان على شاشة فتح التطبيق في تطبيق Unity

المتطلبات

  • Unity 2018.4 أو إصدار أحدث
  • Xcode 12 أو إصدار أحدث وCocoaPods (للنشر على نظام التشغيل iOS)

ما هو تقييمك لمستوى خبرتك في استخدام AdMob؟

حديث متوسط بارع

2. إعداد بيئة التطوير

تنزيل الرمز

بعد تنزيل ملف ZIP، يمكنك استخراج محتواه. سيكون لديك مجلد باسم "admob-appopen-unity-main".

بدلاً من ذلك، يمكنك استنساخ مستودع GitHub من سطر الأوامر:

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

يحتوي المستودع على مجلدين:

  • android_studio_folder.png إجراء التفعيل: بدء الرمز البرمجي الذي ستنشئه في هذا الدرس التطبيقي حول الترميز
  • android_studio_folder.png مكتمل: رمز مكتمل لهذا الدرس التطبيقي حول الترميز.

3- إعداد تطبيق AdMob ووحداته الإعلانية

بما أنّ Unity عبارة عن حزمة تطوير برامج (SDK) متعدّدة الأنظمة الأساسية، عليك إضافة تطبيق ووحدات إعلانية في AdMob.

الإعداد على جهاز Android

لإجراء عملية الإعداد لنظام التشغيل Android، عليك إضافة تطبيق Android وإنشاء وحدات إعلانية.

إضافة تطبيق Android

  1. في وحدة تحكُّم AdMob، انقر على إضافة تطبيق من قائمة التطبيقات.
  2. اختَر Android كنظام أساسي. عند سؤالك عن هل التطبيق مُدرج في متجر تطبيقات معتمَد؟، انقر على لا.
  3. أدخِل "AdMob app open ad" في حقل "اسم التطبيق".
  4. ليس من الضروري تفعيل مقاييس سلوك المستخدمين لإكمال هذا الدرس التطبيقي حول الترميز. ومع ذلك، ننصحك باتّخاذ هذا الإجراء لأنّه يتيح لك فهم سلوك المستخدِم بمزيد من التفاصيل. انقر على إضافة لإكمال العملية.

إنشاء وحدة إعلانية

  1. اختَر تطبيق إعلان على شاشة فتح تطبيق AdMob (لنظام التشغيل Android) من قائمة التطبيقات في وحدة تحكُّم AdMob.
  2. انقر على قائمة الوحدات الإعلانية.

  1. انقر على إضافة وحدة إعلانية.
  2. اختَر فتح التطبيق كتنسيق.
  3. أدخِل android-appopen في حقل اسم الوحدة الإعلانية.
  4. انقر على إنشاء وحدة إعلانية لإكمال هذه العملية.

عادةً ما تستغرِق الوحدة الإعلانية الجديدة بضع ساعات لتتمكّن من عرض الإعلانات.

إذا كنت تريد اختبار سلوك الإعلان على الفور، استخدِم رقم تعريف التطبيق التجريبي وأرقام تعريف الوحدات الإعلانية المُدرجة في جدولَي رقم تعريف تطبيق Android/رقم تعريف الوحدة الإعلانية، ورقم تعريف الوحدة الإعلانية لتطبيق iOS.

الإعداد على جهاز iOS

لإكمال عملية الإعداد لنظام التشغيل iOS، عليك إضافة تطبيق iOS وإنشاء وحدات إعلانية.

إضافة تطبيق iOS

  1. في وحدة تحكُّم AdMob، انقر على إضافة تطبيق من قائمة التطبيقات.
  2. اختَر iOS كنظام أساسي. عند سؤالك عن هل التطبيق مُدرج في متجر تطبيقات معتمَد؟، انقر على لا.
  3. أدخِل "AdMob app open ad" في حقل "اسم التطبيق".
  4. ليس من الضروري تفعيل مقاييس سلوك المستخدمين لإكمال هذا الدرس التطبيقي حول الترميز. ومع ذلك، ننصحك باتّخاذ هذا الإجراء لأنّه يتيح لك فهم سلوك المستخدِم بمزيد من التفاصيل. انقر على إضافة لإكمال العملية.

إنشاء وحدة إعلانية

  1. اختَر تطبيق إعلانات AdMob المضمّنة (iOS) من قائمة التطبيقات في وحدة تحكُّم AdMob.
  2. انقر على قائمة الوحدات الإعلانية.

  1. انقر على إضافة وحدة إعلانية.
  2. اختَر فتح التطبيق كتنسيق.
  3. أدخِل ios-appopen في حقل اسم الوحدة الإعلانية.
  4. انقر على إنشاء وحدة إعلانية لإكمال هذه العملية.

عادةً ما تستغرِق الوحدة الإعلانية الجديدة بضع ساعات لتتمكّن من عرض الإعلانات.

إذا كنت تريد اختبار سلوك الإعلان على الفور، استخدِم رقم تعريف التطبيق التجريبي وأرقام تعريف الوحدة الإعلانية المُدرَجة في الجدول التالي.

اختياري: استخدام تطبيق AdMob التجريبي والوحدات الإعلانية التجريبية

إذا كنت تريد اتّباع الدرس التطبيقي حول الترميز بدلاً من إنشاء تطبيق ووحدات إعلانية جديدة بنفسك، يمكنك استخدام رقم تعريف تطبيق AdMob وأرقام تعريف الوحدات الإعلانية التجريبية المُدرَجة في الجداول التالية.

رقم تعريف تطبيق Android/رقم تعريف الوحدة الإعلانية

السلعة

رقم تعريف التطبيق/رقم تعريف الوحدة الإعلانية

رقم تعريف تطبيق AdMob

ca-app-pub-3940256099942544~3347511713

رقم تعريف الوحدة الإعلانية

ca-app-pub-3940256099942544/3419835294

رقم تعريف تطبيق iOS/رقم تعريف الوحدة الإعلانية

السلعة

رقم تعريف التطبيق/رقم تعريف الوحدة الإعلانية

رقم تعريف تطبيق AdMob

ca-app-pub-3940256099942544~1458002511

رقم تعريف الوحدة الإعلانية

ca-app-pub-3940256099942544/5662855259

لمزيد من المعلومات عن الإعلانات الاختبارية، اطّلِع على مستندات مطوّري الإعلانات الاختبارية على Android وإعلانات اختبار iOS.

4. إضافة مكوّن Unity الإضافي لإعلانات Google على الأجهزة الجوّالة

يُعدّ دمج المكوّن الإضافي لبرنامج Unity لإعلانات Google على الأجهزة الجوّالة الخطوة الأولى نحو عرض إعلانات AdMob وتحقيق الأرباح.

تنزيل مكوّن Unity الإضافي لإعلانات الأجهزة الجوّالة

يعمل المكوّن الإضافي Unity من إعلانات Google على الأجهزة الجوّالة على تفعيل مطوّري Unity من عرض "إعلانات Google على الأجهزة الجوّالة" بسهولة على تطبيقات Android وiOS. يوفر المكوّن الإضافي واجهة C# لطلب الإعلانات التي تستخدمها نصوص C# البرمجية في مشروع Unity.

استخدِم الرابط أدناه لتنزيل حزمة Unity الخاصة بالمكوّن الإضافي.

فتح مشروع التفعيل

  1. شغِّل Unity Hub.
  2. في علامة التبويب المشاريع، انقر على الزر إضافة.
  3. انتقِل إلى المجلد الذي استخرجت فيه الرمز الذي تم تنزيله في خطوة "إعداد بيئة التطوير".
  4. افتح مجلد المبتدئ.
  5. سيظهر لك مشروع المبتدئ في قائمة المشاريع. انقر على المشروع لفتحه في Unity Editor.

استيراد مكوّن Unity الإضافي لإعلانات الأجهزة الجوّالة

  1. في محرِّر Unity، اختَر مواد العرض >. استيراد الحزمة > حزمة مخصصة من القائمة.
  2. اختَر ملفات GoogleMobileAds-{VERSION}.unitypackage التي نزّلتها في الخطوة السابقة.
  3. تأكَّد من اختيار كل الملفات وانقر على استيراد.

إعداد رقم تعريف تطبيق AdMob

  1. في Unity Editor، اختَر مواد العرض >. إعلانات Google للأجهزة الجوّالة > الإعدادات من القائمة.
  2. أدخِل رقم تعريف تطبيق AdMob لنظامَي التشغيل Android وiOS في كل حقل. إذا كنت تريد اتّباع الدرس التطبيقي حول الترميز بدلاً من إنشاء تطبيق ووحدات إعلانية جديدة بنفسك، أدخِل رقم تعريف تطبيق AdMob التجريبي على النحو التالي.

8890521e199b1090.png

5- إنشاء فئة خدمات

أنشئ فئة جديدة باسم AppOpenAdManager ضمن مجلد النصوص البرمجية. تدير هذه الفئة متغيّرًا مثاليًا لتتبُّع الإعلان الذي تم تحميله ورقم تعريف الوحدة الإعلانية لكل منصّة.

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.
    }
}

تحميل إعلان

يتم تحميل الإعلان باستخدام طريقة AppOpenAd.LoadAd() الثابتة. تتطلب طريقة التحميل رقم تعريف وحدة إعلانية ووضع ScreenOrientation وكائن AdRequest ومعالِج إكمال، ويتم استدعاءه عند نجاح تحميل الإعلان أو تعذُّر تحميله.

يتوفّر كائن AppOpenAd الذي تم تحميله كمَعلمة في معالِج الإكمال. نفِّذ طريقة LoadAd() على النحو التالي.

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;
        }));
    }
}

عرض الإعلان

قبل عرض الإعلان، سجّل لكل معالج أحداث للاستماع إلى كل حدث من أحداث الإعلانات.

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);
    }
}

التفكير في انتهاء صلاحية الإعلان

ستنتهي مهلة مَراجع الإعلانات في التطبيق المفتوح بعد أربع ساعات. يُرجى العلم أنّ الإعلانات التي يتم عرضها بعد أكثر من أربع ساعات من وقت الطلب لن تكون صالحة وقد لا تحقّق أي أرباح.

لضمان عدم عرض إعلان منتهي الصلاحية، عدِّل السمة IsAdAvailable إلى AppOpenAdManager التي تتحقّق من المدة المنقضية منذ تحميل إعلانك. وبعد ذلك، استخدِم هذه الطريقة للتحقق مما إذا كان الإعلان لا يزال صالحًا.

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- تعديل المشهد لتحميل أو عرض الإعلان

عدِّل طريقة Start() في الصف MainScene لتحميل إعلان على شاشة فتح التطبيق عند بدء المشهد.

لتلقّي إشعارات بالأحداث التي تعمل في المقدّمة داخل التطبيق، ننصحك بالاستماع إلى سينغلتون AppStateEventNotifier. بعد تنفيذ تفويض AppStateEventNotifier.AppStateChanged، سيتم تنبيه تطبيقك بالأحداث التي يتم إطلاقها في المقدّمة وبدءًا من عرض الإعلان.

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();
        }
    }
}

هذا كل شيء! يمكنك تصميم المشروع وتشغيله على جهاز أو مُحاكي. بعد تشغيل التطبيق، انتظِر بضع ثوانٍ للسماح بتحميل الإعلان بالكامل.

بعد ذلك، عند عودتك إلى التطبيق من التطبيقات الأخرى/الشاشة الرئيسية، سيتم عرض الإعلان على شاشة فتح التطبيق على النحو التالي.

6338548c3f73e7cf.gif

7. أكملت كل الإجراءات

لقد أكملت الدرس التطبيقي حول الترميز. يمكنك العثور على الرمز المكتمل لهذا الدرس التطبيقي في المجلد android_studio_folder.pngcomplete.