Xamarin.Forms에서 맞춤 렌더러를 사용하여 AdMob 배너 광고 보기 (iOS/Android)

19122 단어 adMobXamarinXamarin.Forms

개요



Xamarin.Forms에서 AdMob 배너 광고를 봅니다.
여기에서는 맞춤 렌더러를 사용하여 iOS와 Android에 표시해 보겠습니다. (｀・ω・´)
아래 샘플을 기반으로 설명합니다.

샘플



GitHub에 두었습니다.
AddAdMobBannerSample

이런 식으로 배너 광고가 게재됩니다. (실기에서도 표시할 수 있었습니다(∩´∀｀)∩)


제작 환경 (동작 확인 환경)


  • macOS Sierra 10.2
  • Xamarin Studio 6.1.1(Build15)
  • Xamarin.iOS 10.0.1.10
  • Xamarin.Android 7.0.1.3


    • 흐름


  • AdMob 광고 단위 ID 얻기
  • PCL (공통 프로젝트)에서의 작업
  • iOS 프로젝트에서 작업
  • 안드로이드 프로젝트에서 작업

    • 1. AdMob 광고 단위 ID 얻기



    자세한 내용은 생략하지만, AdMob의 광고 단위 ID를 iOS용과 Android용의 2개 준비해 주세요.
    ※iOS에서는 아래에 체크를 넣어 두십시오.
    광고 요청의 HTTPS 지원 앱에서 광고 요청의 보안 강화

    2. PCL(공통 프로젝트)에서의 작업



    여기에서는 사용자 지정 원본 보기를 만들거나 UI(Xaml)에 광고를 추가합니다.

    AdMobBanner.cs



    내용이 비어 있고 걱정되지만 이것으로 괜찮습니다.
    using System;
using Xamarin.Forms;

namespace AddAdMobBannerSample
{
    public class AdMobBanner : ContentView
    {
        public AdMobBanner()
        {
        }
    }
}

    MainPage.xaml



    AdMob 배너 크기가 320x50이므로 이 크기가 맞는지 확인하세요.
    (margin이나 padding으로 표시 영역이 좁아져도 광고가 게재되지 않습니다.)
    <?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
             xmlns:controls="clr-namespace:AddAdMobBannerSample;assembly=AddAdMobBannerSample" 
             x:Class="AddAdMobBannerSample.MainPage">
    <ContentPage.Content>
        <StackLayout VerticalOptions="Center" HorizontalOptions="Center">
            <controls:AdMobBanner WidthRequest="320" HeightRequest="50" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

    3. iOS 프로젝트에서 작업



    iOS용 패키지를 추가하거나 사용자 지정 렌더러를 만들 수 있습니다.

    패키지 추가



    아래 패키지를 추가하십시오.
    「Xamarin.Google.iOS.MobileAds」

    AdMobBannerRenderer.cs



    iOS용 커스텀 렌더러입니다.
    여기에 iOS용 광고 단위 ID를 기재하세요.
    using System;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;
using Google.MobileAds;
using UIKit;
using CoreGraphics;
using AddAdMobBannerSample;
using AddAdMobBannerSample.iOS.Renderers;

[assembly: ExportRenderer(typeof(AdMobBanner), typeof(AdMobBannerRenderer))]
namespace AddAdMobBannerSample.iOS.Renderers
{
    public class AdMobBannerRenderer : ViewRenderer
    {
        const string adUnitID = "Insert Your AdUnitID(for iOS)";

        BannerView adMobBanner;
        bool viewOnScreen;

        protected override void OnElementChanged(ElementChangedEventArgs<View> e)
        {
            base.OnElementChanged(e);

            if (e.NewElement == null)
                return;

            if (e.OldElement == null)
            {
                adMobBanner = new BannerView(AdSizeCons.Banner, new CGPoint(-10, 0))
                {
                    AdUnitID = adUnitID,
                    RootViewController = UIApplication.SharedApplication.Windows[0].RootViewController
                };
                adMobBanner.AdReceived += (sender, args) =>
                {
                    if (!viewOnScreen) AddSubview(adMobBanner);
                    viewOnScreen = true;
                };
                adMobBanner.LoadRequest(Request.GetDefaultRequest());
                SetNativeControl(adMobBanner);
            }
        }
    }
}

    AppDelegate.cs



    [Export("window")] 다음을 추가합니다.
    이것을 추가하지 않으면 앱이 시작될 때 충돌이 발생합니다.
    참고
    using System;
using System.Collections.Generic;
using System.Linq;

using Foundation;
using UIKit;

namespace AddAdMobBannerSample.iOS
{
    [Register("AppDelegate")]
    public partial class AppDelegate : global::Xamarin.Forms.Platform.iOS.FormsApplicationDelegate
    {
        public override bool FinishedLaunching(UIApplication app, NSDictionary options)
        {
            global::Xamarin.Forms.Forms.Init();

            LoadApplication(new App());

            return base.FinishedLaunching(app, options);
        }

        [Export("window")]
        public UIWindow GetWindow()
        {
            return UIApplication.SharedApplication.Windows[0];
        }
    }
}

    4. Android 프로젝트에서 작업



    Android용 패키지를 추가하거나 맞춤 렌더러를 만들 수 있습니다.

    패키지 추가



    아래 패키지를 추가하십시오.
    Xamarin.GooglePlayServices.Ads
    Xamarin.GooglePlayServices.Basement (.Ads를 넣으면 자동으로 들어갑니다)

    AdMobBannerRenderer.cs



    Android용 맞춤 렌더러입니다.
    여기에 Android용 광고 단위 ID를 기재하세요.
    using AddAdMobBannerSample;
using AddAdMobBannerSample.Droid.Renderers;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;

[assembly: ExportRenderer(typeof(AdMobBanner), typeof(AdMobBannerRenderer))]
namespace AddAdMobBannerSample.Droid.Renderers
{
    public class AdMobBannerRenderer:ViewRenderer<AdMobBanner, Android.Gms.Ads.AdView>
    {
        protected override void OnElementChanged(ElementChangedEventArgs<AdMobBanner> e)
        {
            const string adUnitID = "Insert Your AdUnitID(for Android)";

            base.OnElementChanged(e);

            if (Control == null)
            {
                var adMobBanner = new Android.Gms.Ads.AdView(Forms.Context);
                adMobBanner.AdSize = Android.Gms.Ads.AdSize.Banner;
                adMobBanner.AdUnitId = adUnitID;

                var requestbuilder = new Android.Gms.Ads.AdRequest.Builder();
                adMobBanner.LoadAd(requestbuilder.Build());

                SetNativeControl(adMobBanner);
            }
        }
    }
}

    AndroidManifest.xml



    INTERNET 및 ACCESS_NETWORK_STATE 권한이 필요하므로 추가합니다.
    또한 
    <?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android" android:versionCode="1" android:versionName="1.0" package="jp.co.noraneko.addadmobbannersample">
    <uses-sdk android:minSdkVersion="15" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    <uses-permission android:name="android.permission.INTERNET" />
    <application android:label="AddAdMobBannerSample">
        <activity android:name="com.google.android.gms.ads.AdActivity" android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|uiMode|screenSize|smallestScreenSize" android:theme="@android:style/Theme.Translucent" />
    </application>
</manifest>

    결론



    이제 Xamarin.Forms로 만든 앱에 AdMob 배너 광고를 게재 할 수있었습니다 (∩´∀`) ∩
    커스텀 렌더러라고 해도 거기까지 복잡한 것이 아니기 때문에,
    부담없이 광고를 넣을 수 있을까라고 생각합니다.
    Xamarin.Forms와 Azure Mobile Apps가 함께 작동하는 동안 테이블을 추가하는 방법
    Xamarin Studio에서 Cocos Sharp를 추가하면 오류가 발생하는 경우 대응

    좋은 웹페이지 즐겨찾기

    개발자 우수 사이트 수집

    개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
    best100-homepage