Facebook Native ads in recycler view android

Question

I am wondering if anyone has tried to integrate facebook audience network native ads in recycler view ??

Is there any simple solution like mopub recycler view adapter https://github.com/mopub/mopub-android-sdk/wiki/Native-Ads-with-Recycler-View for facebook audience network native ads ??

Answer 1

I create a lib for loading Facebook Native Ad in Adapter.

https://github.com/ldt116/FBNativeAdAdapter

You can check the example

MyAdapter adapter = new MyAdapter();
FBNativeAdAdapter fbAdapter = FBNativeAdAdapter.Builder.with(PLACEHOLDER_ID, adapter).build();

RecyclerView rv = (RecyclerView) findViewById(R.id.rv);
rv.setAdapter(fbAdapter);
rv.setLayoutManager(new LinearLayoutManager(this));

Any idea or comments are welcome

Answer 2

I've implement facebook nativead using recylerview. Here what i do:

(1) Define a customized layout to hold native ad

(2) Pre-load native ads in onCreate() through NativeAdsManager

(3) Overwrite onCreateViewHolder() in the adapter to insert ad's view and normal item view:

@Override
public CustomViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {
    if (i == 4) {
        view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.native_ad, null);
    }
    else {
        view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.normal_item, null);
    }
    CustomViewHolder viewHolder = new CustomViewHolder(view);
    return viewHolder;
}

(4) Overwrite onBindViewHolder() in the adapter to bind the native ad data:

@Override
public void onBindViewHolder(ViewGroup viewGroup, int i) {
    if (i == 4) {
         customViewHolder.adTitleView.setText(nativeAd.getTitle()));
         ...
    }
    else {
        customViewHolder.textView.setText(normalItem.getTitle()));
        ...
    }
}

Hope this will help you get started.

Answer 3

Here is the example from Facebook itself: NativeAdRecyclerAdapter

package com.facebook.samples.AdUnitsSample.adapters;

import android.app.Activity;
import android.support.v7.widget.RecyclerView;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.TextView;

import com.facebook.ads.AdOptionsView;
import com.facebook.ads.MediaView;
import com.facebook.ads.NativeAd;
import com.facebook.ads.NativeAdLayout;
import com.facebook.ads.NativeAdsManager;
import com.facebook.samples.AdUnitsSample.R;
import com.facebook.samples.AdUnitsSample.models.RecyclerPostItem;

import java.util.ArrayList;
import java.util.List;

public class NativeAdRecyclerAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
    private List<RecyclerPostItem> mPostItems;
    private List<NativeAd> mAdItems;
    private NativeAdsManager mNativeAdsManager;
    private Activity mActivity;

    private static final int AD_DISPLAY_FREQUENCY = 5;
    private static final int POST_TYPE = 0;
    private static final int AD_TYPE = 1;

    public NativeAdRecyclerAdapter(Activity activity,
                                   List<RecyclerPostItem> postItems, NativeAdsManager
            nativeAdsManager) {
        mNativeAdsManager = nativeAdsManager;
        mPostItems = postItems;
        mAdItems = new ArrayList<>();
        mActivity = activity;
    }

    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        if (viewType == AD_TYPE) {
            NativeAdLayout inflatedView = (NativeAdLayout) LayoutInflater.from(parent.getContext())
                    .inflate(R.layout.native_ad_unit, parent, false);
            return new AdHolder(inflatedView);
        } else {
            View inflatedView = LayoutInflater.from(parent.getContext()).inflate(R.layout
                    .recycler_post_item, parent, false);
            return new PostHolder(inflatedView);
        }
    }

    @Override
    public int getItemViewType(int position) {
        return position % AD_DISPLAY_FREQUENCY == 0 ? AD_TYPE : POST_TYPE;
    }

    @Override
    public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
        if (holder.getItemViewType() == AD_TYPE) {
            NativeAd ad;

            if (mAdItems.size() > position / AD_DISPLAY_FREQUENCY) {
                ad = mAdItems.get(position / AD_DISPLAY_FREQUENCY);
            } else {
                ad = mNativeAdsManager.nextNativeAd();
                if (!ad.isAdInvalidated()) {
                    mAdItems.add(ad);
                } else {
                    Log.w(NativeAdRecyclerAdapter.class.getSimpleName(), "Ad is invalidated!");
                }
            }

            AdHolder adHolder = (AdHolder) holder;
            adHolder.adChoicesContainer.removeAllViews();

            if (ad != null) {

                adHolder.tvAdTitle.setText(ad.getAdvertiserName());
                adHolder.tvAdBody.setText(ad.getAdBodyText());
                adHolder.tvAdSocialContext.setText(ad.getAdSocialContext());
                adHolder.tvAdSponsoredLabel.setText(R.string.sponsored);
                adHolder.btnAdCallToAction.setText(ad.getAdCallToAction());
                adHolder.btnAdCallToAction.setVisibility(
                    ad.hasCallToAction() ? View.VISIBLE : View.INVISIBLE);
                AdOptionsView adOptionsView =
                    new AdOptionsView(mActivity, ad, adHolder.nativeAdLayout);
                adHolder.adChoicesContainer.addView(adOptionsView, 0);

                List<View> clickableViews = new ArrayList<>();
                clickableViews.add(adHolder.ivAdIcon);
                clickableViews.add(adHolder.mvAdMedia);
                clickableViews.add(adHolder.btnAdCallToAction);
                ad.registerViewForInteraction(
                        adHolder.nativeAdLayout,
                        adHolder.mvAdMedia,
                        adHolder.ivAdIcon,
                        clickableViews);
            }
        } else {
            PostHolder postHolder = (PostHolder) holder;

            //Calculate where the next postItem index is by subtracting ads we've shown.
            int index = position - (position / AD_DISPLAY_FREQUENCY) - 1;

            RecyclerPostItem postItem = mPostItems.get(index);
            postHolder.tvPostContent.setText(postItem.getPostContent());
        }
    }

    @Override
    public int getItemCount() {
        return mPostItems.size() + mAdItems.size();
    }

    private static class PostHolder extends RecyclerView.ViewHolder {

        TextView tvPostContent;

        PostHolder(View view) {
            super(view);
            tvPostContent = view.findViewById(R.id.tvPostContent);
        }
    }

    private static class AdHolder extends RecyclerView.ViewHolder {

        NativeAdLayout nativeAdLayout;
        MediaView mvAdMedia;
        MediaView ivAdIcon;
        TextView tvAdTitle;
        TextView tvAdBody;
        TextView tvAdSocialContext;
        TextView tvAdSponsoredLabel;
        Button btnAdCallToAction;
        LinearLayout adChoicesContainer;

        AdHolder(NativeAdLayout adLayout) {
            super(adLayout);

            nativeAdLayout = adLayout;
            mvAdMedia = adLayout.findViewById(R.id.native_ad_media);
            tvAdTitle = adLayout.findViewById(R.id.native_ad_title);
            tvAdBody = adLayout.findViewById(R.id.native_ad_body);
            tvAdSocialContext = adLayout.findViewById(R.id.native_ad_social_context);
            tvAdSponsoredLabel = adLayout.findViewById(R.id.native_ad_sponsored_label);
            btnAdCallToAction = adLayout.findViewById(R.id.native_ad_call_to_action);
            ivAdIcon = adLayout.findViewById(R.id.native_ad_icon);
            adChoicesContainer = adLayout.findViewById(R.id.ad_choices_container);
        }
    }
}