如何在Flutter应用接入Admob并在滚动信息流中插入可滑动广告

1. 前置依赖与基础配置 #

• 先在pubspec.yaml中添加Admob官方Flutter插件依赖：

dependencies:
  flutter:
    sdk: flutter
  google_mobile_ads: ^最新稳定版本号

• 分别在Android、iOS工程中配置你申请的Admob应用ID，按要求配置权限和广告位ID，信息流场景优先使用原生广告位，样式可以和你的帖子风格对齐，用户体验更好。
• 应用启动时初始化广告SDK：

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

2. 封装广告预加载逻辑 #

封装单独的广告管理类，提前预加载1-2条原生广告缓存，避免滑动到广告位时才加载出现空白：

• 监听广告加载状态，加载成功后存入缓存，加载失败自动重试
• 广告被展示后，立刻触发下一条广告的预加载，保证缓存里始终有可用广告

3. 实现内容与广告的随机混合逻辑 #

核心逻辑是将原始帖子列表和广告缓存混合成最终渲染的列表，示例逻辑如下：

import 'dart:math';

// 原始帖子列表
List<Post> originalPostList = [...];
// 最终渲染给ListView的混合列表，元素类型可以是Post或者NativeAd
List<dynamic> displayList = [];
final random = Random();

for (var post in originalPostList) {
  // 先把当前帖子加入展示列表
  displayList.add(post);
  // 随机判断是否插入广告：建议插入概率设为15%-25%，同时满足条件才插入
  if (
    // 随机概率阈值，这里设20%概率
    random.nextDouble() < 0.2 
    // 广告已经预加载完成
    && AdManager.instance.hasAvailableAd 
    // 上一个元素不是广告，避免连续出现广告
    && displayList.last is! NativeAd
    // 当前列表里广告占比不超过上限，比如10%，避免违规
    && (displayList.whereType<NativeAd>().length / displayList.length) < 0.1
  ) {
    displayList.add(AdManager.instance.getAvailableAd());
  }
}

// 如果是无限加载信息流，每次拉取到新的帖子批次后，用同样的逻辑混合广告，再追加到displayList末尾即可

4. 列表渲染实现 #

用ListView.builder根据元素类型分别渲染帖子卡片和广告卡片即可，广告和普通帖子一样支持正常滑动跳过：

ListView.builder(
  itemCount: displayList.length,
  itemBuilder: (context, index) {
    final item = displayList[index];
    if (item is Post) {
      // 渲染你的普通帖子卡片
      return PostCard(post: item);
    } else if (item is NativeAd) {
      // 渲染原生广告卡片，样式尽量和帖子风格对齐
      return NativeAdWidget(ad: item);
    }
    return const SizedBox.shrink();
  }
)

注意事项 #

• 不要设置过高的广告插入频率，Admob平台有政策要求广告不能过度干扰用户正常使用，建议至少间隔3条普通内容插入1条广告
• 广告加载失败时不要插入空占位到列表，避免影响用户体验
• 广告的展示、点击、关闭事件要做好监听，统计数据同时处理广告资源的释放，避免内存泄漏

内容的提问来源于stack exchange，提问作者Mahirul Islam