Exoplayer IMA uzantısını kullanmaya başlayın

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:

  1. Android Studio'yu başlatın.
  2. Yeni bir Android Studio projesi başlat'ı seçin.
  3. Projenizi seçin sayfasında Boş Etkinlik şablonunu seçin.
  4. İleri'yi tıklayın.
  5. Projenizi yapılandırın sayfasında projenize bir ad verin ve dil seçin.
  6. 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.

app/build.gradle
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.

app/src/main/res/layout/activity_main.xml
<?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.

app/src/main/res/values/strings.xml
<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.

app/src/main/java/com/example/project name/MainActivity.java

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.

app/src/main/java/com/example/project name/MainActivity.java

...

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.

app/src/main/java/com/example/project name/MainActivity.java
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
app/src/main/java/com/example/project name/MainActivity.java
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.