IMA SDK'ları, multimedya reklamlarını web sitelerinize ve uygulamalarınıza entegre etmenizi kolaylaştırır. IMA SDK'ları VAST ile uyumlu herhangi bir reklam sunucusundan reklam isteyebilir ve uygulamalarınızda reklam oynatmayı yönetebilir. IMA istemci tarafı SDK'larında, video oynatma işlevi içeriğin kontrolündeyken SDK reklam oynatmayı işler. Reklamlar, uygulamanın içerik video oynatıcısının üstüne yerleştirilmiş ayrı bir video oynatıcıda oynatılır.
Bu kılavuzda, ExoPlayer IMA uzantısı kullanılarak IMA SDK'nın boş bir Android Studio projesine nasıl entegre edileceği gösterilmektedir. Tamamlanmış bir örnek entegrasyonu görüntülemek veya bu entegrasyonu takip etmek isterseniz GitHub'dan TemelÖrnek'i indirin.
IMA istemci tarafına genel bakış
IMA istemci tarafını uygulamak için bu kılavuzda gösterildiği gibi dört ana SDK bileşeni bulunur:
AdDisplayContainer
: Reklamların oluşturulacağı kapsayıcı nesne.AdsLoader
: Reklam isteğinde bulunan ve reklam isteği yanıtlarındaki etkinlikleri işleyen bir nesne. Uygulamanın kullanım ömrü boyunca yeniden kullanılabilecek tek bir reklam yükleyicisi belirlemeniz gerekir.AdsRequest
: Reklam isteğini tanımlayan bir nesne. Reklam istekleri, VAST reklam etiketinin URL'sinin yanı sıra reklam boyutları gibi ek parametreleri de belirtir.AdsManager
: Reklam isteğine verilen yanıtı içeren, reklam oynatmayı kontrol eden ve SDK tarafından tetiklenen reklam etkinliklerini işleyen bir nesne.
Ön koşullar
Başlamadan önce Android Studio 3.0 veya daha yeni bir sürüme sahip olmanız gerekir.
1. Yeni Android Studio projesi oluşturma
Android Studio projenizi oluşturmak için aşağıdaki adımları uygulayın:
- Android Studio'yu başlatın.
- Yeni bir Android Studio projesi başlat'ı seçin.
- Projenizi seçin sayfasında Boş Etkinlik şablonunu seçin.
- İleri'yi tıklayın.
- Projenizi yapılandırın sayfasında projenize bir ad verin ve dil seçin.
- Son'u tıklayın.
2. ExoPlayer IMA uzantısını projenize ekleyin
Uygulama düzeyindeki build.gradle dosyasında uzantı için içe aktarmaları bağımlılık bölümüne ekleyin. ExoPlayer IMA uzantısının boyutu nedeniyle multidex'i burada etkinleştirip etkinleştirin. Bu, minSdkVersion
ayarının 20 veya daha düşük olarak belirlendiği uygulamalar için gereklidir.
Ayrıca, Java sürümü uyumluluk bilgilerini belirtmek için yeni compileOptions
etiketi ekleyin.
android { compileSdkVersion 30 compileOptions { sourceCompatibility JavaVersion.VERSION_11 targetCompatibility JavaVersion.VERSION_11 } } defaultConfig { applicationId "com.google.ads.interactivemedia.v3.samples.videoplayerapp" minSdkVersion 16 targetSdkVersion 30 multiDexEnabled true versionCode 1 versionName "1.0" } ... } dependencies { implementation 'androidx.multidex:multidex:2.0.1' implementation 'androidx.appcompat:appcompat:1.3.1' implementation 'com.google.android.exoplayer:exoplayer-core:2.18.1' implementation 'com.google.android.exoplayer:exoplayer-ui:2.18.1' implementation 'com.google.android.exoplayer:extension-ima:2.18.1' ... }
IMA SDK'nın reklam isteğinde bulunması için gereken kullanıcı izinlerini ekleyin.
app/src/main/AndroidManifest.xml<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.example.project name"> <!-- Required permissions for the IMA SDK --> <uses-permission android:name="android.permission.INTERNET"/> <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/> ... </manifest>
3. Reklam kullanıcı arayüzü kapsayıcısını oluşturma
Uygun kimliğe sahip bir StyledPlayerView
nesnesi oluşturarak ExoPlayer PlayerView olarak kullanılacak görünümü oluşturun. Ayrıca androidx.constraintlayout.widget.ConstraintLayout
öğesini LinearLayout
olarak değiştirin.
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <com.google.android.exoplayer2.ui.StyledPlayerView android:id="@+id/player_view" android:layout_width="match_parent" android:layout_height="wrap_content" /> </LinearLayout>
4. Reklam isteği için içerik URL'nizi ve reklam etiketi URL'nizi ekleyin
İçerik URL'nizi ve VAST reklam etiketi URL'nizi depolamak için strings.xml
öğesine girişler ekleyin.
<resources> <string name="app_name">Your_Project_Name</string> <string name="content_url"><![CDATA[https://storage.googleapis.com/gvabox/media/samples/stock.mp4]]></string> <string name="ad_tag_url"><![CDATA[https://pubads.g.doubleclick.net/gampad/ads?iu=/21775744923/external/single_ad_samples&sz=640x480&cust_params=sample_ct%3Dlinear&ciu_szs=300x250%2C728x90&gdfp_req=1&output=vast&unviewed_position_start=1&env=vp&impl=s&correlator=]]></string> </resources>
5. ExoPlayer IMA uzantısını içe aktar
ExoPlayer uzantısı için içe aktarma ifadeleri ekleyin. Ardından PlayerView
, SimpleExoPlayer
ve ImaAdsLoader
için özelleştirilebilen değişkenler ekleyerek MainActivity
sınıfını Activity
değerini içerecek şekilde güncelleyin.
import android.app.Activity; import android.net.Uri; import android.os.Bundle; import androidx.multidex.MultiDex; import com.google.android.exoplayer2.ExoPlayer; import com.google.android.exoplayer2.MediaItem; import com.google.android.exoplayer2.ext.ima.ImaAdsLoader; import com.google.android.exoplayer2.source.DefaultMediaSourceFactory; import com.google.android.exoplayer2.source.MediaSourceFactory; import com.google.android.exoplayer2.ui.StyledPlayerView; import com.google.android.exoplayer2.upstream.DataSource; import com.google.android.exoplayer2.upstream.DefaultDataSourceFactory; import com.google.android.exoplayer2.util.Util; ... public class MainActivity extends Activity { private StyledPlayerView playerView; private ExoPlayer player; private ImaAdsLoader adsLoader; }
6. adsLoader
örneği oluşturma
Reklam etiketi URL'sini kullanarak yeni bir adsLoader
nesnesi oluşturmak için onCreate
yönteminin üzerine yazın ve gerekli değişken atamalarını ekleyin.
... public class MainActivity extends Activity { private StyledPlayerView playerView; private ExoPlayer player; private ImaAdsLoader adsLoader; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); MultiDex.install(this); playerView = findViewById(R.id.player_view); // Create an AdsLoader. adsLoader = new ImaAdsLoader.Builder(/* context= */ this).build(); } }
7. Oynatıcıyı ilk kullanıma hazırlayıp kullanıma sunma
Oynatıcıyı ilk kullanıma hazırlamak ve serbest bırakmak için kullanabileceğiniz yöntemler ekleyin. ilk kullanıma hazırlama yönteminde, SimpleExoPlayer
öğesini oluşturun. Ardından, AdsMediaSource
öğesini oluşturun ve oynatıcıya ayarlayın.
public class MainActivity extends Activity { ... private void releasePlayer() { adsLoader.setPlayer(null); playerView.setPlayer(null); player.release(); player = null; } private void initializePlayer() { // Set up the factory for media sources, passing the ads loader and ad view providers. DataSource.Factory dataSourceFactory = new DefaultDataSource.Factory(this); MediaSourceFactory mediaSourceFactory = new DefaultMediaSourceFactory(dataSourceFactory) .setAdsLoaderProvider(unusedAdTagUri -> adsLoader) .setAdViewProvider(playerView); // Create an ExoPlayer and set it as the player for content and ads. player = new ExoPlayer.Builder(this).setMediaSourceFactory(mediaSourceFactory).build(); playerView.setPlayer(player); adsLoader.setPlayer(player); // Create the MediaItem to play, specifying the content URI and ad tag URI. Uri contentUri = Uri.parse(getString(R.string.content_url)); Uri adTagUri = Uri.parse(getString(R.string.ad_tag_url)); MediaItem mediaItem = new MediaItem.Builder() .setUri(contentUri) .setAdsConfiguration(new MediaItem.AdsConfiguration.Builder(adTagUri).build()) .build(); // Prepare the content and ad to be played with the SimpleExoPlayer. player.setMediaItem(mediaItem); player.prepare(); // Set PlayWhenReady. If true, content and ads will autoplay. player.setPlayWhenReady(false); } }
8. Oyuncu etkinliklerini işleme
Son olarak, oyuncunun yaşam döngüsü etkinlikleri için geri çağırmalar oluşturun:
onStart
onResume
onStop
onPause
onDestroy
public class MainActivity extends Activity { private PlayerView playerView; private SimpleExoPlayer player; private ImaAdsLoader adsLoader; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_my); playerView = findViewById(R.id.player_view); // Create an AdsLoader with the ad tag url. adsLoader = new ImaAdsLoader(this, Uri.parse(getString(R.string.ad_tag_url))); } @Override public void onStart() { super.onStart(); // if (Util.SDK_INT > 23) { initializePlayer(); if (playerView != null) { playerView.onResume(); } } } @Override public void onResume() { super.onResume(); if (Util.SDK_INT <= 23 || player == null) { initializePlayer(); if (playerView != null) { playerView.onResume(); } } } @Override public void onPause() { super.onPause(); if (Util.SDK_INT <= 23) { if (playerView != null) { playerView.onPause(); } releasePlayer(); } } @Override public void onStop() { super.onStop(); if (Util.SDK_INT > 23) { if (playerView != null) { playerView.onPause(); } releasePlayer(); } } @Override protected void onDestroy() { super.onDestroy(); adsLoader.release(); } ... }
İşte bu kadar. Şu anda IMA SDK ile reklam isteğinde bulunuyor ve reklamları görüntülüyorsunuz. Ek SDK özellikleri hakkında bilgi edinmek için diğer kılavuzlara veya GitHub'daki örneklere bakın.