Wed Jul 25 2018·1 min read

Implement backdrop in flutter with less than 10 LOC

Quickest way to add Backdrop component to your Flutter app.

Lets not waste time and get started with the code.

add dependecy:

dependencies:  
   backdrop: ">=0.0.0 <0.1.0"

run get package:

$ flutter packages get

drop in BackdropScaffold widget in your code:

import 'package:backdrop/backdrop.dart';  
import 'package:flutter/material.dart';  
  
void main() => runApp(**new** MyApp());  
  
class MyApp extends StatelessWidget {  
  @override  
  Widget build(BuildContext context) {  
    return new MaterialApp(  
      title: 'Backdrop Demo',  
      home: BackdropScaffold(  
        title: Text("Backdrop Example"),  
        backpanel: Center(  
          child: Text("Backpanel"),  
        ),  
        body: Center(  
          child: Text("Body"),  
        ),  
      ),  
    );  
  }  
}

this is how it should look:

I have written a more detailed explaination about [**_backdrop_**](https://pub.dartlang.org/packages/backdrop)package and **BackdropScaffold** widget in another article. Have a look if want to know more options.