Last updated:
0 purchases
overlay creator
OverlayCreator #
A Flutter package designed to simplify the process of creating and managing overlay widgets in your Flutter applications. By providing a straightforward mixin that can be added to the state of a StatefulWidget, overlay_creator makes it easy to display custom overlay content, such as modal dialogs, tooltips, or any floating widget, on top of your app's UI without the need for complex navigation or state management.
Features #
Easy integration with existing Flutter projects.
Simplifies the creation and dismissal of overlay widgets.
Supports custom widgets as overlay content, allowing for highly customizable overlays.
Provides callback options for further control over the overlay's lifecycle.
Quick Start #
To use overlay_creator, follow these steps:
Mixin with Your StatefulWidget's State
Add OverlayCreator mixin to the state of your StatefulWidget.
class Homepage extends StatefulWidget {
const Homepage({super.key});
@override
State<Homepage> createState() => _HomepageState();
}
class _HomepageState extends State<Homepage> with OverlayCreator {
// Your widget's build method and other functionalities
}
copied to clipboard
Display an Overlay
Use the displayOverlay method to show your overlay widget.
ElevatedButton(
onPressed: () {
displayOverlay(
context: context,
child: FullOverlayArea(
background: const GlassBackgroundWD(),
child: PopupContainerWD(
removeOverlay: () {
removeOverlay();
},
),
),
);
},
child: const Text("Show Glass Overlay"))
copied to clipboard
Remove the Overlay
Call removeOverlay when you need to dismiss the overlay.
Full Example #
Here's a simple example demonstrating how to use overlay_creator to display a custom overlay
class Main extends StatelessWidget {
const Main({super.key});
@override
Widget build(BuildContext context) {
return const MaterialApp(
debugShowCheckedModeBanner: false,
home: Homepage(),
);
}
}
class Homepage extends StatefulWidget {
const Homepage({super.key});
@override
State<Homepage> createState() => _HomepageState();
}
class _HomepageState extends State<Homepage> with OverlayCreator {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.blue,
title: const Text(
"Example",
style: TextStyle(color: Colors.white),
),
),
body: Center(
child: Column(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
ElevatedButton(
onPressed: () {
displayOverlay(
context: context,
child: FullOverlayArea(
background: const GlassBackgroundWD(),
child: PopupContainerWD(
removeOverlay: () {
removeOverlay();
},
),
),
);
},
child: const Text("Show Glass Overlay")),
],
),
),
);
}
}
copied to clipboard
Additional Notes #
Ensure that the context passed to displayOverlay is from a widget that is a descendant of MaterialApp or WidgetsApp to properly find the overlay.
For personal and professional use. You cannot resell or redistribute these repositories in their original state.
There are no reviews.