Scaffolding is a combination of widgets provided by Flutter that encapsulate common controls inside

  • The navigation bar
  • The side drawer
  • Bottom navigation bar
  • A floating button
attribute
  • AppBar: / / navigation bar
  • Drawer: new MyDrawer(), // left drawer
  • EndDrawer: new MyDrawer(),// right drawer
  • BottomNavigationBar: Bottom navigation
  • FloatingActionButton: Float button
  • FloatingActionButtonLocation: suspended the location of the button
  • FloatingActionButtonAnimator: floatingActionButtonAnimator scaling, / /???????
  • PersistentFooterButtons: / / at the bottom of the navigation bar at the top of the toolbar
  • BottomSheet: Icon(icons.alarm),// persistentFooterButtons widget above
  • BackgroundColor: Colors. Red [200], // the backgroundColor between the top and bottom navigation bars
  • resizeToAvoidBottomInset: false,//???
  • resizeToAvoidBottomPadding: false,//????
  • primary: true,//???
  • drawerDragStartBehavior: DragStartBehavior.down,//???
  • DrawerScrimColor:,// The color of the outer part of the drawer after the drawer is pulled out

class _MyHomePageState extends State<MyHomePage> { int _selectedIndex = 1; @override Widget build(BuildContext context) {return Scaffold(appBar: appBar (// navigation bar title: Text("Scaffold"), actions: <Widget>[// Menu icon (icon: icon (icons.add_alarm), onPressed: () {}),],), drawer: New MyDrawer(),// left endDrawer: new MyDrawer(),// right endDrawer: bottomNavigationBar: bottomNavigationBar <BottomNavigationBarItem>[ BottomNavigationBarItem( icon: Icon(Icons.access_alarms), title: Text('alarm')), BottomNavigationBarItem( icon: Icon(Icons.search), title: Text('search')), BottomNavigationBarItem(icon: Icon(Icons.home), title: Text('home')), BottomNavigationBarItem(icon: Icon(Icons.edit), title: Text('edit')), ], type: BottomNavigationBarType.fixed, currentIndex: _selectedIndex, fixedColor: color. blue, onTap: onTap,), floatingActionButton: floatingActionButton (// Float button child: Icon (the Icons. Add), onPressed: _onAdd), / / floatingActionButton floatingActionButtonLocation position: FloatingActionButtonLocation centerDocked, / / button in the middle, / / FloatingActionButtonLocation: FloatingActionButtonLocation.centerFloat, // floatingActionButtonLocation: FloatingActionButtonLocation.startTop, // floatingActionButtonLocation: FloatingActionButtonLocation.miniStartTop, // floatingActionButtonLocation: FloatingActionButtonLocation.endDocked, // floatingActionButtonLocation: FloatingActionButtonLocation.endFloat, // floatingActionButtonLocation: FloatingActionButtonLocation endTop, / / floatingActionButtonAnimator: floatingActionButtonAnimator scaling, / /??? [Icons (icons.edit), Icon(icons.save_alt), Icon(icons.verified_user),], PersistentFooterButtons Widget bottomSheet: Icon(Icons. Alarm) Colors.red[200], resizeToAvoidBottomInset: false,//??? resizeToAvoidBottomPadding: false,//???? primary: true,//??? drawerDragStartBehavior: DragStartBehavior.down,//??? DrawerScrimColor: Colors. Green [100],// The color of the outer part of the drawer after the drawer is drawn); } void onTap(int index) { setState(() { _selectedIndex = index; }); } void _onAdd() {} } class MyDrawer extends StatelessWidget { const MyDrawer({ Key key, }) : super(key: key); @override Widget build(BuildContext context) { return Drawer( child: Column( crossAxisAlignment: CrossAxisAlignment. Start, and the children: "Widget > [Padding (Padding: const EdgeInsets. Only (top: 38.0), the child: Row (children: <Widget>[Padding(Padding: const EdgeInsets. Symmetric (horizontal: 17.0)), child: ClipOval(child: Image.asset( "images/avatar3.jpg", width: 80, ), ), ), Text( "zzc", style: TextStyle(fontWeight: FontWeight.bold), ) ], ), ), Expanded( child: ListView( children: <Widget>[ ListTile( leading: const Icon(Icons.access_alarms), title: const Text('access_alarms'), ), ListTile( leading: const Icon(Icons.delete), title: const Text('delete'), ), ListTile( leading: const Icon(Icons.save), title: const Text('save'), ), ], ), ), ], ), ); }}Copy the code