В этом руководстве показано, как реализовать собственный пользовательский интерфейс с помощью 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. Если вы столкнетесь с этим, вашей команде по трафику придется внести изменения, чтобы гарантировать, что эти типы объявлений не будут показываться.