バックフィル広告

cd ios && pod install --repo-update && cd ..

import 'package:flutter/material.dart';
import 'package:adrop_ads_flutter/adrop_ads_flutter.dart';
import 'package:webview_flutter/webview_flutter.dart';

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

  @override
  State<NativeAdWithBackfill> createState() => _NativeAdWithBackfillState();
}

class _NativeAdWithBackfillState extends State<NativeAdWithBackfill> {
  bool isLoaded = false;
  AdropNativeAd? nativeAd;
  late final WebViewController webViewController;

  @override
  void initState() {
    super.initState();

    // WebViewコントローラーの初期化
    webViewController = WebViewController()
      ..setJavaScriptMode(JavaScriptMode.unrestricted);

    _createNativeAd();
  }

  void _createNativeAd() {
    nativeAd = AdropNativeAd(
      unitId: 'YOUR_UNIT_ID',
      useCustomClick: true,
      listener: AdropNativeListener(
        onAdReceived: (ad) {
          debugPrint('広告受信: ${ad.isBackfilled ? "バックフィル" : "直接広告"}');

          // 直接広告の場合、WebViewにHTMLクリエイティブをロード
          if (!ad.isBackfilled && ad.properties.creative != null) {
            webViewController.loadHtmlString(ad.properties.creative!);
          }

          setState(() {
            isLoaded = true;
          });
        },
        onAdFailedToReceive: (ad, errorCode) {
          if (errorCode == AdropErrorCode.backfillNoFill) {
            debugPrint('バックフィル広告もありません');
          } else {
            debugPrint('広告ロード失敗: $errorCode');
          }
        },
      ),
    );

    nativeAd?.load();
  }

  @override
  Widget build(BuildContext context) {
    if (!isLoaded) return const SizedBox.shrink();

    return AdropNativeAdView(
      ad: nativeAd,
      child: Container(
        padding: const EdgeInsets.all(16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            // ヘッドライン
            if (nativeAd?.properties.headline != null)
              Text(
                nativeAd!.properties.headline!,
                style: const TextStyle(
                  fontSize: 18,
                  fontWeight: FontWeight.bold,
                ),
              ),
            const SizedBox(height: 8),

            // メディアビュー - バックフィルかどうかによって異なるレンダリング
            _buildMediaView(),

            // CTAボタン
            if (nativeAd?.properties.callToAction != null)
              Padding(
                padding: const EdgeInsets.only(top: 8),
                child: ElevatedButton(
                  onPressed: () {},
                  child: Text(nativeAd!.properties.callToAction!),
                ),
              ),
          ],
        ),
      ),
    );
  }

  Widget _buildMediaView() {
    if (nativeAd?.isBackfilled == true) {
      // バックフィル広告: 画像アセットを使用
      return Image.network(
        nativeAd?.properties.asset ?? '',
        width: double.infinity,
        height: 200,
        fit: BoxFit.cover,
        loadingBuilder: (context, child, loadingProgress) {
          if (loadingProgress == null) return child;
          return const SizedBox(
            height: 200,
            child: Center(child: CircularProgressIndicator()),
          );
        },
        errorBuilder: (context, error, stackTrace) {
          return const SizedBox(
            height: 200,
            child: Center(child: Icon(Icons.error)),
          );
        },
      );
    } else if (nativeAd?.properties.creative != null) {
      // 直接広告: WebViewでHTMLクリエイティブをレンダリング
      return SizedBox(
        width: double.infinity,
        height: 300,
        child: WebViewWidget(controller: webViewController),
      );
    } else {
      return const SizedBox.shrink();
    }
  }
}

bannerView = AdropBannerView(
  unitId: 'YOUR_UNIT_ID',
  listener: AdropBannerListener(
    onAdReceived: (unitId, metadata) {
      final isBackfilled = metadata?['isBackfilled'] ?? false;
      if (isBackfilled == true) {
        debugPrint('バックフィル広告がロードされました');
      } else {
        debugPrint('直接広告がロードされました');
      }
    },
    onAdFailedToReceive: (unitId, errorCode) {
      if (errorCode == AdropErrorCode.backfillNoFill) {
        debugPrint('バックフィル広告もありません');
      }
    },
  ),
);

interstitialAd = AdropInterstitialAd(
  unitId: 'YOUR_UNIT_ID',
  listener: AdropInterstitialListener(
    onAdReceived: (ad) {
      debugPrint('広告ロード完了');
      // インタースティシャル広告の場合、別途isBackfilledプロパティはありませんが、
      // コンソールでバックフィル設定がされていれば自動的にバックフィル広告がロードされます
    },
    onAdFailedToReceive: (ad, errorCode) {
      if (errorCode == AdropErrorCode.backfillNoFill) {
        debugPrint('直接広告とバックフィル広告の両方がありません');
      }
    },
  ),
);

onAdFailedToReceive: (ad, errorCode) {
  switch (errorCode) {
    case AdropErrorCode.adNoFill:
      debugPrint('直接広告がありません。バックフィル広告を試行します。');
      break;
    case AdropErrorCode.backfillNoFill:
      debugPrint('バックフィル広告もありません。');
      break;
    default:
      debugPrint('広告ロード失敗: ${errorCode.code}');
  }
}