Search code examples
androidandroid-recyclerviewadmobandroid-adapternative-ads

How to place Admob Native Advanced Ads in recycler view android?


I want to place the admob native advanced ads in every 3 position of my recycler view in android app.

I would like to use the template provided by Admob.

https://github.com/googleads/googleads-mobile-android-native-templates

Here is XML code implementation of native ads

<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" />

Here is Java code implementation of Admob

   MobileAds.initialize(this, "[_app-id_]");
   AdLoader adLoader = new AdLoader.Builder(this, "[_ad-unit-id_]")
 .forUnifiedNativeAd(new UnifiedNativeAd.OnUnifiedNativeAdLoadedListener() {
   @Override
   public void onUnifiedNativeAdLoaded(UnifiedNativeAd unifiedNativeAd) {
      NativeTemplateStyle styles = new
          NativeTemplateStyle.Builder().withMainBackgroundColor(background).build();

      TemplateView template = findViewById(R.id.my_template);
      template.setStyles(styles);
      template.setNativeAd(unifiedNativeAd);

    }
 })
 .build();

  adLoader.loadAd(new AdRequest.Builder().build());
 }

RecyclerView Adapter Class:

public class ArticleAdapter extends RecyclerView.Adapter<ArticleAdapter.MyViewHolder>{
private Context mContext;
private List<ArticleJson> articleList;
String titleoflist;

public class MyViewHolder extends RecyclerView.ViewHolder {
    TextView txtTitle,txtDesc,txtStatus,txtColor,txtAuthor;
    LinearLayout linearLayout;
    private ArticleJson m_articleJson;

    public MyViewHolder(View view) {
        super(view);
        txtTitle = view.findViewById(R.id.texViewArticleTitle)
        linearLayout = view.findViewById(R.id.article_linearlayout);
    }

    public void bindView(final ArticleJson articleJson){
        m_articleJson = articleJson;
        txtTitle.setText(articleJson.getmTitle());
        txtAuthor.setText(titleoflist);
    }
}

public ArticleAdapter(Context mContext, List<ArticleJson> articleList,String titleoflist) {
    this.mContext = mContext;
    this.articleList = articleList;
    this.titleoflist = titleoflist;
}

@NonNull
@Override
public ArticleAdapter.MyViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {

    View itemView = LayoutInflater.from(parent.getContext())
          .inflate(R.layout.list_item_article, parent, false);
   return new ArticleAdapter.MyViewHolder(itemView);
}

@Override
public void onBindViewHolder(@NonNull ArticleAdapter.MyViewHolder holder, int position) {
final ArticleJson articleJson = articleList.get(position);
    holder.bindView(articleJson);
    holder.linearLayout.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
      //Toast
    }
});
}

@Override
public int getItemCount() {
    return articleList.size();
}
}

Solution

  • First, you need to create the Ads container item_ads.xml folder

    <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" />
    

    Second, your recyclerview adapter must extends the following

     extends RecyclerView.Adapter<RecyclerView.ViewHolder> 
    

    Now you need to override 4 methods

    public RecyclerView.ViewHolder onCreateViewHolder()

    public void onBindViewHolder()

    public int getItemCount()

    public int getItemViewType()

    In the getItemViwType() method, We will define two possibilities

    @Override
    public int getItemViewType(int position) {     
        if (AD_LOGIC_CONDITION)) {
            return AD_TYPE;
        } else{  
            return CONTENT_TYPE; ///do not forget to initialize any of AD_TYPE and CONTENT_TYPE
        }
    }
    

    then we will create two view holders, one for your content and second for your Ads I assume that you know how to create your view holder so I will just explain the AD View holder

    class adViewHolder extends RecyclerView.ViewHolder {
            TemplateView Adtemplate;
    
            public adViewHolder(@NonNull View itemView) {
                super(itemView);
                Adtemplate = itemView.findViewById(R.id.my_template);
            } 
    

    Now we return to the onCreateViewHolder() method

    public RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
    
            if (viewType == AD_TYPE) {
                adViewHolder madViewHolder = new adViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.item_ads, null, false));
                return madViewHolder;
            } else{
                YourViewHolder mYourViewHolder = new YourViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.recycler_item, null, false));
                return mYourViewHolder;
            }
    }
    

    now we go to the onBindViewHolder() method

     @Override
            public void onBindViewHolder(@NonNull final RecyclerView.ViewHolder holder, int position) {
                if (getItemViewType(position) == TYPE_CONTENT) {
                    ///your data 
    // AN EXAMPLE
                    ((YourViewHolder) holder).textview.setText(data.getmtext());
                    ((YourViewHolder) holder).Img.setImageResource(data.getmImg());
                    ((YourViewHolder) holder).title.setText(data.getmName());
                } else if (getItemViewType(position) == TYPE_AD){
        
                    final AdLoader adLoader = new AdLoader.Builder(context, "ca-app-pub-3940256099942544/2247696110")
                            .forUnifiedNativeAd(new UnifiedNativeAd.OnUnifiedNativeAdLoadedListener() {
                                @Override
                                public void onUnifiedNativeAdLoaded(UnifiedNativeAd unifiedNativeAd) {
                                    // Show the ad.
                                    NativeTemplateStyle styles = new
                                            NativeTemplateStyle.Builder().build();
        
                                    TemplateView template = ((adViewHolder) holder).Adtemplate;
                                    template.setStyles(styles);
                                    template.setNativeAd(unifiedNativeAd);
        
                                }
                            })
                            .withAdListener(new AdListener() {
                                @Override
                                public void onAdFailedToLoad(int errorCode) {
                                    // Handle the failure by logging, altering the UI, and so on.
                                }
                            })
                            .withNativeAdOptions(new NativeAdOptions.Builder()
                                    // Methods in the NativeAdOptions.Builder class can be
                                    // used here to specify individual options settings.
                                    .build())
                            .build();
                    adLoader.loadAd(new AdRequest.Builder().build());
        
        
                }