Пользовательский интерфейс с IMA SDK для Android

В этом руководстве показано, как реализовать собственный пользовательский интерфейс с помощью IMA SDK для Android. Для этого вам необходимо отключить пользовательский интерфейс по умолчанию, настроить новый пользовательский интерфейс, а затем заполнить новый пользовательский интерфейс рекламной информацией, полученной из SDK.

Отключить рекламный интерфейс

Чтобы отобразить собственный пользовательский интерфейс, сначала необходимо отключить рекламный интерфейс по умолчанию. Для этого вызовите AdsRenderingSettings.setDisableUi() и затем передайте AdsRenderingSettings в AdsManager.init() :

Моя активность.java

ImaSdkFactory mSdkFactory = ImaSdkFactory.getInstance();
AdsManager mAdsManager;

@Override
public void onAdsManagerLoaded(AdsManagerLoadedEvent adsManagerLoadedEvent) {
    mAdsManager = adsManagerLoadedEvent.getAdsManager();

    ...
    AdsRenderingSettings settings = mSdkFactory.createAdsRenderingSettings();
    settings.setDisableUi(true);
    mAdsManager.init(settings);
}

Впоследствии, когда вам понадобится решить, отображать ли ваш собственный пользовательский интерфейс, проверьте, есть ли реклама, и вызовите Ad.isUiDisabled() , чтобы убедиться, что пользовательский интерфейс рекламы по умолчанию отключен.

Показать пользовательский интерфейс

После отключения пользовательского интерфейса по умолчанию следующим шагом будет отображение пользовательского пользовательского интерфейса рекламы. В этом примере добавьте новый RelativeLayout к существующему макету видеопроигрывателя, затем покажите этот макет при воспроизведении рекламы и скройте его, когда реклама не воспроизводится.

Добавьте в файл макета фрагмента следующее:

фрагмент_видео.xml

<com.google.ads.interactivemedia.v3.samples.samplevideoplayer.SampleVideoPlayer
    android:id="@+id/sampleVideoPlayer"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />
<RelativeLayout
        android:id="@+id/customUi"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:visibility="invisible">
                <TextView
                    android:id="@+id/adCounter"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@android:color/holo_green_light"
                    android:layout_alignParentTop="true"
                    android:layout_alignParentLeft="true"
                    android:text="@string/ad_counter" />
                <Button
                  android:id="@+id/learnMoreButton"
                  android:background="@android:color/holo_green_light"
                  android:layout_width="wrap_content"
                  android:layout_height="wrap_content"
                  android:layout_alignParentTop="true"
                  android:text="@string/learn_more"
                  android:layout_alignParentRight="true" />
                <Button
                  android:id="@+id/skipButton"
                  android:background="@android:color/holo_green_light"
                  android:layout_width="wrap_content"
                  android:layout_height="wrap_content"
                  android:layout_alignParentBottom="true"
                  android:text="@string/skip_ad"
                  android:enabled="false"
                  android:layout_alignParentRight="true" />
</RelativeLayout>

Затем добавьте код для использования пользовательского интерфейса в Activity . Чтобы обновить пользовательский интерфейс, создайте Handler таймера и Runnable , который запускается на нем.

Моя активность.java

// The view containing the custom UI.
private View mCustomUi;
// The timer handler.
private Handler mTimerHandler = new Handler();

// The Runnable that runs your custom UI update loop.
private Runnable mTimerRunnable = new Runnable() {
    @Override
    public void run() {
        updateCustomUi();
        mTimerHandler.postDelayed(this, 500);
    }
};

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                Bundle savedInstanceState) {
...
    mCustomUi = rootView.findViewById(R.id.customUi);
    mAdCounterUi = (TextView) rootView.findViewById(R.id.adCounter);
}

@Override
public void onAdEvent(AdEvent adEvent) {
    ...
    switch (adEvent.getType()) {
        ...
            case STARTED:
            // Start your update loop.
            mTimerHandler.post(mTimerRunnable);
            Break;
                ...
        case COMPLETED:
            mCustomUi.setVisibility(View.INVISIBLE);
            mTimerHandler.removeCallbacks(mTimerRunnable);
            ...
    }
}

@Override
public void onPause() {
...
    // Stop ad UI update loop.
    mTimerHandler.removeCallbacks(mTimerRunnable);
}

@Override
Public void onResume() {
...
    // Start ad UI update loop.
    mTimerHandler.post(mTimerRunnable);
}

Счетчик рекламы и кнопка пропуска

Теперь определите функцию updateCustomUi() для заполнения пользовательского интерфейса рекламной информацией. Подробности зависят от формата объявления, но обычно вы включаете счетчик объявления и кнопку пропуска или счетчик пропуска, если объявление можно пропустить. Добавьте следующее:

Моя активность.java

private void updateCustomUi() {
    // Runs from the update loop to update the custom UI.
    Ad ad = mAdsManager.getCurrentAd();
    if (ad != null && ad.isUiDisabled()) {
        // Show the UI.
        Log.i(LOGTAG, "UI disabled, show custom UI!");
        AdPodInfo podInfo = ad.getAdPodInfo();
        VideoProgressUpdate update = mAdsManager.getAdProgress();
        SimpleDateFormat format = new SimpleDateFormat("mm:ss", Locale.US);

        // Handle ad counter.
        String adProgress = format.format(
                (update.getDuration() - update.getCurrentTime()) * 1000);
        String adUiString = String.format(
                Locale.US, "Ad %d of %d (%s)", podInfo.getAdPosition(),
                podInfo.getTotalAds(), adProgress);
        mAdCounterUi.setText(adUiString);

        // Handle skippable ads.
        if (ad.isSkippable()) {
            if (update.getCurrentTime() >= ad.getSkipTimeOffset()) {
                // Allow skipping.
                mSkipButton.setText(getString(R.string.skip_ad));
                mSkipButton.setEnabled(true);
            } else {
                String skipString = String.format(
                        Locale.US, "You can skip this ad in %d",
                        (int) (ad.getSkipTimeOffset() -
                                update.getCurrentTime()));
                mSkipButton.setText(skipString);
                mSkipButton.setEnabled(false);
            }
            mSkipButton.setVisibility(View.VISIBLE);
        } else {
            mSkipButton.setVisibility(View.INVISIBLE);
        }
        mCustomUi.setVisibility(View.VISIBLE);
        mCustomUi.bringToFront();
    } else {
        // Hide the UI.
        mCustomUi.setVisibility(View.INVISIBLE);
        mTimerHandler.removeCallbacks(mTimerRunnable);
    }
}

В приведенном выше коде после проверки наличия объявления и вызова Ad.isUiDisabled() , чтобы убедиться, что пользовательский интерфейс рекламы по умолчанию отключен, вызовите Ad.getAdPodInfo() и AdsManager.getAdProgress() , чтобы найти позицию объявления в модуль и ход показа объявления. Для объявлений с возможностью пропуска покажите счетчик пропусков, если вы еще не можете пропустить объявление; в противном случае покажите кнопку пропуска. Вот краткая информация об общей рекламной информации и связанных с ней звонках:

Информация Вызов
Текущее объявление в пакете Ad.getAdPodInfo().getAdPosition()
Всего объявлений в пакете Ad.getPodInfo().getTotalAds()
Можно ли пропустить рекламу Ad.isSkippable()
Секунды до того, как рекламу можно будет пропустить Ad.getSkipTimeOffset() - AdsManager.getAdProgress().getCurrentTime()
Секунды, оставшиеся до объявления (AdsManager.getAdProgress().getDuration() - AdsManager.getAdProgress().getCurrentTime()) * 1000

При нажатии на кнопку «Пропустить рекламу» реклама будет пропущена, поэтому настройте ее в дополнение к кнопке «Подробнее» :

Моя активность.java

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                Bundle savedInstanceState) {
...
mCustomUi = rootView.findViewById(R.id.customUi);
mAdCounterUi = (TextView) rootView.findViewById(R.id.adCounter);

// Set up the 'learn more' button handler for the custom UI.
mLearnMoreButton = (Button) rootView.findViewById(R.id.learnMoreButton);
mLearnMoreButton.setOnClickListener(new OnClickListener() {
    @Override
    public void onClick(View view) {
        // Only works if the UI has been disabled.
        mAdsManager.clicked();
    }
});

// Set up the skip button handler for the custom UI.
mSkipButton = (Button) rootView.findViewById(R.id.skipButton);
mSkipButton.setOnClickListener(new OnClickListener() {
    @Override
    public void onClick(View view) {
        mAdsManager.skip();
    }
});

Пользовательский интерфейс должен быть отключен, чтобы AdsManager.clicked() работал.

Поиск неисправностей

Есть ли у вас образец тега, который позволяет отключить рекламный интерфейс?
Вы можете скопировать URL-адрес этого примера тега и вставить его в свою реализацию IMA.
Я не могу отключить пользовательский интерфейс по умолчанию.
Убедитесь, что вы вызываете AdsRenderingSettings.setDisableUi() и передаете его в AdsManager . Убедитесь, что Ad.isUiDisabled() возвращает true . Кроме того, чтобы отключить рекламный интерфейс, ваша сеть должна быть включена в Менеджере рекламы. Если вы включены, ваш VAST содержит Extension , которое выглядит следующим образом:
<Extension type="uiSettings">
<UiHideable>1</UiHideable>
</Extension>
Если у вас все еще возникают проблемы, обратитесь к менеджеру своего аккаунта, чтобы подтвердить, что вы включены. Для некоторых типов объявлений требуется определенный пользовательский интерфейс; эти объявления возвращаются со значением <UiHideable> равным 0. Если вы столкнетесь с этим, вашей команде по трафику придется внести изменения, чтобы гарантировать, что эти типы объявлений не будут показываться.