backdrop_widget

Backdrop component for Material Components 2.0. Material Components 2.0 Backdrop Widget is implemented behavior and styling backdrop material component. This have two mode behavior:

  • Open page mode
  • Navigation mode

How use

One destination mode

One destination

  @override
  Widget build(BuildContext context) {
    return BackdropScaffold(
    titleAppBar: //Your title
    frontWidgetBuilder: (context){
        //Return your frontPanel widget
    }, backPanelBuilder: (context) {
          //Return your backPanel widget
    });
  }

Navigation mode

Demonstration navigation

  @override
  Widget build(BuildContext context) {
    return BackdropScaffold.navigation(
              titleAppBar: Text('Backdrop example'),
              destinations: [
                NavigationDestination(
                  icon: //Icon page, 
                  title: //Title page
                ),
              ],
              children: [
                //Your pages
              ],
            );
  }

If you needed AppBar actions for page, use this BackdropPageActionsMixin

class Page extends StatelessWidget with BackdropPageActionsMixin {
  const Page();

  @override
  List<Widget> get actions => [IconButton(icon: const Icon(Icons.exit_to_app), onPressed: () {})];

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Text('Page with action'),
    );
  }
}