|
| 1 | +--- |
| 2 | +layout: post |
| 3 | +title: "AdMob" |
| 4 | +date: 2019-04-29 |
| 5 | +categories: ["Firebase"] |
| 6 | +image: firebase/admob |
| 7 | +github: firebase/tree/master/admob |
| 8 | +description: "Firebase" |
| 9 | +version: Firebase-Ads 17.1 |
| 10 | +keywords: "firebase, admob, reklama, reklamy, ad, ads, baner, wideo, pełen ekran, natywna, banner, video, fullscreen, native, android, programowanie, programming" |
| 11 | +--- |
| 12 | + |
| 13 | +## Wprowadzenie |
| 14 | +`Google AdMob` jest mobilną platformą reklamową, która umożliwia wyświetlanie ukierunkowanych reklam w aplikacji co przekłada się na generowanie przychodów. Reklamy pochodzą od milionów reklamodawców `Google` w czasie rzeczywistym i dzięki współpracy z usługą `Analytics` pozwalają na maksymalizowanie zysków poprzez automatyczny wybór dopasowanej treści dla danego użytkownika. Reklamy mogą być wyświetlane jako banery reklamowe, reklamy pełnoekranowe, reklamy wideo czy reklamy natywne. |
| 15 | + |
| 16 | +## Konfiguracja |
| 17 | +Aby wykorzystać możliwości `AdMob` należy stworzyć `konto AdMob` (lub użyć konta testowego) oraz dodać wpis z kluczem `AdMob App ID` w pliku `AndroidManifest`. Następnie dokonać inicjalizacji usługi w aplikacji poprzez wywołanie metody `MobileAds.initialize` i wybrać format reklamy oraz jego miejsce w widoku. |
| 18 | + |
| 19 | +{% highlight xml %} |
| 20 | +<!-- The value below is for testing purpose --> |
| 21 | +<meta-data |
| 22 | + android:name="com.google.android.gms.ads.APPLICATION_ID" |
| 23 | + android:value="ca-app-pub-3940256099942544~3347511713"/> |
| 24 | +{% endhighlight %} |
| 25 | + |
| 26 | +{% highlight kotlin %} |
| 27 | +override fun onCreate(savedInstanceState: Bundle?) { |
| 28 | + super.onCreate(savedInstanceState) |
| 29 | + //start once e.g. when app launch |
| 30 | + MobileAds.initialize(this, "ca-app-pub-3940256099942544~3347511713") //testing key |
| 31 | +} |
| 32 | +{% endhighlight %} |
| 33 | + |
| 34 | +## Baner reklamowy |
| 35 | +Banery reklamowe (`banner ads`) są prostokatnymi graficznymi lub tekstowymi reklamami zajmującymi część widoku aplikacji. Pozostają na ekranie, gdy użytkownik wchodzi w interakcje z aplikacją i odświeżają się automatycznie po pewnym czasie. Aby dodać reklamę banerową do aplikacji należy umieścić widok `AdView` w docelowym układzie oraz załadować reklamę oraz opcjonalnie dodać obiektu słuchacza `AdListener` w kodzie. |
| 36 | + |
| 37 | +{% highlight xml %} |
| 38 | +<!-- choose adSize from one of: BANNER, LARGE_BANNER, MEDIUM_RECTANGLE, |
| 39 | +FULL_BANNER, LEADERBOARD, SMART_BANNER or define custom size |
| 40 | +adUnitId as below is for developer testing purpose --> |
| 41 | +<com.google.android.gms.ads.AdView |
| 42 | + xmlns:ads="http://schemas.android.com/apk/res-auto" |
| 43 | + android:id="@+id/adView" |
| 44 | + android:layout_width="wrap_content" |
| 45 | + android:layout_height="wrap_content" |
| 46 | + ads:adSize="BANNER" |
| 47 | + ads:adUnitId="ca-app-pub-3940256099942544/6300978111"> |
| 48 | +</com.google.android.gms.ads.AdView> |
| 49 | +{% endhighlight %} |
| 50 | + |
| 51 | +{% highlight kotlin %} |
| 52 | +class AdViewActivity : AppCompatActivity() { |
| 53 | + |
| 54 | + private lateinit var adView: AdView |
| 55 | + |
| 56 | + override fun onCreate(savedInstanceState: Bundle?) { |
| 57 | + super.onCreate(savedInstanceState) |
| 58 | + setContentView(R.layout.activity_adview) |
| 59 | + MobileAds.initialize(this, "ca-app-pub-3940256099942544~3347511713") |
| 60 | + |
| 61 | + setAdView() |
| 62 | + } |
| 63 | + |
| 64 | + private fun setAdView() { |
| 65 | + adView = findViewById<AdView>(R.id.adView) |
| 66 | + val adRequest = AdRequest.Builder().build() |
| 67 | + adView.loadAd(adRequest) |
| 68 | + |
| 69 | + //setup listener methods |
| 70 | + adView.adListener = object: AdListener() { |
| 71 | + override fun onAdLoaded() { |
| 72 | + //some additional action when ad loaded |
| 73 | + } |
| 74 | + override fun onAdFailedToLoad(errorCode: Int) {} |
| 75 | + override fun onAdOpened() {} |
| 76 | + override fun onAdLeftApplication() {} |
| 77 | + override fun onAdClosed() {} |
| 78 | + } |
| 79 | + } |
| 80 | +} |
| 81 | +{% endhighlight %} |
| 82 | + |
| 83 | +## Reklama pełnoekranowa |
| 84 | +Reklamy pełnoekranowe (`inerstitial ads`) obejmują cały układ widoku i przeważnie wyświetlane są w ekranach przejścia przepływu akcji między czynnościami lub naturalnymi przerwami (np. po ukończeniu zadania) tam gdzie użytkownik spodziewa się przerwy w działaniu. Użytkownik może wybrać reklamę przechodząc do miejsca docelowego lub zamknąć i powrócić do bieżącej akcji. Zanim reklamy pełnoekranowe zostaną użyte w aplikacji należy zastanowić się czy są właściwym typem reklam dla aplikacji i czy nie zakłócają jej działania oraz w przypadku implementacji zadbać o zwolnienie i wznowienie zasobów oraz akcji. Aby dodać reklamę pełnoekranową należy stworzyć obiekt `InterstitialAd`, załadować i wywołać reklamę oraz opcjonalnie dodać obiekt słuchacza `AdListener`. |
| 85 | + |
| 86 | +{% highlight kotlin %} |
| 87 | +class InterstitialAdActivity : AppCompatActivity() { |
| 88 | + |
| 89 | + private lateinit var interstitialAd: InterstitialAd |
| 90 | + |
| 91 | + override fun onCreate(savedInstanceState: Bundle?) { |
| 92 | + super.onCreate(savedInstanceState) |
| 93 | + setContentView(R.layout.activity_interstitial_ad) |
| 94 | + MobileAds.initialize(this, "ca-app-pub-3940256099942544~3347511713") |
| 95 | + |
| 96 | + setInterstitialAd() |
| 97 | + setButtonClickListener() |
| 98 | + } |
| 99 | + |
| 100 | + private fun setInterstitialAd() { |
| 101 | + interstitialAd = InterstitialAd(this) |
| 102 | + interstitialAd.adUnitId = "ca-app-pub-3940256099942544/1033173712" |
| 103 | + interstitialAd.loadAd(AdRequest.Builder().build()) |
| 104 | + |
| 105 | + //setup listener methods |
| 106 | + interstitialAd.adListener = object: AdListener() { |
| 107 | + override fun onAdClosed() { |
| 108 | + //reload new one |
| 109 | + interstitialAd.loadAd(AdRequest.Builder().build()) |
| 110 | + //start action from point where was paused |
| 111 | + } |
| 112 | + override fun onAdOpened() { |
| 113 | + //pause some action |
| 114 | + } |
| 115 | + } |
| 116 | + } |
| 117 | + |
| 118 | + private fun setButtonClickListener() { |
| 119 | + //show ad on some action like click finish button |
| 120 | + finishButton.setOnClickListener { |
| 121 | + if (interstitialAd.isLoaded) { |
| 122 | + interstitialAd.show() |
| 123 | + } |
| 124 | + else { |
| 125 | + //ad still not loaded |
| 126 | + } |
| 127 | + } |
| 128 | +} |
| 129 | +{% endhighlight %} |
| 130 | + |
| 131 | +## Reklama wideo |
| 132 | +Reklamy wideo (`video ads`) wyświetlane są w trybie pełnoekranowym i w ramach obejrzenia całości przyznają użytkownikowi pewien profit w aplikacji. Aby dodać reklamę wideo należy pobrać instancję typu `RewarderVideoAd`, zaimplementować obiekt słuchacza `RewarderVideoAdListener` oraz zadbać o właściwe zarządzanie obiektem reklam w cyklu życia komponentu. |
| 133 | + |
| 134 | +{% highlight kotlin %} |
| 135 | +class RewarderVideoAdActivity : AppCompatActivity(), RewardedVideoAdListener { |
| 136 | + |
| 137 | + private lateinit var rewardedVideoAd: RewardedVideoAd |
| 138 | + |
| 139 | + override fun onCreate(savedInstanceState: Bundle?) { |
| 140 | + super.onCreate(savedInstanceState) |
| 141 | + setContentView(R.layout.activity_rewarder_video_ad) |
| 142 | + MobileAds.initialize(this, "ca-app-pub-3940256099942544~3347511713") |
| 143 | + setRewarderVideoAd() |
| 144 | + } |
| 145 | + |
| 146 | + private fun setRewarderVideoAd() { |
| 147 | + rewardedVideoAd = MobileAds.getRewardedVideoAdInstance(this) |
| 148 | + rewardedVideoAd.rewardedVideoAdListener = this |
| 149 | + rewardedVideoAd.loadAd("ca-app-pub-3940256099942544/5224354917", AdRequest.Builder().build()) |
| 150 | + } |
| 151 | + |
| 152 | + //setup RewarderVideoAd instance in lifecycle methods |
| 153 | + override fun onPause() { |
| 154 | + super.onPause() |
| 155 | + rewardedVideoAd.pause(this) |
| 156 | + } |
| 157 | + |
| 158 | + override fun onResume() { |
| 159 | + super.onResume() |
| 160 | + rewardedVideoAd.resume(this) |
| 161 | + } |
| 162 | + |
| 163 | + override fun onDestroy() { |
| 164 | + super.onDestroy() |
| 165 | + rewardedVideoAd.destroy(this) |
| 166 | + } |
| 167 | + |
| 168 | + //implement RewardedVideoAdListener methods |
| 169 | + override fun onRewarded(reward: RewardItem) { |
| 170 | + //reward user based on RewardItem instance |
| 171 | + } |
| 172 | + override fun onRewardedVideoAdLeftApplication() {} |
| 173 | + override fun onRewardedVideoAdClosed() { |
| 174 | + //reload new one |
| 175 | + rewardedVideoAd.loadAd("ca-app-pub-3940256099942544/5224354917", AdRequest.Builder().build()) |
| 176 | + } |
| 177 | + override fun onRewardedVideoAdFailedToLoad(errorCode: Int) {} |
| 178 | + override fun onRewardedVideoAdLoaded() {} |
| 179 | + override fun onRewardedVideoAdOpened() {} |
| 180 | + override fun onRewardedVideoStarted() {} |
| 181 | + override fun onRewardedVideoCompleted() {} |
| 182 | +} |
| 183 | +{% endhighlight %} |
| 184 | + |
| 185 | +## Reklama natywna |
| 186 | +//TODO |
0 commit comments