Sunday, 5 October 2014

Integrate Applovin banner ad in IOS





Applovin SDK for monetization of smartphone is an another better alternative for the app developers. Recently I got a project and my Project manager asks me to integrate different ad networks that are available for smartphone app monetization. So when I started integrating Applovin SDK, I comfortably integrated popover ads, but had some tough ask when adding a banner ad. In this post we are going to learn that how can we integrate a banner ad using the Applovin SDK for IOS.

Log on to your Applovin account from here

 https://www.applovin.com/index

Applovin does not require you to create an app as they provide key per your account.So no need to create and app, let us jump to its integration as we have key with us

Follow some of integration steps found here, they are relatively simple

https://www.applovin.com/integration#iosIntegration

Once you are done with its integration setup like adding frameworks, adding key in info.plist file. We can start adding code to our files. Though you can add banner in. xib file too, and it's an easy process. But I will add it programatically,

Import two files in your ViewController.h  file


#import "ALAdView.h"

#import "ALAdLoadDelegate.h"

Then create an instance of ALAdView class, we named it as adView.  Create one more instance of ALAd and named it cachedAd a this is the ad we got from the server and will display in our adView.

     ALAdView *adView;
    ALAd* cachedAd;

Add declaration of ALAdLoadDelegate, that we are going to implement.

ViewController.h


Now open up your ViewController.m  and in its viewDidLoad and call  loadNextAd method of  ALSdk shared instance. 

    [[[ALSdk shared] adService] loadNextAd: [ALAdSize sizeBanner] andNotify: self];

You can give different size for banner, as Applovin offer these styles

 320x50 ads added to the bottom of the view.
 sizeBanner;

 Interstitials are full-screen ads
 sizeInterstitial;

 320x250 (mostly square) advertisements.
 sizeMRec;

 728x90 ads intended for iPads.
 sizeLeader;

Now its time to add our delegate methods so that we can add our view only at the time we receive ad from the server and not otherwise.

-(void) adService:(ALAdService *)adService didLoadAd:(ALAd *)ad
{
    cachedAd = ad;
    adView = [[ALAdView alloc]initWithFrame:CGRectMake(0, self.view.frame.size.height-50, 320, 50)];
    [adView render:cachedAd];
    [self.view addSubview:adView];
    
}

-(void) adService:(ALAdService *)adService didFailToLoadAdWithError:(int)code
{
    if(code == kALErrorCodeNoFill)
    {
        // Indicates that no ads are currently eligible for your device & location.
    }
    else
    {
        // Unable to reach AppLovin; the user's device likely has poor connectivity.
    }
}

ViewController.m

Above didLoadAd will get called when ad was received from the server, so we assign ad received from the server to our cachedAd instance.Then we allocate our adView instance with the frames of the locations where we want to show our ad, we are showing it in the bottom of the screen.
To add our cachedAd to adView, we will use render method and that will render our Applovin ad to the adView and finally we will add our adView as a subview to our main view. 

didFailToLoadAdWithError will get called when there was no ad or internet connection is not available to connect to server.

Run your project, and if everything goes ok then the project will compile without any error. Go to your Applovin dashboard and you will see your app listed there. NOTE: It will take some time for app to be appeared in dashboard.

You will not see any ad during test mode as it is turned off by default. You have to turn it on from Applovin dashboard. Shown in the picture

Applovin App Dashboard

Run your project again and you will see Applovin ads displayed.

Demo of simulator running Applovin banner ad

NOTE: It will take some time to display ad when you turn test mode on in the dashboard



SOURCE CODE: Download copy from here


No comments:
Write comments