Integrating AdMob into an Android Processing App

Integrating AdMob into an Android Processing App is surprisingly easy, once you know how. Here we show you the steps so you can display ads and monetise your app

The processing forum has some great advice on doing this, but having tried it, we've adapted and improved this a little and listed the steps here

The following steps assumes you already have a Processing sketch working in an Android app created in an IDE like Android Studio or Eclipse, as you will be dealing with non-Processing libraries. If not, you will need to port your sketch over as shown in the really useful tutorial over on processing.org

We also assume you have signed up to AdMob and have an app key for your app. If not, you'll need to have over to AdMob and do so. We recommend using a Smart Banner as this easily adapts to screen size and resolution

Step 1 - Import the AdMob library

If you're using Android Studio or a dependency management build tool such as Gradle this is as simple as adding the AdMob dependency

implementation 'com.google.android.gms:play-services-ads:17.1.1'

Note that the version 17.1.1 was the current version at the time of writing, it may have changed now

If you're not using a build tool, you'll need to download and import the library yourself

Step 2 - Display the AdMob ads

The above forum post talks about adding this into your sketch code itself, which works really well but does mean having your ad code inside the sketch code, which somehow feels like it's contaminating the code to me, and also limits reuse of the sketch code itself

Instead you can add the AdMob code into your launching Activity class, the one that instantiates the sketch, rather than inside the sketch itself. Because the Activity is displaying the sketch, you can still add the AdMob code here and it will display over the sketch when it runs

    private PApplet sketch;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        // hide title bar
        requestWindowFeature(Window.FEATURE_NO_TITLE);//will hide the title
        getSupportActionBar().hide(); //hide the title bar

        FrameLayout frame = new FrameLayout(this);
        frame.setId(CompatUtils.getUniqueViewId());
        setContentView(frame, new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,
                ViewGroup.LayoutParams.MATCH_PARENT));

        sketch = new <your sketch class>(); // ADD YOUR SKETCH CLASS HERE
        PFragment fragment = new PFragment(sketch);
        fragment.setView(frame, this);

        // ads
        Window window = getWindow();
        RelativeLayout adsLayout = new RelativeLayout(this);
        RelativeLayout.LayoutParams lp2 = new RelativeLayout.LayoutParams(
                RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.MATCH_PARENT);
        
        AdView adView = new AdView(this);
        adView.setAdSize(AdSize.SMART_BANNER);

        adView.setAdUnitId("< your ad unit ID >"); // ADD YOUR AD UNIT ID HERE
        adsLayout.addView(adView);
        AdRequest newAdReq = new AdRequest.Builder().build();

        adView.loadAd(newAdReq);
        window.addContentView(adsLayout,lp2);
        // end ads
    }

This code launches your sketch code and displays the ads over the top

You will need to replace the sketch class and ad unit ID in the relevant places above

Step 3 - Alter AndroidManifest.xml

Very little needs altering here. You simply need to add your app ID for AdMob (not the ad unit ID) as a <meta-data> tag inside the <application> tag

        <meta-data
            android:name="com.google.android.gms.ads.APPLICATION_ID"
            android:value="<YOUR ADMOB APP ID>"/>

No additional permissions need to be declared because the imported library has it's own manifest which will add the necessary permissions

And you're done!