Flutter广告集成插件flutter_ohos_ads的使用

Flutter广告集成插件flutter_ohos_ads的使用

📱 Flutter HarmonyOS Ads

一款优质的 Flutter 鸿蒙系统广告插件,帮助你在鸿蒙平台快速变现

♻️ 持续更新 ♻️

🚀 核心功能

  • ✅ 开屏广告
  • ✅ 插屏广告
  • ✅ 激励视频
  • ✅ 横幅广告
  • ✅ 信息流

📃 接入文档

  • 🎯 极速接入、快速体验、持续更新

📌 广告系列插件(FlutterAds)

插件 描述
flutter_gromore_pro 🏆🏆🏆 帮你大幅提升广告收益,发挥出最大的用户价值
flutter_gromore_ads 字节跳动、穿山甲、GroMore 聚合 Flutter 广告开源版插件
flutter_pangle_ads 字节跳动、穿山甲 Flutter 广告插件
flutter_pangle_global_ads 字节跳动、穿山甲国际版 Flutter 广告插件 ~ 🚀 Pro 版
flutter_qq_ads 腾讯广告、广点通、优量汇 Flutter 广告插件
flutter_ohos_ads HarmonyOS 鸿蒙 Flutter 广告变现插件
flutter_adspark 巨量广告/穿山甲的广告监测、增长分析、归因上报、事件管理 Flutter 版插件
flutter_adcontent 穿山甲内容输出 Flutter 版插件,支持短剧、小视频、短故事(小说)

完整示例 Demo

以下是一个完整的示例,展示如何在 Flutter 应用中集成 flutter_ohos_ads 插件。

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

import 'package:flutter/services.dart';
import 'package:flutter_ohos_ads/flutter_ohos_ads.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  [@override](/user/override)
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  String _platformVersion = 'Unknown';
  final _flutterOhosAdsPlugin = FlutterOhosAds();

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

  // Platform messages are asynchronous, so we initialize in an async method.
  Future<void> initPlatformState() async {
    String platformVersion;
    // Platform messages may fail, so we use a try/catch PlatformException.
    // We also handle the message potentially returning null.
    try {
      platformVersion = await _flutterOhosAdsPlugin.getPlatformVersion() ?? 'Unknown platform version';
    } on PlatformException {
      platformVersion = 'Failed to get platform version.';
    }

    // If the widget was removed from the tree while the asynchronous platform
    // message was in flight, we want to discard the reply rather than calling
    // setState to update our non-existent appearance.
    if (!mounted) return;

    setState(() {
      _platformVersion = platformVersion;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Plugin example app'),
        ),
        body: Center(
          child: Text('Running on: $_platformVersion\n'),
        ),
      ),
    );
  }
}

代码解释

  1. 导入必要的包

    import 'package:flutter/material.dart';
    import 'dart:async';
    import 'package:flutter/services.dart';
    import 'package:flutter_ohos_ads/flutter_ohos_ads.dart';
    
  2. 初始化应用

    void main() {
      runApp(const MyApp());
    }
    
  3. 定义主应用状态类

    class MyApp extends StatefulWidget {
      const MyApp({super.key});
    
      [@override](/user/override)
      State<MyApp> createState() => _MyAppState();
    }
    
  4. 初始化状态并获取平台版本

    class _MyAppState extends State<MyApp> {
      String _platformVersion = 'Unknown';
      final _flutterOhosAdsPlugin = FlutterOhosAds();
    
      [@override](/user/override)
      void initState() {
        super.initState();
        initPlatformState();
      }
    
      Future<void> initPlatformState() async {
        String platformVersion;
        try {
          platformVersion = await _flutterOhosAdsPlugin.getPlatformVersion() ?? 'Unknown platform version';
        } on PlatformException {
          platformVersion = 'Failed to get platform version.';
        }
    
        if (!mounted) return;
    
        setState(() {
          _platformVersion = platformVersion;
        });
      }
    
  5. 构建应用界面

    [@override](/user/override)
    Widget build(BuildContext context) {
      return MaterialApp(
        home: Scaffold(
          appBar: AppBar(
            title: const Text('Plugin example app'),
          ),
          body: Center(
            child: Text('Running on: $_platformVersion\n'),
          ),
        ),
      );
    }
    

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

1 回复

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


当然,以下是一个关于如何在Flutter项目中集成和使用flutter_ohos_ads插件的示例代码。flutter_ohos_ads插件允许开发者在OpenHarmony操作系统上集成广告。

前提条件

  1. 确保你已经安装了Flutter SDK,并且配置好了开发环境。
  2. 确保你的设备或模拟器支持OpenHarmony系统。

步骤一:添加依赖

首先,在你的pubspec.yaml文件中添加flutter_ohos_ads依赖:

dependencies:
  flutter:
    sdk: flutter
  flutter_ohos_ads: ^最新版本号  # 请替换为实际的最新版本号

然后运行flutter pub get来安装依赖。

步骤二:配置广告

android/app/src/main/AndroidManifest.xml(对于Android平台)或相应的OpenHarmony配置文件中,添加必要的广告配置信息(这部分可能因具体广告平台的要求而异,请参考广告平台的文档)。

步骤三:初始化广告插件

在你的Flutter应用的入口文件(通常是main.dart)中,初始化flutter_ohos_ads插件。

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

void main() {
  // 初始化广告插件
  FlutterOhosAds.instance.initAd('你的广告平台ID', '你的广告单元ID');

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: AdExampleScreen(),
    );
  }
}

步骤四:展示广告

在你的具体页面(例如AdExampleScreen)中展示广告。

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

class AdExampleScreen extends StatefulWidget {
  @override
  _AdExampleScreenState createState() => _AdExampleScreenState();
}

class _AdExampleScreenState extends State<AdExampleScreen> {
  BannerAd? _bannerAd;

  @override
  void initState() {
    super.initState();
    // 创建Banner广告
    _bannerAd = BannerAd(
      adUnitId: '你的Banner广告单元ID',
      size: AdSize.banner,
      listener: BannerAdListener(
        onAdLoaded: () {
          print('Banner广告加载成功');
        },
        onAdFailedToLoad: (AdError error) {
          print('Banner广告加载失败: ${error.message}');
        },
        onAdOpened: () {
          print('Banner广告被打开');
        },
        onAdClosed: () {
          print('Banner广告被关闭');
        },
        onAdLeftApplication: () {
          print('用户离开应用');
        },
      ),
    )..load();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('广告集成示例'),
      ),
      body: Center(
        child: _bannerAd != null
            ? Container(
                height: 50,
                child: AdWidget(ad: _bannerAd!),
              )
            : CircularProgressIndicator(),
      ),
    );
  }

  @override
  void dispose() {
    _bannerAd?.dispose();
    super.dispose();
  }
}

步骤五:运行应用

确保你的设备或模拟器已经连接并启用了开发者模式,然后运行应用:

flutter run

注意事项

  • 确保你已经注册并获取了广告平台的ID和广告单元ID。
  • 具体的广告尺寸和配置可能因广告平台而异,请参考广告平台的官方文档。
  • 在实际开发中,请处理广告加载失败的情况,并给用户友好的提示。

这段代码展示了如何在Flutter应用中集成flutter_ohos_ads插件并展示一个简单的Banner广告。根据广告平台的不同,你可能需要调整初始化代码和广告单元ID。

回到顶部