Flutter移动广告集成插件nowa_mobile_ads的使用

好的,以下是根据您的要求整理的关于“Flutter移动广告集成插件nowa_mobile_ads的使用”的内容及完整示例Demo:


Flutter移动广告集成插件nowa_mobile_ads的使用

在本教程中,我们将学习如何在Flutter应用中集成并使用nowa_mobile_ads插件来展示移动广告。通过本教程,您将能够了解如何安装插件、配置必要的参数,并将其集成到您的Flutter项目中。

安装插件

首先,在您的pubspec.yaml文件中添加nowa_mobile_ads依赖项:

dependencies:
  flutter:
    sdk: flutter
  nowa_mobile_ads: ^0.1.0 # 请检查最新的版本号

然后运行以下命令以更新您的依赖项:

flutter pub get

配置插件

在Android和iOS平台上,您还需要进行一些特定的配置。

Android

  1. 打开android/app/src/main/AndroidManifest.xml文件,并确保包含以下权限:

    <uses-permission android:name="android.permission.INTERNET"/>
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
    
  2. MainActivity.java文件中,初始化广告:

    import com.nowa.mobile_ads.NowaMobileAds;
    
    [@Override](/user/Override)
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        NowaMobileAds.init(this);
        // 其他代码...
    }
    

iOS

  1. 打开ios/Runner/Info.plist文件,并添加以下键值对:

    <key>GADApplicationIdentifier</key>
    <string>ca-app-pub-XXXXXXXXXXXXXXXX/YYYYYYYYYY</string>
    
  2. 确保您的AppDelegate.mAppDelegate.swift文件中包含了广告的初始化代码:

    Objective-C

    #import "AppDelegate.h"
    #import <NowaMobileAds/NowaMobileAds.h>
    
    [@implementation](/user/implementation) AppDelegate
    
    - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
        [NowaMobileAds init];
        return YES;
    }
    
    [@end](/user/end)
    

    Swift

    import UIKit
    import NowaMobileAds
    
    [@UIApplicationMain](/user/UIApplicationMain)
    class AppDelegate: UIResponder, UIApplicationDelegate {
    
        func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
            NowaMobileAds.init()
            return true
        }
    }
    

使用插件

现在我们可以在应用中使用nowa_mobile_ads插件来展示广告了。

  1. 创建一个广告位ID(例如在nowa.dev网站上创建)。

  2. 在您的Flutter页面中插入广告位:

    import 'package:flutter/material.dart';
    import 'package:nowa_mobile_ads/nowa_mobile_ads.dart';
    
    void main() => runApp(MyApp());
    
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          home: HomePage(),
        );
      }
    }
    
    class HomePage extends StatefulWidget {
      @override
      _HomePageState createState() => _HomePageState();
    }
    
    class _HomePageState extends State<HomePage> {
      final String adUnitId = 'ca-app-pub-XXXXXXXXXXXXXXXX/YYYYYYYYYY'; // 替换为您的广告单元ID
    
      BannerAd? bannerAd;
    
      @override
      void initState() {
        super.initState();
        loadBannerAd();
      }
    
      void loadBannerAd() {
        bannerAd = BannerAd(
          adUnitId: adUnitId,
          size: AdSize.banner,
          request: AdRequest(),
          listener: BannerAdListener(
            onAdLoaded: (ad) {
              setState(() {});
            },
            onAdFailedToLoad: (ad, error) {
              ad.dispose();
              print('Ad failed to load: $error');
            },
          ),
        );
    
        bannerAd!.load();
      }
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            title: Text('Flutter 广告插件示例'),
          ),
          body: Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Text(
                  '这是一个展示广告的示例',
                  style: TextStyle(fontSize: 20),
                ),
                if (bannerAd != null && bannerAd!.isLoaded)
                  Container(
                    width: bannerAd!.size.width.toDouble(),
                    height: bannerAd!.size.height.toDouble(),
                    child: AdWidget(ad: bannerAd!),
                  )
              ],
            ),
          ),
        );
      }
    }
    

更多关于Flutter移动广告集成插件nowa_mobile_ads的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter移动广告集成插件nowa_mobile_ads的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


nowa_mobile_ads 是一个用于在 Flutter 应用中集成移动广告的插件。它支持多种广告格式,如横幅广告、插页式广告、激励广告等。以下是如何在 Flutter 项目中使用 nowa_mobile_ads 插件的步骤。

1. 添加依赖

首先,你需要在 pubspec.yaml 文件中添加 nowa_mobile_ads 插件的依赖:

dependencies:
  flutter:
    sdk: flutter
  nowa_mobile_ads: ^1.0.0  # 请检查最新版本

然后运行 flutter pub get 来获取依赖。

2. 初始化插件

main.dart 文件中初始化 nowa_mobile_ads 插件:

import 'package:flutter/material.dart';
import 'package:nowa_mobile_ads/nowa_mobile_ads.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  
  // 初始化广告插件
  await NowaMobileAds.instance.initialize();

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

3. 显示横幅广告

在某个页面中显示横幅广告:

import 'package:flutter/material.dart';
import 'package:nowa_mobile_ads/nowa_mobile_ads.dart';

class MyHomePage extends StatefulWidget {
  [@override](/user/override)
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  BannerAd? _bannerAd;

  [@override](/user/override)
  void initState() {
    super.initState();
    _loadBannerAd();
  }

  void _loadBannerAd() {
    _bannerAd = BannerAd(
      adUnitId: 'your_ad_unit_id',  // 替换为你的广告单元ID
      size: AdSize.banner,
      request: AdRequest(),
      listener: BannerAdListener(
        onAdLoaded: (Ad ad) {
          print('BannerAd loaded.');
        },
        onAdFailedToLoad: (Ad ad, LoadAdError error) {
          print('BannerAd failed to load: $error');
        },
      ),
    )..load();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Nowa Mobile Ads Example'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text('Hello, world!'),
            if (_bannerAd != null)
              Container(
                width: _bannerAd!.size.width.toDouble(),
                height: _bannerAd!.size.height.toDouble(),
                child: AdWidget(ad: _bannerAd!),
              ),
          ],
        ),
      ),
    );
  }

  [@override](/user/override)
  void dispose() {
    _bannerAd?.dispose();
    super.dispose();
  }
}

4. 显示插页式广告

加载并显示插页式广告:

import 'package:flutter/material.dart';
import 'package:nowa_mobile_ads/nowa_mobile_ads.dart';

class InterstitialAdExample extends StatefulWidget {
  [@override](/user/override)
  _InterstitialAdExampleState createState() => _InterstitialAdExampleState();
}

class _InterstitialAdExampleState extends State<InterstitialAdExample> {
  InterstitialAd? _interstitialAd;

  void _loadInterstitialAd() {
    InterstitialAd.load(
      adUnitId: 'your_interstitial_ad_unit_id',  // 替换为你的插页式广告单元ID
      request: AdRequest(),
      adLoadCallback: InterstitialAdLoadCallback(
        onAdLoaded: (InterstitialAd ad) {
          _interstitialAd = ad;
          print('InterstitialAd loaded.');
        },
        onAdFailedToLoad: (LoadAdError error) {
          print('InterstitialAd failed to load: $error');
        },
      ),
    );
  }

  void _showInterstitialAd() {
    if (_interstitialAd != null) {
      _interstitialAd!.show();
    } else {
      print('InterstitialAd is not loaded yet.');
    }
  }

  [@override](/user/override)
  void initState() {
    super.initState();
    _loadInterstitialAd();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Interstitial Ad Example'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: _showInterstitialAd,
          child: Text('Show Interstitial Ad'),
        ),
      ),
    );
  }

  [@override](/user/override)
  void dispose() {
    _interstitialAd?.dispose();
    super.dispose();
  }
}

5. 显示激励广告

加载并显示激励广告:

import 'package:flutter/material.dart';
import 'package:nowa_mobile_ads/nowa_mobile_ads.dart';

class RewardedAdExample extends StatefulWidget {
  [@override](/user/override)
  _RewardedAdExampleState createState() => _RewardedAdExampleState();
}

class _RewardedAdExampleState extends State<RewardedAdExample> {
  RewardedAd? _rewardedAd;

  void _loadRewardedAd() {
    RewardedAd.load(
      adUnitId: 'your_rewarded_ad_unit_id',  // 替换为你的激励广告单元ID
      request: AdRequest(),
      rewardedAdLoadCallback: RewardedAdLoadCallback(
        onAdLoaded: (RewardedAd ad) {
          _rewardedAd = ad;
          print('RewardedAd loaded.');
        },
        onAdFailedToLoad: (LoadAdError error) {
          print('RewardedAd failed to load: $error');
        },
      ),
    );
  }

  void _showRewardedAd() {
    if (_rewardedAd != null) {
      _rewardedAd!.show(
        onUserEarnedReward: (RewardedAd ad, RewardItem reward) {
          print('User earned reward: ${reward.amount} ${reward.type}');
        },
      );
    } else {
      print('RewardedAd is not loaded yet.');
    }
  }

  [@override](/user/override)
  void initState() {
    super.initState();
    _loadRewardedAd();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Rewarded Ad Example'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: _showRewardedAd,
          child: Text('Show Rewarded Ad'),
        ),
      ),
    );
  }

  [@override](/user/override)
  void dispose() {
    _rewardedAd?.dispose();
    super.dispose();
  }
}
回到顶部