Inserting a banner ad into an Android project using XML


Note: anything related to Android will be categorised in the Java section.

Personally, I find that the easiest method to insert an advertisement banner into your android app is to use XML.  But first lets recap what we need before we insert an ad into our app.

  1. An AdMob account with a unique publisher id, it will look like this: ca-app-pub-xxxxxxxxxxxxxxxx/xxxxxxxxxx
  2. Google Play Services SDK, this is now obtained through the Eclipse IDE (if you are using the Android SDK)
  3. Once you have obtained the Google Play Services SDK, go ahead in import the package by right clicking on your project folder, then Import, then Android->Existing Android Code Into Workspace. The navigate to where your android sdk folder is, you will find the google play services library in this directory (depending on where your sdk folder is): C:\adt-bundle-windows…\sdk\extras\google\google_play_services\librpoject
  4. Right click again on your project folder, and click on Properties, then go to Android, and then on the lower part of the window there is a Library box and just click “Add” and add the google-play-services_lib, click OK afterwards
  5. In your AndroidManifest.xml file, go to the XML view and add the following lines of code:
<meta-data android:name="com.google.android.gms.version"
               android:value="@integer/google_play_services_version"/>
<!-- insert the code below after the </application> tag -->
<uses-permission android:name="android.permission.INTERNET"/>
  <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>

The steps to insert an ad using XML is a lot easier than using the Java approach, however, we will need to use a little Java to request the ad to display.

  1. Go to wherever your layout xml file is for your activity screen, on Eclipse its inside the res\layout folder.
  2. There’s two interfaces, Graphical Layout and XML, go to the XML editor
  3. Add this inside your layout (doesnt matter if you have RelativeLayout or LinearLayout): <com.google.android.gms.ads.AdView />
  4. See sample code posted below, it creates a banner ad that is positioned at the very bottom of the activity screen…
<!-- put this code below inside the layout braces like so: <RelativeLayout  insert code here > -->
xmlns:android="<a class="linkification-ext" title="Linkification: http://schemas.android.com/apk/res/android" href="http://schemas.android.com/apk/res/android">http://schemas.android.com/apk/res/android</a>"

<!-- put the code below within the layout tags like so: <LinearLayout> insert code here </LinearLayout> -->
<com.google.android.gms.ads.AdView
android:id="@+id/adView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
ads:adSize="BANNER"
android:layout_centerHorizontal="true"
ads:adUnitId="ca-app-pub-xxxxxxxxxxxxxxxx/xxxxxxxxxx"
ads.loadAdOnCreate="true"/>

In the Java activity file where the onCreate() function is, insert this piece of code inside the function:

@Override
protected void onCreate(Bundle savedInstanceState)
{
        super.onCreate(savedInstanceState);
	setContentView(R.layout.activity_summary_screen);

        AdView banner = (AdView) findViewById(R.id.adView);//create the AdView object and find the adView

        AdRequest ad_req = new AdRequest.Builder().build();//build

	banner.loadAd(ad_req);//load the ad when the activity loads
}
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s