AdBanner
The AdBanner widget is used to show an advertisement banner inside your app. The AdBanner widget may display texts, images, and other rich media such as video ads.
Our AdBanner widget uses Admob which is an Ad network from Google.
.png?alt=media&token=30caeefa-704d-4651-b03f-9188592451a1)
AdBanner
Showing AdBanner From AdMob comprises of following steps:
- 1.
- 2.
- 3.
- 4.
To add the AdBanner widget to your project:
- Drag the AdBanner widget from the Base Elements tab (in the Widget Panel) or add it directly from the widget tree.
- Move to the property editor and scroll down to the Ad Banner Dimensions section and adjust the Width and Height property.
If you leave the Width property empty, AdBanner will take the full width of the screen.
.gif?alt=media&token=32a2dbad-a613-44c9-93b6-fdbc5bb23da6)
Adding AdBanner widget
The Ad Unit ID is the unique identifier given to every ad on Admob. You can get this by creating a new ad unit from your Admob account.
To assign the ad unit Id:
- Go to the Admob account dashboard, click Apps on the left side menu and select your app.
- Select Ad units and then click on the Add add unit.
- Select the Banner Ad.
- Enter the Ad unit name.
- Click Create ad unit.
- Copy the ad unit ID (the second one) and then click Done.
- Paste it into the Android Ad Unit ID input box.
- Similarly, create, copy and paste Ad unit for the iOS app as well.

Assigning Ad Unit ID
To prevent the risk of your AdMob account ban, it is best to enable the test ads while you are still developing the app.
To enable the test ads:
- Select the AdBanner Widget from the widget tree or from the canvas area.
- Move to property editor and scroll down to the Ad properties section.
- Checkmark the Show Test Ads. Uncheck it only when you are about to publish the app.
.gif?alt=media&token=3a0cb4a1-f43b-43d7-99e0-2a48d0cedd1c)
Enabling test ads
You can't test Ads in Run Mode, It can be only tested on a real device or emulator. For that, you will need to download the code and run it in your IDE.
​Here are the instructions for setting up your machine to test the downloaded code on a real device or emulator.
To test Ads:
- Open and Run the app from your preferred IDE.
- See the Banner ads appearing on the screen.
.gif?alt=media&token=ebfdc04d-2c77-4a4e-accf-78b0a5c4e543)
Testing ads
Last modified 8mo ago