Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[Android] Ads flickering when navigating or scroll

See original GitHub issue

Plugin Version

1.0.1

Details

Target Platform: Android Target OS version: Android 11 Devices: Galaxy S21

I’m displaying BannerAd in my app in home screen and in “product details screen” both placed inside ‘Scaffold’ -> ‘bottomNavigationBar’. When pushing the “product details screen” screen the animation goes as should be, but when navigating back to home screen there is a flickering in the navigation.

My custom class for displaying the BannerAd widget in the above screens.

custom_banner.dart

import 'package:flutter/material.dart';
import 'package:google_mobile_ads/google_mobile_ads.dart';
import 'package:net_reven/app/config.dart';

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

  @override
  _CustomBannerAdState createState() => _CustomBannerAdState();
}

class _CustomBannerAdState extends State<CustomBannerAd> {
  BannerAd _anchoredAdaptiveAd;
  var _isLoaded = false;
  Orientation _currentOrientation;

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

    _currentOrientation = MediaQuery.of(context).orientation;
    _loadAd();
  }

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

    _anchoredAdaptiveAd?.dispose();
  }

  Future<void> _loadAd() async {
    await _anchoredAdaptiveAd?.dispose();

    if (mounted) {
      setState(() {
        _anchoredAdaptiveAd = null;
        _isLoaded = false;
      });
    }

    final AnchoredAdaptiveBannerAdSize size =
        await AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(
            MediaQuery.of(context).size.width.truncate());

    if (size == null) {
      debugPrint('Unable to get height of anchored banner.');
      return;
    }

    _anchoredAdaptiveAd = BannerAd(
      adUnitId: Config.adUnitId,
      size: size,
      request: const AdRequest(
        nonPersonalizedAds: false,
      ),
      listener: BannerAdListener(
        onAdLoaded: (Ad ad) {
          debugPrint("Ad loaded");
          if (mounted) {
            setState(() {
              _anchoredAdaptiveAd = ad as BannerAd;
              _isLoaded = true;
            });
          }
        },
        onAdFailedToLoad: (Ad ad, LoadAdError error) {
          debugPrint('$BannerAd failedToLoad: $error');
          ad.dispose();
        },
        onAdOpened: (Ad ad) => debugPrint('$BannerAd onAdOpened.'),
        onAdClosed: (Ad ad) => debugPrint('$BannerAd onAdClosed.'),
      ),
    );

    return _anchoredAdaptiveAd.load();
  }

  @override
  Widget build(BuildContext context) {
    return OrientationBuilder(builder: (context, orientation) {
      if (_currentOrientation == orientation &&
          _anchoredAdaptiveAd != null &&
          _isLoaded) {
        return Container(
          color: Colors.transparent,
          width: _anchoredAdaptiveAd.size.width.toDouble(),
          height: _anchoredAdaptiveAd.size.height.toDouble(),
          child: AdWidget(ad: _anchoredAdaptiveAd),
        );
      }

      // Reload the ad if the orientation changes.
      if (_currentOrientation != orientation) {
        _currentOrientation = orientation;
        _loadAd();
      }
      return const SizedBox.shrink();
    });
  }
}

flutter doctor -v

[✓] Flutter (Channel stable, 2.5.3, on macOS 12.0.1 21A559 darwin-x64, locale
    en-IL)
    • Flutter version 2.5.3 at /Users/eitanaflalo/development/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 18116933e7 (8 weeks ago), 2021-10-15 10:46:35 -0700
    • Engine revision d3ea636dc5
    • Dart version 2.14.4

[✓] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
    • Android SDK at /Users/eitanaflalo/Library/Android/sdk
    • Platform android-31, build-tools 31.0.0
    • Java binary at: /Applications/Android
      Studio.app/Contents/jre/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7281165)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 13.1, Build version 13A1030d
    • CocoaPods version 1.11.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2020.3)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7281165)

[✓] VS Code (version 1.62.3)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension can be installed from:
      🔨 https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter

[✓] Connected device (3 available)
    • SM J710F (mobile) • 52036ac7f0d6a359 • android-arm    • Android 8.1.0 (API
      27)
    • macOS (desktop)   • macos            • darwin-x64     • macOS 12.0.1
      21A559 darwin-x64
    • Chrome (web)      • chrome           • web-javascript • Google Chrome
      96.0.4664.93

• No issues found!