Esta página foi traduzida pela API Cloud Translation.

Anúncios nativos

Quando um anúncio nativo é carregado, o SDK de última geração do GMA invoca o listener do formato de anúncio correspondente. Dessa forma, seu aplicativo fica responsável por exibir o anúncio, embora não tenha que fazer isso imediatamente. Para facilitar a exibição de formatos de anúncio definidos pelo sistema, o SDK oferece alguns recursos úteis, conforme descrito abaixo.

Definir a classe `NativeAdView`

Defina uma classe NativeAdView. Essa classe é uma ViewGroup e é o contêiner de nível superior para uma classe NativeAdView. Cada visualização de anúncio nativo contém recursos, como o elemento de visualização MediaView ou Title, que precisa ser um filho do objeto NativeAdView.

Layout XML

Adicione um NativeAdView XML ao seu projeto:

<com.google.android.libraries.ads.mobile.sdk.nativead.NativeAdView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <LinearLayout
    android:orientation="vertical">
        <LinearLayout
        android:orientation="horizontal">
          <ImageView
          android:id="@+id/ad_app_icon" />
          <TextView
            android:id="@+id/ad_headline" />
        </LinearLayout>
        <!--Add remaining assets such as the image and media view.-->
    </LinearLayout>
</com.google.android.libraries.ads.mobile.sdk.nativead.NativeAdView>

Jetpack Compose

Inclua o módulo JetpackComposeDemo/compose-util, que inclui auxiliares para escrever o NativeAdView e os recursos dele.

Usando o módulo compose-util, crie um NativeAdView:

  import com.google.android.gms.compose_util.NativeAdAttribution
  import com.google.android.gms.compose_util.NativeAdView

  @Composable
  /** Display a native ad with a user defined template. */
  fun DisplayNativeAdView(nativeAd: NativeAd) {
      NativeAdView {
          // Display the ad attribution.
          NativeAdAttribution(text = context.getString("Ad"))
          // Add remaining assets such as the image and media view.
        }
    }

Processar o anúncio nativo carregado

Quando um anúncio nativo for carregado, processe o evento de callback, infle a visualização de anúncio nativo e adicione-o à hierarquia de visualização:

Kotlin

// Build an ad request with native ad options to customize the ad.
val adTypes = listOf(NativeAd.NativeAdType.NATIVE)
val adRequest = NativeAdRequest
  .Builder("ca-app-pub-3940256099942544/2247696110", adTypes)
  .build()

val adCallback =
  object : NativeAdLoaderCallback {
    override fun onNativeAdLoaded(nativeAd: NativeAd) {
      activity?.runOnUiThread {

        val nativeAdBinding = NativeAdBinding.inflate(layoutInflater)
        val adView = nativeAdBinding.root
        val frameLayout = myActivityLayout.nativeAdPlaceholder

        // Populate and register the native ad asset views.
        displayNativeAd(nativeAd, nativeAdBinding)

        // Remove all old ad views and add the new native ad
        // view to the view hierarchy.
        frameLayout.removeAllViews()
        frameLayout.addView(adView)
      }
    }
  }

// Load the native ad with our request and callback.
NativeAdLoader.load(adRequest, adCallback)

Java

// Build an ad request with native ad options to customize the ad.
List<NativeAd.NativeAdType> adTypes = Arrays.asList(NativeAd.NativeAdType.NATIVE);
NativeAdRequest adRequest = new NativeAdRequest
                                .Builder("ca-app-pub-3940256099942544/2247696110", adTypes)
                                .build();

NativeAdLoaderCallback adCallback = new NativeAdLoaderCallback() {
    @Override
    public void onNativeAdLoaded(NativeAd nativeAd) {
      if (getActivity() != null) {
        getActivity()
          .runOnUiThread(() -> {
            // Inflate the native ad view and add it to the view hierarchy.
            NativeAdBinding nativeAdBinding = NativeAdBinding.inflate(getLayoutInflater());
            NativeAdView adView = (NativeAdView) nativeAdBinding.getRoot();
            FrameLayout frameLayout = myActivityLayout.nativeAdPlaceholder;

            // Populate and register the native ad asset views.
            displayNativeAd(nativeAd, nativeAdBinding);

            // Remove all old ad views and add the new native ad
            // view to the view hierarchy.
            frameLayout.removeAllViews();
            frameLayout.addView(adView);
        });
      }
    }
};

// Load the native ad with our request and callback.
NativeAdLoader.load(adRequest, adCallback);

Todos os recursos de um determinado anúncio nativo precisam ser renderizados no layout NativeAdView. O SDK de última geração do GMA tenta registrar um alerta quando os recursos nativos são renderizados fora de um layout de visualização de anúncio nativo.

As classes de visualização de anúncio também fornecem métodos para registrar a visualização usada pelos recursos individuais, além de outro método para registrar o próprio objeto NativeAd. O registro de visualizações desse modo permite que o SDK processe automaticamente tarefas como:

Registrar cliques
Registrar impressões quando o primeiro pixel fica visível na tela
Mostrar a sobreposição das Opções de Anúncios

Mostrar o anúncio nativo

O exemplo a seguir demonstra como mostrar um anúncio nativo:

Kotlin

private fun displayNativeAd(nativeAd: NativeAd, nativeAdBinding : NativeAdBinding) {
  // Set the native ad view elements.
  val nativeAdView = nativeAdBinding.root
  nativeAdView.advertiserView = nativeAdBinding.adAdvertiser
  nativeAdView.bodyView = nativeAdBinding.adBody
  nativeAdView.callToActionView = nativeAdBinding.adCallToAction
  nativeAdView.headlineView = nativeAdBinding.adHeadline
  nativeAdView.iconView = nativeAdBinding.adAppIcon
  nativeAdView.priceView = nativeAdBinding.adPrice
  nativeAdView.starRatingView = nativeAdBinding.adStars
  nativeAdView.storeView = nativeAdBinding.adStore

  // Set the view element with the native ad assets.
  nativeAdBinding.adAdvertiser.text = nativeAd.advertiser
  nativeAdBinding.adBody.text = nativeAd.body
  nativeAdBinding.adCallToAction.text = nativeAd.callToAction
  nativeAdBinding.adHeadline.text = nativeAd.headline
  nativeAdBinding.adAppIcon.setImageDrawable(nativeAd.icon?.drawable)
  nativeAdBinding.adPrice.text = nativeAd.price
  nativeAd.starRating?.toFloat().let { value ->
    nativeAdBinding.adStars.rating = value
  }
  nativeAdBinding.adStore.text = nativeAd.store

  // Hide views for assets that don't have data.
  nativeAdBinding.adAdvertiser.visibility = getAssetViewVisibility(nativeAd.advertiser)
  nativeAdBinding.adBody.visibility = getAssetViewVisibility(nativeAd.body)
  nativeAdBinding.adCallToAction.visibility = getAssetViewVisibility(nativeAd.callToAction)
  nativeAdBinding.adHeadline.visibility = getAssetViewVisibility(nativeAd.headline)
  nativeAdBinding.adAppIcon.visibility = getAssetViewVisibility(nativeAd.icon)
  nativeAdBinding.adPrice.visibility = getAssetViewVisibility(nativeAd.price)
  nativeAdBinding.adStars.visibility = getAssetViewVisibility(nativeAd.starRating)
  nativeAdBinding.adStore.visibility = getAssetViewVisibility(nativeAd.store)

  // Inform GMA Next Gen SDK that you have finished populating
  // the native ad views with this native ad.
  nativeAdView.registerNativeAd(nativeAd, nativeAdBinding.adMedia)
}

/**
* Determines the visibility of an asset view based on the presence of its asset.
*
* @param asset The native ad asset to check for nullability.
* @return [View.VISIBLE] if the asset is not null, [View.INVISIBLE] otherwise.
*/
private fun getAssetViewVisibility(asset: Any?): Int {
  return if (asset == null) View.INVISIBLE else View.VISIBLE
}

Java

private void displayNativeAd(ad: NativeAd, nativeAdBinding : NativeAdBinding) {
  // Set the native ad view elements.
  NativeAdView nativeAdView = nativeAdBinding.getRoot();
  nativeAdView.setAdvertiserView(nativeAdBinding.adAdvertiser);
  nativeAdView.setBodyView(nativeAdBinding.adBody);
  nativeAdView.setCallToActionView(nativeAdBinding.adCallToAction);
  nativeAdView.setHeadlineView(nativeAdBinding.adHeadline);
  nativeAdView.setIconView(nativeAdBinding.adAppIcon);
  nativeAdView.setPriceView(nativeAdBinding.adPrice);
  nativeAdView.setStarRatingView(nativeAdBinding.adStars);
  nativeAdView.setStoreView(nativeAdBinding.adStore);

  // Set the view element with the native ad assets.
  nativeAdBinding.adAdvertiser.setText(nativeAd.getAdvertiser());
  nativeAdBinding.adBody.setText(nativeAd.getBody());
  nativeAdBinding.adCallToAction.setText(nativeAd.getCallToAction());
  nativeAdBinding.adHeadline.setText(nativeAd.getHeadline());
  if (nativeAd.getIcon() != null) {
      nativeAdBinding.adAppIcon.setImageDrawable(nativeAd.getIcon().getDrawable());
  }
  nativeAdBinding.adPrice.setText(nativeAd.getPrice());
  if (nativeAd.getStarRating() != null) {
      nativeAdBinding.adStars.setRating(nativeAd.getStarRating().floatValue());
  }
  nativeAdBinding.adStore.setText(nativeAd.getStore());

  // Hide views for assets that don't have data.
  nativeAdBinding.adAdvertiser.setVisibility(getAssetViewVisibility(nativeAd.getAdvertiser()));
  nativeAdBinding.adBody.setVisibility(getAssetViewVisibility(nativeAd.getBody()));
  nativeAdBinding.adCallToAction.setVisibility(getAssetViewVisibility(nativeAd.getCallToAction()));
  nativeAdBinding.adHeadline.setVisibility(getAssetViewVisibility(nativeAd.getHeadline()));
  nativeAdBinding.adAppIcon.setVisibility(getAssetViewVisibility(nativeAd.getIcon()));
  nativeAdBinding.adPrice.setVisibility(getAssetViewVisibility(nativeAd.getPrice()));
  nativeAdBinding.adStars.setVisibility(getAssetViewVisibility(nativeAd.getStarRating()));
  nativeAdBinding.adStore.setVisibility(getAssetViewVisibility(nativeAd.getStore()));

  // Inform GMA Next Gen SDK that you have finished populating
  // the native ad views with this native ad.
  nativeAdView.registerNativeAd(nativeAd, nativeAdBinding.adMedia);
}

/**
* Determines the visibility of an asset view based on the presence of its asset.
*
* @param asset The native ad asset to check for nullability.
* @return {@link View#VISIBLE} if the asset is not null, {@link View#INVISIBLE} otherwise.
*/
private int getAssetViewVisibility(Object asset) {
    return (asset == null) ? View.INVISIBLE : View.VISIBLE;
}

Sobreposição das Opções de Anúncios

Uma sobreposição das Opções de Anúncios é adicionada a cada visualização de anúncio pelo SDK. Deixe espaço no canto preferido da visualização de anúncio nativo para o logotipo das Opções de Anúncios inserido automaticamente. Além disso, essa sobreposição precisa ser facilmente visível. Escolha cores de fundo e imagens adequadas. Para saber mais sobre a aparência e a função da sobreposição, consulte Descrições dos campos de anúncios nativos.

Atribuição de anúncio

Você precisa mostrar uma atribuição de anúncio para indicar que a visualização é uma publicidade. Saiba mais nas nossas diretrizes da política.

Processar cliques

Não implemente gerenciadores de cliques personalizados em visualizações acima ou dentro da visualização de anúncio nativo. Os cliques nos recursos de visualização de anúncio são processados pelo SDK, desde que você preencha e registre corretamente as visualizações de recursos.

Para detectar cliques, implemente o callback de clique do SDK de última geração do GMA:

Kotlin

private fun setEventCallback(nativeAd: NativeAd) {
  nativeAd.adEventCallback =
    object : NativeAdEventCallback {
      override fun onAdClicked() {
        Log.d(Constant.TAG, "Native ad recorded a click.")
      }
    }
}

Java

private void setEventCallback(NativeAd nativeAd) {
  nativeAd.setAdEventCallback(new NativeAdEventCallback() {
      @Override
      public void onAdClicked() {
        Log.d(Constant.TAG, "Native ad recorded a click.");
      }
  });
}

ImageScaleType

A classe MediaView tem uma propriedade ImageScaleType ao mostrar imagens. Se você quiser mudar a forma como uma imagem é dimensionada no MediaView, defina o ImageView.ScaleType correspondente usando o método setImageScaleType() do MediaView:

Kotlin

nativeAdViewBinding.mediaView.imageScaleType = ImageView.ScaleType.CENTER_CROP

Java

nativeAdViewBinding.mediaView.setImageScaleType(ImageView.ScaleType.CENTER_CROP);

MediaContent

A classe MediaContent contém os dados relacionados ao conteúdo de mídia do anúncio nativo, que é exibido usando a classe MediaView. Quando a propriedade MediaView mediaContent é definida com uma instância MediaContent:

Se um recurso de vídeo estiver disponível, ele será armazenado em buffer e começará a ser reproduzido no MediaView. Para saber se um recurso de vídeo está disponível, verifique hasVideoContent().
Se o anúncio não tiver um recurso de vídeo, o recurso mainImage será baixado e colocado dentro do MediaView.

Destruir um anúncio

Depois de mostrar um anúncio nativo, destrua-o. O exemplo a seguir destrói um anúncio nativo:

Kotlin

nativeAd.destroy()

Java

nativeAd.destroy();

Próximas etapas

Confira os seguintes tópicos:

Privacidade do usuário

Exemplo

Faça o download e execute o exemplo de app que demonstra o uso do SDK de última geração do GMA.

Anúncios nativos Mantenha tudo organizado com as coleções Salve e categorize o conteúdo com base nas suas preferências.

Definir a classe NativeAdView

Layout XML

Jetpack Compose

Processar o anúncio nativo carregado

Kotlin

Java

Mostrar o anúncio nativo

Kotlin

Java

Sobreposição das Opções de Anúncios

Atribuição de anúncio

Processar cliques

Kotlin

Java

ImageScaleType

Kotlin

Java

MediaContent

Destruir um anúncio

Kotlin

Java

Próximas etapas

Exemplo

Anúncios nativos

Definir a classe `NativeAdView`