backdrop_modal_route 0.1.1

A flutter plugin to open backdrop modal route with minimal code and efforts with dynamic content.

Backdrop Modal Route

Get best of both worlds, backdrop with actual backdrop unlike material design and non sticky bottom sheet

This flutter package will help you create backdrop modal route or non sticky bottom sheet with minimal code and efforts with dynamic content.

• Android and IOS
• simple and easy
• no other dependencies
• well documented
• production-ready

This package was created as a need for our in-production app, as there is no single solution which gives you a route enabled bottom-sheet or backdrop which is route enabled and a new page with an actual backdrop unlike material design.

Getting Started

Add the dependency backdrop_modal_route: ^0.1.0 to your project and start using Backdrop Modal Route everywhere:

import 'package:backdrop_modal_route/backdrop_modal_route.dart';

Open backdrop with your custom widget which could be stateful/stateless.

// with custom return type T
final result = await Navigator.push(
      context,
      BackdropModalRoute<T>(
        overlayContentBuilder: (context) => 
            YourStatelessOrStatefulBackdropOverlayContentWidget(),
      ),
    );

Open backdrop with inline widget

// with inline widget
await Navigator.push(
      context,
      BackdropModalRoute<void>(
        overlayContentBuilder: (context) {
          return Container(
            alignment: Alignment.center,
            padding: const EdgeInsets.all(24),
            child: RaisedButton(
                onPressed: () => Navigator.pop(context),
                child: Text('Inline Close'),
            ),
          );
        },
      ),
    );

For more details have a look at the other examples.

Properties

Property	Type	Default
DEFAULT_BACKDROP_TOP_PADDING	double	56.0
overlayContentBuilder (required)	Function	you implement it
backgroundColor	Color	White
topPadding	double	56.0
barrierOpacity	double	0.5
transitionDurationVal	Duration	milliseconds:500
isOpaque	boolean	false
canBarrierDismiss	boolean	true
barrierColorVal	Color	black.withOpacity(barrierOpacity)
barrierLabelVal	String	null
shouldMaintainState	bool	true
backdropShape	ShapeBorder	RoundedRectangleBorder

Improve

Help me by reporting bugs, submit new ideas for features or anything else that you want to share.

• Just write an issue on GitHub. ✏️
• And don't forget to hit the like button for this package ✌️