Skip to main content

​
Light Popup Ad Format

  • A full-screen ad format.
  • Automatically closes after 8 seconds. Less disruptive to UX compared to interstitial or rewarded video ads.
  • Android light popup example
Android Light Popup Example Pn
  • iOS light popup example
Ios Light Popup Example Pn

​
Creating Instance and Setting Callbacks

Create a DaroLightPopupAd instance and set up callbacks. 
import 'package:daro_flutter/daro_flutter.dart';

final lightPopupAd = DaroLightPopupAd(adUnitId: '{YOUR_AD_UNIT_ID}');

lightPopupAd.onAdLoadSuccess = (adInfo) {
  print('LightPopup ad loaded');
};
lightPopupAd.onAdLoadFail = (error) {
  print('LightPopup ad failed to load: ${error.message}');
};
lightPopupAd.onAdImpression = (adInfo) {
  print('LightPopup ad impression');
};
lightPopupAd.onAdClicked = (adInfo) {
  print('LightPopup ad clicked');
};
lightPopupAd.onAdShown = (adInfo) {
  print('LightPopup ad shown');
};
lightPopupAd.onAdFailedToShow = (error) {
  print('LightPopup ad failed to show: ${error.message}');
};
lightPopupAd.onAdDismiss = (adInfo) {
  print('LightPopup ad dismissed');
};

​
Loading Ads

Call load() to load an ad. 
lightPopupAd.load();

​
Showing Ads

Check if the ad is ready with isReady(), then display it with show(). 
final isReady = await lightPopupAd.isReady();

if (isReady) {
  lightPopupAd.show();
}

​
Releasing Resources

Call destroy() to release resources when done. 
lightPopupAd.destroy();

​
Style Customization

Use DaroLightPopupStyle to customize the UI of light popup ads. 
final lightPopupAd = DaroLightPopupAd(
  adUnitId: '{YOUR_AD_UNIT_ID}',
  style: DaroLightPopupStyle(
    backgroundColor: '#B2121416',              // Overall background color
    containerColor: '#121416',                 // Card background color
    titleColor: '#F7FAFF',                     // Title color
    bodyColor: '#B6BECC',                      // Body text color
    ctaBackgroundColor: '#EB2640',             // CTA button background color
    ctaTextColor: '#FFFFFF',                   // CTA button text color
    closeButtonColor: '#F7FAFF',               // Close button text color
    closeButtonText: 'Close AD',               // Close button text
    adMarkLabelTextColor: '#F7FAFF',           // Ad mark label text color
    adMarkLabelBackgroundColor: '#3E434F',     // Ad mark label background color
  ),
);

​
Style Properties

PropertyDescription
backgroundColorOverall background color
containerColorCard background color
titleColorTitle color
bodyColorBody text color
ctaBackgroundColorCTA button background color
ctaTextColorCTA button text color
closeButtonColorClose button text color
closeButtonTextClose button text
adMarkLabelTextColorAd mark label text color
adMarkLabelBackgroundColorAd mark label background color

​
Implementation Example

import 'package:flutter/material.dart';
import 'package:daro_flutter/daro_flutter.dart';

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

  @override
  State<LightPopupAdPage> createState() => _LightPopupAdPageState();
}

class _LightPopupAdPageState extends State<LightPopupAdPage> {
  late final DaroLightPopupAd _lightPopupAd;
  String _status = 'Not Loaded';

  @override
  void initState() {
    super.initState();
    _lightPopupAd = DaroLightPopupAd(
      adUnitId: '{YOUR_AD_UNIT_ID}',
      style: DaroLightPopupStyle(
        backgroundColor: '#B2121416',
        containerColor: '#121416',
        titleColor: '#F7FAFF',
        bodyColor: '#B6BECC',
        ctaBackgroundColor: '#EB2640',
        ctaTextColor: '#FFFFFF',
        closeButtonColor: '#F7FAFF',
        closeButtonText: 'Close AD',
        adMarkLabelTextColor: '#F7FAFF',
        adMarkLabelBackgroundColor: '#3E434F',
      ),
    );
    _setupCallbacks();
  }

  void _setupCallbacks() {
    _lightPopupAd.onAdLoadSuccess = (adInfo) {
      setState(() => _status = 'Loaded');
    };

    _lightPopupAd.onAdLoadFail = (error) {
      setState(() => _status = 'Failed to Load');
      print('LightPopup ad failed to load: ${error.message}');
    };

    _lightPopupAd.onAdShown = (adInfo) {
      setState(() => _status = 'Shown');
    };

    _lightPopupAd.onAdFailedToShow = (error) {
      setState(() => _status = 'Failed to Show');
    };

    _lightPopupAd.onAdDismiss = (adInfo) {
      setState(() => _status = 'Not Loaded');
    };

    _lightPopupAd.onAdClicked = (adInfo) {
      print('LightPopup ad clicked');
    };

    _lightPopupAd.onAdImpression = (adInfo) {
      print('LightPopup ad impression');
    };
  }

  @override
  void dispose() {
    _lightPopupAd.destroy();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Light Popup Ad')),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text('Status: $_status'),
            const SizedBox(height: 16),
            ElevatedButton(
              onPressed: () async {
                final isReady = await _lightPopupAd.isReady();
                if (isReady) {
                  _lightPopupAd.show();
                } else {
                  setState(() => _status = 'Loading...');
                  _lightPopupAd.load();
                }
              },
              child: Text(_status == 'Loaded' ? 'Show LightPopup' : 'Load LightPopup'),
            ),
          ],
        ),
      ),
    );
  }
}