flutter_native_admob 1.0.0 flutter_native_admob: ^1.0.0 copied to clipboard
Admob native ad plugin for Flutter
flutter_native_admob #
Plugin to integrate Firebase Native Admob to Flutter application Platform supported: iOS, Android
Getting Started #
For help getting started with Flutter, view our online documentation.
How it works #
Setup Android project #
- Add the classpath to the [project]/android/build.gradle file.
dependencies {
// Example existing classpath
classpath 'com.android.tools.build:gradle:3.2.1'
// Add the google services classpath
classpath 'com.google.gms:google-services:4.3.0'
}
- Add the apply plugin to the [project]/android/app/build.gradle file.
// ADD THIS AT THE BOTTOM
apply plugin: 'com.google.gms.google-services'
- Add your Admob App ID. Important: This step is required as of Google Mobile Ads SDK version 17.0.0. Failure to add this
<manifest>
<application>
<!-- Sample AdMob App ID: ca-app-pub-3940256099942544~3347511713 -->
<meta-data
android:name="com.google.android.gms.ads.APPLICATION_ID"
android:value="ca-app-pub-xxxxxxxxxxxxxxxx~yyyyyyyyyy"/>
</application>
</manifest>
Setup iOS project #
- Add Admob App ID: Important: This step is required as of Google Mobile Ads SDK version 7.42.0. Failure to add add this Info.plist entry results in a crash with the message: The Google Mobile Ads SDK was initialized incorrectly. In your app's Info.plist file, add a GADApplicationIdentifier key with a string value of your AdMob app ID. You can find your App ID in the AdMob UI. You can make this change programmatically:
<key>GADApplicationIdentifier</key>
<string>Your_Admob_App_ID</string>
- Add embeded view support: In your app's Info.plist file, add this
<key>io.flutter.embedded_views_preview</key>
<true/>
Integrate banner view widget #
NativeAdmobBannerView
is a Flutter widget, so you can add it anywhere in Flutter application. For example:
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text('Plugin example app'),
),
body: ListView(
children: <Widget>[
Container(
margin: EdgeInsets.only(bottom: 20.0),
height: 200.0,
color: Colors.green,
),
Container(
margin: EdgeInsets.only(bottom: 20.0),
height: 200.0,
color: Colors.green,
),
Container(
margin: EdgeInsets.only(bottom: 20.0),
height: 200.0,
color: Colors.green,
),
NativeAdmobBannerView(
adUnitID: "<Your ad unit ID>",
style: BannerStyle.dark, // enum dark or light
showMedia: true, // whether to show media view or not
contentPadding: EdgeInsets.all(10), // content padding
onCreate: (controller) {
controller.setStyle(BannerStyle.light); // Dynamic update style
},
),
Container(
margin: EdgeInsets.only(bottom: 20.0),
height: 200.0,
color: Colors.green,
),
Container(
margin: EdgeInsets.only(bottom: 20.0),
height: 200.0,
color: Colors.green,
),
Container(
margin: EdgeInsets.only(bottom: 20.0),
height: 200.0,
color: Colors.green,
),
],
),
),
);
}
If you want to apply margin, just wrap it into a Container
Note:
NativeAdmobBannerView
has a fixed height. Its height is based on content height, content padding (contentPadding
parameter) and media view (showMedia
parameter). So you don't need to worry about the widget height.
Example #
To run example project, please follow this link: Flutter Firebase to integrate you google services