Scaffold is the page display framework
Scaffold has different attributes to handle the Pages
appBar: An AppBar displayed at the top of the interface, which is the ActionBar and Toolbar in Android
body: the main content widget displayed in the current interface floatingActionButton: FAB defined in paper and ink design, the main function button of the interface
persistentFooterButtons: Buttons that are fixed to the bottom, such as OK and Cancel buttons below the dialog box
drawer: sidebar control
backgroundColor: The background color of the content. The default value is ThemeData.scaffoldBackgroundColor.
bottomNavigationBar: the navigation bar displayed at the bottom of the page
resizeToAvoidBottomPadding: similar to
android: windowSoftInputMode = ”adjustResize” in Android,
controls whether the content body of the interface is rearranged to avoid the bottom being covered, for example, when the keyboard is displayed, the re-layout is to avoid covering the content with the keyboard. The default value is true
|
class ScffoldHomePage extends StatefulWidget { @override State<StatefulWidget> createState() { return ScffoldHomePageState(); } } class ScffoldHomePageState extends State<ScffoldHomePage> { num index =0; List <Widget> pageWidgetList =[ Home(), SearchScreen(), ProfileScreen(), ]; @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text("HomePage"), backgroundColor: Colors.pink, ), body:pageWidgetList[index], floatingActionButton: FloatingActionButton( child: Text("++"), onPressed: () { }, tooltip: "Click tooltips", backgroundColor: Colors.pink, focusColor: Colors.green, hoverColor: Colors.purpleAccent, splashColor: Colors.deepPurple, foregroundColor: Colors.white, elevation: 0.0, highlightElevation: 20.0, ), floatingActionButtonLocation: FloatingActionButtonLocation.endFloat, persistentFooterButtons: <Widget>[ Text( "1", style: TextStyle(color: Colors.blue), ), Text("2"), Text("3"), Text("4"), Text("5"), ], drawer: Container( color: Colors.grey, width: 120, child: FlatButton( child: Text("Close Left Swipe"), onPressed: () { Navigator.of(context).pop(); }, ), ), endDrawer: Container( color: Colors.orange, width: 200, height: 800, child: FlatButton( child: Text("Close Right Swipe",style: TextStyle(color: Colors.white),), onPressed: () { Navigator.of(context).pop(); }, ), ), bottomNavigationBar:new BottomNavigationBar( backgroundColor: Colors.pink, items: <BottomNavigationBarItem>[ BottomNavigationBarItem(icon:Icon(Icons.home,color: index==0?Colors.white:Colors.white,),title: Text("Home",style: TextStyle(color: index==0?Colors.white:Colors.white),) ), BottomNavigationBarItem(icon:Icon(Icons.search,color: index==1?Colors.white:Colors.white,),title: Text("Search",style: TextStyle(color: index==1?Colors.white:Colors.white),) ), BottomNavigationBarItem(icon:Icon(Icons.people,color: index==2?Colors.white:Colors.white,),title: Text("Account",style: TextStyle(color: index==2?Colors.white:Colors.white),) ), ], onTap: (flag) { print("flag $flag"); index = flag; setState(() {}); }, currentIndex: index, ) , ); } } |
