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

Viewed 13642

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

I would like to 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();
}
}
3 Answers

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

MainActivity.java

    RecyclerView rvContacts = (RecyclerView) findViewById(R.id.rvContacts);

    // Initialize contacts
   contacts = Contact.createContactsList(20);

    // Create adapter passing in the sample user data
   ContactsAdapter adapter = new ContactsAdapter(contacts);

    //Build the native adapter from the current adapter
    AdmobNativeAdAdapter admobNativeAdAdapter=AdmobNativeAdAdapter.Builder.with(
            "ca-app-pub-3940256099942544/2247696110",//admob native ad id
            adapter,//current adapter
            "small"//Set the size "small", "medium" or "custom"
            ).adItemInterval(5)//Repeat interval
            .build();


    // Attach the new adapter to the recyclerview to populate items
    rvContacts.setAdapter(admobNativeAdAdapter);

    // Set layout manager to position the items
    rvContacts.setLayoutManager(new LinearLayoutManager(this));
}

MORE READ RecyclerView-Native-ads-Example-Github

Place Admob Native Advanced Ads in recyclerview Place Admob Native Advanced Ads in recycler view

in Your article list, fill every third entry with "null" values (or "Ad" String value if You want).

in Your Adapter set for list entries with "null" values content_type = "AD_TYPE":

    @Override
    public int getItemViewType(int position) {     
        if (yourList.get(position).getArticle().equals("null")) {
            ADPosition = position;
            return AD_TYPE;
        }
        return CONTENT_TYPE;
    }

and in Your ViewHolderClass set AD_Layout for AD_TYPE Entries and normal layout for CONTENT_TYPE entries.

@Override
public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
if (viewType == CONTENT_TYPE) {
    itemView = LayoutInflater.from(parent.getContext())
                .inflate(R.layout.normalLayoutRecyclerView,prent,false);
    return new MyViewHolder(itemView)
}
if (viewType == AD_TYPE) {
itemView = LayoutInflater.from(parent.getContext())
                .inflate(R.layout.ad_layout, parent, false);
}

return new MyViewHolder(itemView)

}

Hope that helps.

GGK

Related