Så här lägger du till AdMob-bannerannonser i din iOS Swift App

Vad du ska skapa

Bannerannonser är en viktig inkomstkälla för många apputvecklare. I den här handledningen lär du dig att lägga till AdMob-annonser i din iOS-app, med hjälp av Swift 3 och Xcode 8.

Skapa ett Banner Unit ID

Det allra första du behöver göra för att förbereda din iOS-app för att visa bannerannonser är att skapa sitt Enhets-ID på AdMobs webbplats. Om du inte har ett Google-konto föreslår jag att du registrerar dig för en ny-det är gratis och det ger dig tillgång till alla Google-tjänster.

När du har skrivit in på AdMobs hemsida klickar du på det röda Tjäna pengar på ny app knapp.

Om din app inte finns i iTunes App Store ändå måste du välja Lägg till din app manuellt.Skriv sedan in ditt programs namn, välj iOS Plattform och klicka på Lägg till app knapp.

På nästa skärm ser du din nybildade AdMob App ID nedanför Apple-gråikonet. Observera att det inte är detsamma som enhetens ID som måste klistras in i ditt Xcode-projekt. Vi kommer till enheten ID en liten bit.

Klick Baner för att välja annonsformat. Jag föreslår att du lämnar Annonstyp, Automatisk uppdatering, och Textannonsstil inställningar till standardvärdena. Om du vill anpassa annonsstilen kan du klicka på de Standard kombinationsfält och välj Anpassat. För en anpassad banner kan du anpassa bakgrunds-, gräns-, titel-, text- och webbadressfärgen.

Slutligen skriver du ett namn i Annonsenhetens namn låda. Det kommer inte att vara din banneridentifierare, utan bara ett referensnamn för ditt Enhets-ID. Klick Spara att gå vidare till det tredje steget.

Steg 3 är valfritt och låter dig länka din AdMob-app till Firebase och dela dina data från det fria Firebase Analytics-verktyget. För nu, klicka bara på Hoppa att fortsätta.

Slutligen kan du ladda ner det senaste GoogleMobileAds.framework filen från Firebase-servern. Det här fjärde steget kommer också att visa dig annonsenhetens ID du måste klistra in i huvudet .snabb filen av ditt Xcode-projekt, som vi ser senare.

Klicka på Hämta SDK för Google Mobile Ads länk. En ny flik öppnas i din webbläsare, och du kan ladda ner den senaste officiella paket zip-filen. 

Gå tillbaka till AdMobs webbplats och klicka på Gjort. Nästa skärm visar dig Annonsenhetens ID du har just skapat, redo att kopieras och klistras in i din .snabb filen i Xcode. Jag antar att du redan har skapat ett nytt Xcode-projekt, eller du har din egen, där du vill lägga till AdMob-annonser.

Implementera AdMob i ditt Xcode-projekt

Extrahera googlemobileadssdkios.zip fil som du tidigare laddat ner från Firebase-servern, öppna mappen och kopiera GoogleMobileAds.framework endast.

Klistra in det i din projektmapp.


Ange nu ditt Xcode-projekt och gå till Allmän fliken, bläddra ner till Länkade ramar och bibliotek avsnittet och dra den GoogleMobileAds.framework överföras till den.

Det kan hända att du måste lägga till ytterligare iOS-ramar till ditt Xcode-projekt för att AdMob ska kunna ta emot och visa banners i din app. 

Klicka på + underteckna längst ner och importera följande ramar en efter en:

  • EventKit 
  • EventKitUI 
  • AVFoundation 
  • AdSupport 
  • AudioToolbox 
  • AVFoundation 
  • Coregraphics 
  • CoreTelephony 
  • CoreMedia 
  • MessageUI 
  • StoreKit 
  • Systemkonfiguration 

Saken att göra är att byta till Bygg inställningar fliken och söka efter bitcode. Xcode tar upp Aktivera Bitcode alternativ, och du måste bestämma att det ska vara Nej.

Du är nu redo att skriva en kod för att få AdMob-annonser att visas i din app!

Koden

Baserat på hur din app är uppbyggd, vill du att AdMob-annonser ska visas i dina kontroller. Så du måste ange .snabb filen hos den registeransvarige som du vill att annonser ska visas och importera följande ramar längst upp i filen:

importera GoogleMobileAds importera AudioToolbox

anta GADBannerViewDelegate protokoll genom att lägga till det i slutet av din klassdeklaration:

klass ViewController: UIViewController, GADBannerViewDelegate 

Lägg till AdMob-bannervyn ovanför viewDidLoad () metod i din klass:

// Annonsbanner och interstitiala vyer var adMobBannerView = GADBannerView ()

Följande kodrad är en enkel sträng som påminner om annonsenhetens ID du tidigare skapat:

// VIKTIGT: Byt den röda strängen nedan med den annonsenhet som du fått genom att registrera din app på http://apps.admob.com låt ADMOB_BANNER_UNIT_ID = "ca-app-pub-9733347540588953/7805958028" 

Här måste du byta ut ca-app-pub-9733347540588953/6145924825med ditt eget banderolls-ID, så gå tillbaka till din AdMob Annonsenheter sida i din webbläsare för att kopiera den strängen och klistra in den i koden ovan.

Lägg nu till funktionerna nedan i din viewDidLoad () metod:

åsidosätta func viewDidLoad () super.viewDidLoad () // Init AdMob banner initAdMobBanner ()

Slutligen klistra in följande metoddeklaration var du vill i din .snabbfil (före klassens stängningsfäste och inte i en befintlig metod):

// MARK: - ADMOB BANNER func initAdMobBanner () om UIDevice.current.userInterfaceIdiom == .phone // iPhone adMobBannerView.adSize = GADAdSizeFromCGSize (CGSize (bredd: 320, höjd: 50)) adMobBannerView.frame = CGRect (x : 0, y: view.frame.size.height, width: 320, height: 50) annat // iPad adMobBannerView.adSize = GADAdSizeFromCGSize (CGSize (bredd: 468, höjd: 60)) adMobBannerView.frame = CGRect x: 0, y: view.frame.size.height, width: 468, height: 60) adMobBannerView.adUnitID = ADMOB_BANNER_UNIT_ID adMobBannerView.rootViewController = själv adMobBannerView.delegate = självvisning.addSubview (adMobBannerView) låt request = GADRequest () adMobBannerView.load (request) // Dölj banner func hideBanner (_ banner: UIView) UIView.beginAnimations ("hideBanner", context: nil) banner.frame = CGRect (x: view.frame.size.width / 2 - banner.frame.size.width / 2, y: view.frame.size.height - banner.frame.size.height, width: banner.frame.size.width, height: banner.frame.size.height) UIView .commitAnimations () banner.isHidden = true // Visa banner func showBanner (_ banner: UIView) UIView.beginAnimations ("showBanner", context: nil) banner.frame = CGRect (x: view.frame.size.width / 2 - banner.frame.size.width / 2, y: view.frame.size.height - banner.frame.size.height, width: banner.frame.size.width, height: banner.frame.size.height) UIView.commitAnimations () banner.isHidden = false // AdMob banner tillgänglig func adViewDidReceiveAd (_ visa: GADBannerView!) ShowBanner (adMobBannerView) // NEJ AdMob banner tillgänglig func adView (_ view: GADBannerView !, didFailToReceiveAdWithError error: GADRequestError !) hideBanner (adMobBannerView)

Observera att AdMob-banners har olika storlekar baserat på den använda enheten, så de första raderna med kod i func initAdMobBanner () Ange storleken på banners för iPhone / iPod Touch och iPad.

Om du är nyfiken på de tillgängliga bannerstorlekarna för AdMob-annonser kan du kolla AdMob-dokumentationen. Hur som helst, de bästa banderollstorlekarna för iPhone och iPad-enheter är de som vi har angett i koden ovan:

  • 320 x 50 px för iPhones
  • 468 x 60 px för iPads

CodeCanyon Mall

På CodeCanyon säljer jag en iOS-appmall som följer med AdMob-banners inbyggda och har även stöd för interstitiella annonser. Så, om du vill påskynda din utveckling, kan du bara köpa den mallen och starta din app.

Hitta det här: IOS AdMob Banner + Interstitala annonser mall | Universal (Swift).

Det finns hundratals andra iOS-appmallar på CodeCanyon. Gå kolla in dem! Du kanske bara sparar arbetstid på din nästa app.

Slutsats

Tack för att du läser, och vi ses nästa gång! Kolla in några av våra andra kurser och handledning om iOS apputveckling med Swift.