In-Feed Banner Ads

Note: Google network might not count impressions correctly unless banner is placed within ScrollView component. According to our tests, ads from this network don't detect impressions correctly when ad is presented inside static views. We are not able to fix it because we recognize it as the problem related to React/Google Ads SDK, and as mediation provider, we can't interfere with thirdy party code. That's why we recommend using banner components (when Google networks are used) only placed in ScrollView. Otherwise please be aware the revenue might be affected. For more information, please contact AddApptr Support Team.

In-Feed banner is the type of banner placement aimed at applications using banners within a feed (like news feed for example). It allows for multiple ads to be loaded at the same time.

Creating placement

First, create the in-feed banner placement using the createInFeedBannerPlacement function form the RNAatkit module. You can pass additional configuration like cache size, desired banner sizes to be loaded etc.

#!javascript

import {
    RNAatkit
} from '@addapptr/react-native-aatkit'

...

RNAatkit.createInFeedBannerPlacement(
    "InFeed", 
    {
        cacheSize : 3,
        manualAdSpaceCounting: false,
        bannerSizes: [
            "320x53",
            "300x250"
        ]
    });

Using RNAatkitInFeedBanner component

Use RNAatkitInFeedBanner component to place the banner ad to the UI. Set the name property corresponding the placement name passed to the createInFeedBannerPlacement function.

#!javascript

import {
    RNAatkitInFeedBanner
} from '@addapptr/react-native-aatkit'

...

<RNAatkitInFeedBanner
    name="InFeed" />

Loading at start

You can use reloadOnStart property to load in-feed banner ad right away when RNAatkitInFeedBanner component is added to the UI. AATKit will get an ad from the cache or load it from the server.

#!javascript

import {
    RNAatkitInFeedBanner
} from '@addapptr/react-native-aatkit'

...

<RNAatkitInFeedBanner
    name="InFeed"
    reloadOnStart={true} />

Reloading ads

You can also reload in-feed banner ads which are already added to the UI. Every RNAatkitInFeedBanner component is added to the internal AATKit list. This way you can use those functions for loading:

void reloadAllInFeedBannerComponents(placementName)

void reloadLastInFeedBannerComponent(placementName)

void reloadConcreteInFeedBannerComponents(placementName, indexes)

Please note there is the getInFeedBannerComponentsCount function which might be helpful to determine the size of the list containing RNAatkitInFeedBanner components.

This type of loading banners is recommended when your app has the constant size of in-feed ads and/or you want already visible ads to be reloaded.

RNAatkitInFeedBanner events

You can define functions for onCreate and onShowNewAd events of the RNAatkitInFeedBanner component. Those functions might be a good place to reload in-feed ads.

#!javascript

import {
    RNAatkitInFeedBanner
} from '@addapptr/react-native-aatkit'

...

<RNAatkitInFeedBanner
    name="InFeed"
    onCreate={() => {
        //Component created and attached to the UI
    }}
    onShowNewAd={() => {
        //New ad loaded and presented
    }} />

Cancelling loading ads

When you no longer want the ad to finish loading (for example when moving to another screen), you can cancel the ad request using cancelReloadingInFeedBannerPlacement function.

#!javascript

import {
    RNAatkit
} from '@addapptr/react-native-aatkit'

...

RNAatkit.cancelReloadingInFeedBannerPlacement("InFeed");

Manual adspace counting

If you use manual adspace counting, remember to call countAdSpaceForInFeedBannerPlacement function whenever new adspace should be counted.

#!javascript

import {
    RNAatkit
} from '@addapptr/react-native-aatkit'

...

RNAatkit.countAdSpaceForInFeedBannerPlacement("InFeed");

API

For more details about functions and properties related to the in-feed banner ads, please see the API section on the home page.