Show a popup anywhere on the screen, or attach your popup to a widget
Show a popup anywhere on the screen, or attach your popup to a widget !
Features
- Show any widget (popup) anywhere on the screen.
- Attach your popup to a widget and move it anywhere with this widget. (Coming Soon!)
- Customize entrance and leaving transitions of the popup content, as well as the durations and curves.
- Choose between various types of popup backgrounds (barriers), like those which block interaction with widgets behind them and those which don’t.
- Support for limiting your popup inside the visible screen area if you choose to do so.
- The package is tested and documented very well.
Usage
await showSimplePopup(
context: context,
content: Container(),// Put any widget here
contentOffsetBuilder: (Size contentSize) {
// return the position you want for the top left of the widget you returned above
// you also have the size of that widget to use in your calculations!
},
transitionBuilder: (context, animation, secondaryAnimation, child){
// create any transition
// child is the widget returned above, i.e. the content of your popup
// don't forget to pass it the child as well
},
transitionDuration: const Duration(milliseconds: 1000),
reverseTransitionDuration: const Duration(milliseconds: 300),
transitionCurve: Curves.easeInOutBack,
reverseTransitionCurve: Curves.easeOutExpo,
modalBarrierBehavior: HitTestBehavior.translucent,// popup's empty area will dismiss the popup and pass through the tap
);
Coming Soon
- Ability to attach the popup to another widget.
Notes
- The popup is pushed on a new route, so its context will be different, so you must remember that when you want to reflect state updates from other routes to the popup’s route. For example, you can make use of
StatefulBuilderandProvideror any other state management solution in this case.
Additional information
You are welcome to contribute to the package. Just add a PR with the feature or fix you think will add value to the package.