07 February 2012

How To: Create an Android App with AdMob Ads

NB: As of 1st May 2012 AdMob for mobile websites is discontinued. Use AdSense for mobile websites. AdMob is still valid for mobile applications however.

I found the documentation or a simple “How To” to get a simple Android App with AdMob ads lacking so here are my notes for reference (AdMob SDK 4.3.1). It’s a long post but it’s explicit so hopefully you should find it easy to follow.
Get the AdMob Publisher ID and SDK
  1. Choose an App Name and a package name e.g. com.coultard.Test (Java package names are domain names in reverse by convention to enforce uniqueness).
  2. Sign up for an Admob Account at http://www.admob.com
    1. Go to Sites and “Add Site/Apps”
    2. Choose Android App
    3. Enter App Name, Package Url (e.g. market://details?id=com.coultard.Test) and other details.
  3. Get the AdMob SDK and “Publisher Id”:
    1. Under Apps/Sites; Click on your application, click ‘Manage Settings’. Publisher Id is listed under the title and the SDK is available under “Get Publisher Code”. Personally I find this navigation obscure.
    2. Download and extract the SDK
Create an App
I have covered getting started with eclipse and Android Apps in another post here. Follow that and the Hello World example. Load up that app or create a new one and follow these directions (or the official ones):
  1. Import The AdMob SDK:
    1. In Eclipse Project Explorer Create a folder called ‘lib’ under the application.
    2. Right click the folder and select Import; General; File System; Choose the downloaded SDK (extracted) folder and select the GoogleAdMobAdsSdk[version].jar
  2. Add the SDK to the build path: Right click on the jar file in Project Explorer and select Build Path; Add to Build Path. You’ll see it’s filename added directly under the Project folder with a jar icon.
  3. Target Android >=3.2 (Android SDK 13): Right click the project in Project Explorer and select Properties; Android, then tick 3.2.
    Optionally you might need to change the uses-sdk element in the AndroidManifest.xml. As of writing the AdMob SDK 4.3.1 requires 3.2 or you’ll get an error in the manifest as below, note you can use a different ‘uses-sdk’ version but you are then responsible for checking you do not use any backwards incompatible code.
    If you target the wrong SDK you’ll get: ”Error: String types not allowed (at 'configChanges' with value 'keyboard|keyboardHidden|orientation|
    screenLayout|uiMode|screenSize|smallestScreenSize').
    If you get this error try a clean: Project (menu); Clean
  4. Add necessary elements to manifest:
    1. uses-permissions:
      <uses-permission android:name="android.permission.INTERNET" />
      <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    2. AdMob activity:
      <activity android:name="com.google.ads.AdActivity"
      android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|uiMode|screenSize|smallestScreenSize" />   
  5. Add your AdMob PublisherID as a value: Open [Project]\res\values\strings.xml and add a string named admob_pub_id or similar:
    <string name="admob_pub_id">[publisher id e.g. f12k78d8h62834s2]</string>
  6. Add the AdMob layout element to your res\layout\main.xml:
    1. Add the xmlns:ads property to LinearLayout:
      <LinearLayout  …   xmlns:ads="http://schemas.android.com/apk/lib/com.google.ads"…/>
    2. Add the actual AdMob element (You can add a AdMob element dynamically too):
      <com.google.ads.AdView
              android:id="@+id/adView"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              ads:adSize="BANNER"
              ads:adUnitId="@string/admob_pub_id" />
      You might like to have the ads at the bottom of the view so to do this add a new LinearLayout above it (as a sibling) and add the android:layout_height and android:layout_weight property so you end up with a file constructed like this:
      <LinearLayout with xmlns:ads…>
        <LinearLayout
          android:layout_height="0dp"
          android:layout_weight="1"…>
        [Your apps main content goes here]
        </LinearLayout>
        <com.google.ads.AdView… />
      </LinearLayout>
  7. Add code in the main Activity to load adverts after setContentView(R.layout.main);
    adView.loadAd(new AdRequest());
    Or for testing use:
    AdRequest adRequest = new AdRequest();
    adRequest.addTestDevice(AdRequest.TEST_EMULATOR); // Emulator
    AdView adView = (AdView) this.findViewById(R.id.adView);
    adView.loadAd(adRequest);

    NB you can get your device ID on running the code: see below.
Launch it
Using an emulator: Click Debug or Run and select the relevant emulator.
Using your phone:
  1. Ensure you have the phone connected and debugging enabled: Settings; Applications; Development; USB debugging.
  2. To get ads in test mode run it in  Debug mode and you’ll get a message like the following in LogCat at the bottom of the eclipse screen:
      ”To get test ads on this device, call adRequest.addTestDevice("[device id]");”
    Add a new constant for your device’s id:
      private static final string TEST_DEVICE = “[device id goes here]”;
    And insert the line:
      adRequest.addTestDevice(TEST_DEVICE); // Test Android Phone
    After the one adding the emulator mentioned above.

2 comments: