Flutter原生移动广告集成插件google_native_mobile_ads的使用

Flutter原生移动广告集成插件google_native_mobile_ads的使用

此插件支持在Android上全屏和内联原生广告。（目前还没有访问Xcode的权限）。 请查看示例了解如何使用。

如果您喜欢我的工作？支持我

设置

在设置Google移动广告时，只需更改在此包中定义的adfactory实现。 您的MainActivity.java应如下所示：

package com.example.google_native_mobile_ads_example;
import com.example.google_native_mobile_ads.NativeAdFactoryImplementation;
import io.flutter.embedding.android.FlutterActivity;
import io.flutter.embedding.engine.FlutterEngine;
import io.flutter.plugins.googlemobileads.GoogleMobileAdsPlugin;

public class MainActivity extends FlutterActivity {
    @Override
    public void configureFlutterEngine(FlutterEngine flutterEngine) {
        super.configureFlutterEngine(flutterEngine);
        final GoogleMobileAdsPlugin.NativeAdFactory factory = new NativeAdFactoryImplementation(getLayoutInflater()); // 引用此包创建的工厂
        GoogleMobileAdsPlugin.registerNativeAdFactory(flutterEngine, "google_native_mobile_ads_AdFactory", factory);
    }

    @Override
    public void cleanUpFlutterEngine(FlutterEngine flutterEngine) {
        GoogleMobileAdsPlugin.unregisterNativeAdFactory(flutterEngine, "google_native_mobile_ads_AdFactory");
    }
}

在AndroidManifest.xml中添加应用程序ID：

<application>
...
<meta-data
            android:name="com.google.android.gms.ads.APPLICATION_ID"
            android:value="YOUR-APPLICATION-ID"/>
            ...
    </application>

如何在Flutter侧使用

完整的示例请参阅example/main.dart

nativeAd = NativeAd(
  adUnitId: widget.adUnitId,

  /// 这将展示全屏广告
  customOptions: NativeAdCustomOptions.defaultConfig().toMap, // 这将展示全屏广告
  nativeAdOptions: NativeAdOptions(
    adChoicesPlacement: AdChoicesPlacement.topLeftCorner,
    mediaAspectRatio: MediaAspectRatio.any,
    videoOptions: VideoOptions(
      clickToExpandRequested: true,
      customControlsRequested: true,
      startMuted: true,
    ),
    //shouldRequestMultipleImages: true,
  ),
  request: const AdRequest(),

  /// 这无需更改
  factoryId: NativeAdConfig.adFactoryId, // 这也是必需的
  ...

截图

完整示例代码

以下是示例代码，您可以参考这些代码来集成和使用google_native_mobile_ads插件。

import 'package:flutter/material.dart';
import 'package:google_mobile_ads/google_mobile_ads.dart';
import 'full_screen_ad.dart';
import 'inline_ad.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await MobileAds.instance.initialize();
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.indigo,
      ),
      home: const MainScreen(),
    );
  }
}

class MainScreen extends StatefulWidget {
  const MainScreen({Key? key}) : super(key: key);

  [@override](/user/override)
  State<MainScreen> createState() => _MainScreenState();
}

class _MainScreenState extends State<MainScreen> {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('主屏幕'),
      ),
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            ElevatedButton(
              child: const Text('显示内联原生广告'),
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(
                    builder: (context) => const MediumSizeNativeAdScreen(),
                  ),
                );
              },
            ),
            ElevatedButton(
              child: const Text('显示全屏原生广告'),
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(
                    builder: (context) => const FullScreenNativeAdScreen(),
                  ),
                );
              },
            ),
          ],
        ),
      ),
    );
  }
}