How to integrate Admob Ads in Sketchware project using AIDE?

AIDE can be used to integrate Admob Ads to a Sketchware project. First export the source code of your sketchware android project and then  follow the steps below to learn how to integrate Admob banner ads in AIDE.

Prerequisites

• A Sketchware project
• AIDE with pro account key purchased
• Account in Google developer console
• Account in Admob

Before placing admob ads in an app, the app needs to be uploaded to google play store, however test ads can be tried in any app.

Always place the test ad ID before placing your ad unit ID. App ID and ad unit ID can be obtained by registering the app on Admob. But for using test ads no registration is required.

Do not click on your own Ads.

This code works in apps which do not use AppCompat and Design.

Export the Sketchware project

In Sketchware, under MY PROJECTS, go to project settings of the app to be exported, and click on Export to PC (Android Studio).

The exported file is a zip file. Create a new folder and decompress the contents of the zip file in it.

Changes to build.gradle file

Navigate to app level build.gradle and Add following to project:
'com.google.android.gms:play-services-ads:17.+'

Save the file.

Edit the AndroidManifest.xml file

Open AIDE, browse to the AndroidManifest.xml file of the exported project and open it.

Add the following permissions:
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

In application element add your APP ID by adding following meta-data:
<application>
<meta-data
android:name = "com.google.android.gms.ads.APPLICATION_ID"
android:value = "ca-app-pub-3940256099942544~3347511713"/>
</application>

Note: Make sure you put your own app id here and not test app id.

Important: This step is required as of Google Mobile Ads SDK version 17.0.0. Failure to add this <meta-data> tag results in a crash with the message:"The Google Mobile Ads SDK was initialized incorrectly."

Also add the following activity:
<activity android:name="com.google.android.gms.ads.AdActivity"
android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|uiMode|screenSize|smallestScreenSize"
android:theme="@android:style/Theme.Translucent" />

Save the file after editing.

Edit main.xml file

In main.xml file, create a new RelativeLayout to surround the outermost Layout. For this add following code in the beginning of main.xml:

<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_height="match_parent"
android:layout_width="match_parent" >

Then add the code for AdView banner ads just before closing RelativeLayout element.
(Here use the test ad Unit ID as provided in this code. Once you see test ads successfully, change the ad Unit ID to your own ad Unit ID.)

<com.google.android.gms.ads.AdView
xmlns:ads="http://schemas.android.com/apk/res-auto"
android:id="@+id/adView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
ads:adSize="BANNER"
ads:adUnitId="ca-app-pub-3940256099942544/6300978111">
</com.google.android.gms.ads.AdView>

In the end close RelativeLayout using following code:
</RelativeLayout>

After that save the file. Note that this code can be placed in all the pages where ads are to be displayed.

Also the adUnitId has to be replaced with your own after testing with test ads.

Edit MainActivity.java file

Add the following code in imports:
import com.google.android.gms.ads.MobileAds;
import com.google.android.gms.ads.AdRequest;
import com.google.android.gms.ads.AdView;
import com.google.android.gms.ads.AdListener;

And following code as shown in image below:
private AdView mAdView;

After that initialize and load Adview, and setAdListener with following code:
(Make sure you put your own APP ID here and not test APP ID.)
MobileAds.initialize(getApplicationContext(), "ca-app-pub-3940256099942544~3347511713");
mAdView = (AdView) findViewById(R.id.adView);
AdRequest adRequest = new AdRequest.Builder().build();
mAdView.loadAd(adRequest);

mAdView.setAdListener(new AdListener() {
@Override
public void onAdLoaded() {
Log.i("Ads", "onAdLoaded");
}
@Override
public void onAdFailedToLoad(int errorCode) {
Log.i("Ads", "onAdFailedToLoad");
}
@Override
public void onAdOpened() {
Log.i("Ads", "onAdOpened");
}
@Override
public void onAdLeftApplication() {
Log.i("Ads", "onAdLeftApplication");
 }
@Override
public void onAdClosed() {
Log.i("Ads", "onAdClosed");
}
});

The App ID here has to be replaced with your own App ID received from Admob.

After this if you find no errors, then run the project. If you find the error 'R cannot be resolved', then go to main.xml and make any small change and then save the file again.

If the app crashes after installing then there is  likely an error in main.xml.

Watch the videos below to understand better:

This post is only regarding integration of Admob banner ads. The App ID and Ad unit ID used here are those for test ads and can be used in any android project.

For more information on integration of Admob Ads visit here:
https://developers.google.com/admob/android/quick-start?hl=en-GB.