black friday sale

Flat 10% off on the purchase of any two apps or more. Use coupon code - FESTIVAL10

Grab It Now
Check Mobile App
Read now
Start a Project

OverlaySupport in Flutter

Save

Overlay means displaying something over an existing surface. Similarly, OverlaySupport in Flutter, it is used to display some notifications/messages/data over another widget.

In this blog, we will discuss how can we integrate the overlay notifications/messages in our app with the help of the overlay_support package.

Steps for Integrating OverlaySupport in Flutter

Step – 1 -> Firstly, we will need to add the “overlay_support” package in our pubspec.yaml file and run “pub get” command.

You can check out the updated version here.

Step – 2 -> Now, we can start using this package in our code.

Here, after adding the package to our project, we will need to first wrap the MaterialApp with OverlaySupport.global so that the OverlaySupport works over the complete app.

Let’s start —

1. We can display a notification overlay with the help of an OverlayEntry i.e. showSimpleNotification().

It has various properties like context, background, subtitle,autoDismiss, etc.

2. We can display a toast overlay with the help of toast(). It requires a message field and has properties like context and duration.

3. We can display a custom notification with the help of showOverlayNotification().

4. We can display a custom overlay widget with the help of showOverlay().

 

Code Sample-

Conclusion

In this blog, we have discussed how we can integrate Overlay Support in Flutter.

I hope it will help you out in understanding and get a brief idea about it.

References

https://api.flutter.dev/flutter/widgets/Draggable-class.html

. . .

Leave a Comment

Your email address will not be published. Required fields are marked*


Be the first to comment.

css.php

Very good company, we did get app extension for Magento 2 website. The support was very good they help us through the process. Webkul team is very supportive, I would recommend them.

Yasser Mohamed

Yasser Mohamed

Talk to Sales

Global

Live Chat
Start a Project

    Message Sent!

    If you have more details or questions, you can reply to the received confirmation email.

    Back to Home