Add Facebook Audience Network Native Ads in Recycler View

Native Ad is a form of advertising where they matches the look and style of content and view. Unlike other ad formats like banners they mix and match with the content in the view. Therefore they are more effective and overcome banner blindness. We are going to take a look at Facebook Audience Network native ads implementation in Android Recycler View.

 

Create Facebook App

  • Create a new or existing Facebook app
  • Add new product Audience Network
  • Create Native Ad placement for Android platform

Android Studio Setup

  • Create new android studio project
  • Add FAN dependency in build.gradle file

Open AndroidManifest.xml file and add networkSecurityConfig parameter in application tag

Android Network Security Config

Starting Android P unencrypted HTTP is blocked by default. This will affect the caching of Facebook ads as FAN uses localhost to cache ads. To solve this issue you can whitelist localhost ip in network security config file.

Create a new xml file network_security_config.xml inside res -> xml folder.

Add this configuration in application tag as shown in the code snippet above.

Audience Network Ads Setup

Initialize FAN(Facebook Audience Network) ads in the main activity.

Layout Files

Lets create our activity layout where we will have RecyclerView to hold our data and native ads.

activity_main.xml

native_ads_row_data.xml

native_ads_row.xml

Setup RecyclerView

Setup Native Ads RecyclerView.Adapter

We will use NativeAdsManager to fetch a set of native ads. NativeAdsManager can fetch upto a max of 10 native ads to be displayed in our view.

Once ads are loaded we will add these native ads in our data array.

Time to create our viewholders and bind data with the views.

We will create two viewholders for our data and another for native ad view.

We need to differentiate between our data item and native ad item. The item view type returns the type of item being created.

Full source code of adapter file.

If you have any suggestion or query do comment below. You can also check my other guide on how to add Facebook Account Kit in Android for user authentication.

One Response

  1. BhaumikMistry June 24, 2019

Leave a Reply

%d bloggers like this: