Modelos nativos

Fazer o download de modelos nativos

Com os anúncios nativos, você pode personalizar seus anúncios e oferecer uma experiência melhor aos usuários. Melhores experiências do usuário podem aumentar o engajamento e melhorar seu rendimento geral.

Para aproveitar ao máximo os anúncios nativos, é importante estilizar os layouts de anúncio para que pareçam uma extensão natural do seu app. Para ajudar você a começar, criamos modelos nativos.

Os modelos nativos são visualizações completas de código para seus anúncios nativos, projetadas para implementação rápida e modificação fácil. Com os modelos nativos, é possível implementar seu primeiro anúncio nativo em apenas alguns minutos e personalizar rapidamente a aparência sem muito código. Você pode colocar esses modelos em qualquer lugar, como em uma visualização de reciclagem usada em um feed de notícias, em uma caixa de diálogo ou em qualquer outro lugar do app.

Nossos modelos nativos são fornecidos como um módulo do Android Studio. Assim, é fácil incluí-los no seu projeto e usá-los como quiser.

Tamanhos de modelo

Há dois modelos: pequeno e médio. Ambos usam a classe TemplateView e têm uma proporção fixa. Elas serão dimensionadas para preencher a largura das visualizações principais.

Modelo pequeno

@layout/gnt_small_template_view

O modelo pequeno é ideal para visualizações de reciclagem ou sempre que você precisar de uma visualização de anúncio retangular longa. Por exemplo, você pode usar para anúncios In-feed.

Modelo médio

@layout/gnt_medium_template_view

O modelo médio foi criado para ser uma visualização de página de metade a três quartos, mas também pode ser usado em feeds. É bom para páginas de destino ou de abertura.

Teste diferentes posições. É claro que você também pode mudar o código-fonte e os arquivos XML para atender aos seus requisitos.

Como instalar os modelos de anúncios nativos

Para instalar os modelos nativos, basta baixar o arquivo ZIP (usando a opção Clonar ou fazer o download no GitHub) e importar o módulo para seu projeto atual do Android Studio.

1. Escolha File > New > Import Module.

2. Selecione a pasta nativetemplates.

   

3. Adicione a seguinte linha ao arquivo build.gradle no nível do app:

   dependencies {
           ...
           implementation project(':nativetemplates')
           ...
   }
   

Como usar os modelos de anúncios nativos

Você pode usar o modelo em qualquer arquivo XML de layout, como qualquer outro grupo de visualizações.

Usar os modelos é um processo de duas etapas:

1. Primeiro, inclua o modelo como parte do seu layout.

   <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"
      tools:showIn="@layout/activity_main" >
   
   <!--  This is your template view -->
   <com.google.android.ads.nativetemplates.TemplateView
      android:id="@+id/my_template"
      <!-- this attribute determines which template is used. The other option is
       @layout/gnt_medium_template_view -->
      app:gnt_template_type="@layout/gnt_small_template_view"
      android:layout_width="match_parent"
      android:layout_height="match_parent" />
   
   ...
   </LinearLayout>
   

2. Em seguida, você precisa dar o modelo ao anúncio nativo quando ele for carregado:

   MobileAds.initialize(this);
   AdLoader adLoader = new AdLoader.Builder(this, "ca-app-pub-3940256099942544/2247696110")
       .forNativeAd(new NativeAd.OnNativeAdLoadedListener() {
           @Override
           public void onNativeAdLoaded(NativeAd nativeAd) {
               NativeTemplateStyle styles = new
                 NativeTemplateStyle.Builder().withMainBackgroundColor(background).build();
               TemplateView template = findViewById(R.id.my_template);
               template.setStyles(styles);
               template.setNativeAd(nativeAd);
           }
        })
        .build();
   
   adLoader.loadAd(new AdRequest.Builder().build());
   

Chaves do dicionário de estilos

Há duas maneiras de estilizar seu modelo: usando o XML de layout tradicional e usando nosso objeto NativeTemplateStyle.Builder. O exemplo de código acima demonstra como usar o objeto NativeTemplateStyle.Builder para definir a cor principal do plano de fundo, mas há várias outras opções também. Confira todos os métodos de builder disponíveis. O builder retorna um objeto NativeTemplateStyle que substitui qualquer estilo de layout XML. Os layouts XML gnt_small_template.xml e gnt_medium_template.xml usam os mesmos parâmetros de estilo do Android que você já conhece.

Contribuir

Criamos modelos nativos para ajudar você a desenvolver anúncios nativos rapidamente. Gostaríamos que você contribuísse com nosso repositório do GitHub para adicionar novos modelos ou recursos. Envie uma solicitação de envio para que possamos analisar.