Esta página foi traduzida pela API Cloud Translation.

Anúncios nativos

Quando um anúncio nativo é carregado, o SDK dos Anúncios para Dispositivos Móveis do Google (Beta) 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("/21775744923/example/native", 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("/21775744923/example/native", 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 dos Anúncios para Dispositivos Móveis do Google (beta) 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 automaticamente processe 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 para criativos de preenchimento nativo (limitado a um grupo selecionado de publishers no momento)

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 Google Mobile Ads SDK (beta) 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 Google Mobile Ads SDK (beta) 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

Quando um anúncio de preenchimento é retornado, uma sobreposição das Opções de Anúncios é adicionada como visualização pelo SDK. Se seu app usar o preenchimento de anúncios nativos, deixe um espaço no canto escolhido da visualização do anúncio nativo para a inserção automática do logo. Além disso, a sobreposição das Opções de Anúncios precisa ser visível. Escolha cores de fundo e imagens adequadas. Para mais informações sobre a aparência e a função da sobreposição, consulte as diretrizes de implementação de anúncios programáticos nativos.

Atribuição para anúncios programáticos nativos

Ao veicular anúncios programáticos nativos, você precisa mostrar uma atribuição para indicar que a visualização é uma publicidade. Consulte as diretrizes da política para mais informações.

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 dos Anúncios para Dispositivos Móveis do Google (beta):

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 na 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();

Testar o código de anúncio nativo

Anúncios de vendas diretas

Se você tiver interesse em testar anúncios nativos de vendas diretas, use este ID de bloco de anúncios do Ad Manager:

/21775744923/example/native

Ele foi configurado para veicular amostras de anúncios de instalação do app e de conteúdo, além de um formato de anúncio nativo personalizado com os seguintes recursos:

Título (texto)
MainImage (imagem)
Legenda (texto)

O ID de modelo do formato de anúncio nativo personalizado é 10063170.

Anúncios de preenchimento nativos

O preenchimento do Ad Exchange está disponível apenas para um grupo selecionado de publishers. Para testar o comportamento de anúncios de preenchimento nativos, use este bloco de anúncios do Ad Manager:

/21775744923/example/native-backfill

Ele exibe amostras de anúncios de instalação do app e de conteúdo que incluem a sobreposição das Opções de Anúncios.

Não se esqueça de atualizar seu código para que ele consulte os IDs do modelo e do bloco de anúncios reais antes de ser executado.

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 dos anúncios para dispositivos móveis do Google (Beta).

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 para anúncios programáticos nativos

Processar cliques

Kotlin

Java

ImageScaleType

Kotlin

Java

MediaContent

Destruir um anúncio

Kotlin

Java

Testar o código de anúncio nativo

Anúncios de vendas diretas

Anúncios de preenchimento nativos

Próximas etapas

Exemplo

Anúncios nativos

Definir a classe `NativeAdView`