Banner ads provide a great way to add an additional revenue stream with minimal impact to the flow and usage of your app.

The MobileFuse SDK also supports delivery of expandable rich-media banner ads by default, which are more interactive and engaging than standard banner placements.

Prerequisites

Follow the initial integration guide: Integrate the MobileFuse SDK for Android
Ensure that you have a Banner Ad Placement ID to use.

Display a banner ad in your app

A banner ad is implemented into your app as a UI View - you therefore have two options for implementation - either you can adjust your applications layout XML to include a position for your banner ad, or you can programmatically create, add, and remove the banner ad view as needed.

Info
Note: Ensure that you adjust the user interface of your app to account for the positioning of the banner. You should leave a margin between the displayed banner ad and your app UI to avoid potential mis-clicks on the ad creative.

Option 1. Create the banner ad in your layout XML

Option 2. Create the banner ad programatically

Option 1: Create a banner ad in your layout XML

1. In your Activity’s XML layout file, add a banner view:

Code Block

language	xml

<com.mobilefuse.sdk.MobileFuseBannerAd
    app:mobilefusePlacementId="[INSERT PLACEMENT ID HERE]"
    app:mobilefuseAdSize="BANNER_320x50"
    
    android:id="@+id/mf_banner_ad"
    android:layout_width="match_parent"
    android:layout_height="50dp"

    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    />

Ensure that you replace <YOUR BANNER PLACEMENT ID> with a valid banner placement ID.

Info

Note: Valid banner ad sizes are:

BANNER_320x50
BANNER_300x50
BANNER_300x250
BANNER_728x90

2. Once you have initialized the MobileFuse SDK, request that the banner ad is loaded into the view. A good place to do this is within the onInitSuccess callback, but you also may want to call it when sub-activities are created:

Code Block

language	java

MobileFuseBannerAd banner = findViewById(R.id.mf_banner_ad);
banner.loadAd();

Option 2: Create the Banner Ad programmatically

Once the MobileFuse SDK has initialized, create the MobileFuseBannerAdinstance and add it to your activity’s view hierarchy:

Code Block

language	java

String bannerPlacementId = "000000";
MobileFuseBannerAd banner = new MobileFuseBannerAd(this, bannerPlacementId, BannerAd.AdSize.BANNER_728x90);

ViewGroup bannerContainer = findViewById(R.id.adContainer);
bannerContainer.addView(banner);

banner.loadAd();

Listening for event callbacks

Optionally, you can create a BannerAdListener to receive events during the banner ad’s lifecycle.

Code Block

language	java

banner.setListener(new MobileFuseBannerAd.Listener() {
    @Override
    public void onAdExpanded() {
        // Called when an 'expandable banner' placement is expanded to full-screen
    }

    @Override
    public void onAdCollapsed() {
        // Called when an 'expandable banner' placement is collapsed back from full-screen
    }

    @Override
    public void onAdLoaded() {
        // Called when a banner ad is successfully loaded
    }

    @Override
    public void onAdNotFilled() {
        // The ad server responded with no fill (no ad available)
    }

    @Override
    public void onAdRendered() {
        // The banner has been rendered and displayed to the user
    }

    @Override
    public void onAdClicked() {
        // Triggered when the user clicks on the banner ad
    }

    @Override
    public void onAdExpired() {
        // The banner ad has expired and a new ad should be loaded from the server
    }

    @Override
    public void onAdError(AdError adError) {
        // An error occured - examine the adError argument for further details
    }
});

Advanced: Configure Ad Rotation

Banner ads can be set to rotate on a pre-set time interval. This is useful to increase the number of banner impressions that will be shown to your users. By default banner ad rotation is disabled.

Example: Configure ad to refresh every 60 seconds:

Code Block
banner.setAutorefreshEnabled(true); banner.setAutorefreshInterval(60);

Example: Manually handle refreshing of the ad, for example you may want to fetch a new ad when a view is changed within your app:

Code Block
// On view change: banner.forceRefresh();

Advanced: Set the ad background color

When the ad creative doesn’t fill the entire view area - for example when the view spans the entire width of the screen - the ad will sometimes be centred within the view. You can configure the background color of the view behind the ad to match the style of your app - or you can set it to transparent. The default behaviour is for the view to be transparent.

Setting the background in XML Layout:

Simply set the android:background attribute in the MobileFuseBannerAd tag in your Layout XML. The MobileFuse SDK exposes some useful colors to your project, but you can also use any theme or values color.

Code Block

language	xml

<com.mobilefuse.sdk.MobileFuseBannerAd
    //...
    android:background="@color/mobilefuse_transparent"
    />

Also available: mobilefuse_black, mobilefuse_white and mobilefuse_default_banner_bg

Setting the background programmatically:

You can also set the background color of the banner view programmatically:

Code Block

language	java

// Set to a specific argb color:
bannerAd.setBackgroundColor(0xFFFF0000);

// Use a resource color:
bannerAd.setBackgroundResource(R.color.purple_200);

// Use a drawable resource/image:
bannerAd.setBackgroundResource(R.drawable.example_drawable_resource);

// Advanced - retrieve app theme color:
TypedValue resolvedThemeColor = new TypedValue();
getTheme().resolveAttribute(R.attr.colorSecondary, resolvedThemeColor, true);
bannerAd.setBackgroundResource(resolvedThemeColor.resourceId);

Example Code

Java

Expand

title	activity_main.xml

Code Block

language	xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <com.mobilefuse.sdk.MobileFuseBannerAd
        android:id="@+id/mf_banner_ad"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        app:mobilefuseAdSize="BANNER_320x50"
        app:mobilefusePlacementId="418310"

        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        />

</androidx.constraintlayout.widget.ConstraintLayout>

Expand

title	MainActivity.java

Code Block

language	java

import android.app.Activity;
import android.os.Bundle;
import android.util.TypedValue;
import android.widget.Toast;

import com.mobilefuse.sdk.MobileFuse;
import com.mobilefuse.sdk.MobileFuseBannerAd;
import com.mobilefuse.sdk.SdkInitListener;
import com.mobilefuse.sdk.privacy.MobileFusePrivacyPreferences;

public class MainActivity extends Activity {
    final int publisherId = 0;
    final int appId = 0;
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        // Set up the user's privacy preferences before init:
        MobileFuse.setPrivacyPreferences(
                new MobileFusePrivacyPreferences.Builder()
                        .setSubjectToCoppa(false)
                        .setUsPrivacyConsentString("1YNN")
                        .build()
        );
    
        Activity activity = this;
        MobileFuse.init(activity, publisherId, appId, new SdkInitListener() {
            @Override
            public void onInitSuccess() {
                Toast.makeText(activity, "SDK Init Success", Toast.LENGTH_SHORT).show();
    
                // Load our banner ad instance:
                MobileFuseBannerAd bannerAd = findViewById(R.id.mf_banner_ad);
                bannerAd.loadAd();
                
                // Set up auto-refresh each minute:
                bannerAd.setAutorefreshEnabled(true);
                bannerAd.setAutorefreshInterval(60);
                
                // Set our background color to match the app theme:
                TypedValue resolvedThemeColor = new TypedValue();
                getTheme().resolveAttribute(R.attr.colorPrimary, resolvedThemeColor, true);
                bannerAd.setBackgroundResource(resolvedThemeColor.resourceId);
            }
            
            @Override
            public void onInitError() {
                Toast.makeText(activity, "SDK Init Failed", Toast.LENGTH_SHORT).show();
            }
        });
    }
}

Kotlin

Expand

title	activity_main.xml

Code Block

language	xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <com.mobilefuse.sdk.MobileFuseBannerAd
        android:id="@+id/mf_banner_ad"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        app:mobilefuseAdSize="BANNER_320x50"
        app:mobilefusePlacementId="418310"

        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        />

</androidx.constraintlayout.widget.ConstraintLayout>

...

title	MainActivity.kt

...

language	kotlin

...

This page has moved to our new documentation:

...

Versions Compared

Old Version 16

New Version Current

Key

Prerequisites

Display a banner ad in your app

Option 1: Create a banner ad in your layout XML

Option 2: Create the Banner Ad programmatically

Listening for event callbacks

Advanced: Configure Ad Rotation

Advanced: Set the ad background color

Setting the background in XML Layout:

Setting the background programmatically:

Example Code

Java

Kotlin

Page Comparison

Versions Compared

Old Version 16

New Version Current

Key

Prerequisites

Display a banner ad in your app

Option 1: Create a banner ad in your layout XML

Option 2: Create the Banner Ad programmatically

Listening for event callbacks

Advanced: Configure Ad Rotation

Advanced: Set the ad background color

Setting the background in XML Layout:

Setting the background programmatically:

Example Code

Java

Kotlin