Flutter on Androidでもnendのバナー広告を表示したい！

一行で

PlatformViewを使った。

背景

公式パッケージがNull safety対応しておらず、組み込むのも難しそうだったのでAndroidネイティブのViewを埋め込むことにしました。

コード

Android側

import android.content.Context
import android.view.View
import net.nend.android.NendAdView
import io.flutter.plugin.platform.PlatformView
import io.flutter.plugin.common.BinaryMessenger

internal class NativeNendAdView(context: Context, messenger: BinaryMessenger?, id: Int) : PlatformView {
    private val nendAdView: NendAdView

    override fun getView(): View {
        return nendAdView
    }

    override fun dispose() {}

    init {
        nendAdView = NendAdView(context, 3174, "c5cb8bc474345961c6e7a9778c947957ed8e1e4f")
    }
}

import android.content.Context
import android.view.View
import io.flutter.plugin.common.StandardMessageCodec
import io.flutter.plugin.platform.PlatformView
import io.flutter.plugin.platform.PlatformViewFactory
import io.flutter.plugin.common.BinaryMessenger

class NativeNendAdViewFactory(private val messenger: BinaryMessenger) :
    PlatformViewFactory(StandardMessageCodec.INSTANCE) {
    override fun create(context: Context, id: Int, o: Any?): PlatformView {
        return NativeNendAdView(context, messenger, id)
    }
}

import androidx.annotation.NonNull
import io.flutter.embedding.engine.plugins.FlutterPlugin

class NativeNendAdViewPlugin : FlutterPlugin {
    override fun onAttachedToEngine(@NonNull flutterPluginBinding: FlutterPlugin.FlutterPluginBinding) {
        flutterPluginBinding.platformViewRegistry
            .registerViewFactory(
                "plugins.rutilicus.views/nendadview",
                NativeNendAdViewFactory(flutterPluginBinding.binaryMessenger)
            )
    }

    override fun onDetachedFromEngine(binding: FlutterPlugin.FlutterPluginBinding) {
    }
}

import androidx.annotation.NonNull
import io.flutter.embedding.android.FlutterActivity
import io.flutter.embedding.engine.FlutterEngine
import io.flutter.plugins.GeneratedPluginRegistrant

class MainActivity: FlutterActivity() {
    override fun configureFlutterEngine(@NonNull flutterEngine: FlutterEngine) {
        GeneratedPluginRegistrant.registerWith(flutterEngine)
        flutterEngine.plugins.add(NativeNendAdViewPlugin())
    }
}

Dart側

Widgetのbuildメソッドに以下の感じで指定。

                Container(
                  alignment: Alignment.center,
                  child: SizedBox(
                    height: 50,
                    width: 320,
                    child: AndroidView(
                      viewType: 'plugins.rutilicus.views/nendadview',
                    ),
                  ),
                )

表示はされますが、初回表示までに結構時間がかかっていますし、裏で"tile memory limits exceeded, some content may not draw"のワーニングがたくさん出ています……

参考

Flutter | Hosting native Android and iOS views in your Flutter app with Platform Views
FlutterのPlatformViewを理解する
[Flutter] Platform Viewsを利用した簡易WebViewプラグインの作り方 - Qiita