mirror of
https://github.com/nisrulz/flutter-examples.git
synced 2025-05-29 05:22:46 +08:00
added more comments to using_tabs example
This commit is contained in:
@ -6,6 +6,7 @@ class First extends StatelessWidget {
|
|||||||
return new Container(
|
return new Container(
|
||||||
child: new Center(
|
child: new Center(
|
||||||
child: new Column(
|
child: new Column(
|
||||||
|
// center the children
|
||||||
mainAxisAlignment: MainAxisAlignment.center,
|
mainAxisAlignment: MainAxisAlignment.center,
|
||||||
children: <Widget>[
|
children: <Widget>[
|
||||||
new Icon(
|
new Icon(
|
||||||
|
@ -6,6 +6,7 @@ class Second extends StatelessWidget {
|
|||||||
return new Container(
|
return new Container(
|
||||||
child: new Center(
|
child: new Center(
|
||||||
child: new Column(
|
child: new Column(
|
||||||
|
// center the children
|
||||||
mainAxisAlignment: MainAxisAlignment.center,
|
mainAxisAlignment: MainAxisAlignment.center,
|
||||||
children: <Widget>[
|
children: <Widget>[
|
||||||
new Icon(
|
new Icon(
|
||||||
|
@ -6,6 +6,7 @@ class Third extends StatelessWidget {
|
|||||||
return new Container(
|
return new Container(
|
||||||
child: new Center(
|
child: new Center(
|
||||||
child: new Column(
|
child: new Column(
|
||||||
|
// center the children
|
||||||
mainAxisAlignment: MainAxisAlignment.center,
|
mainAxisAlignment: MainAxisAlignment.center,
|
||||||
children: <Widget>[
|
children: <Widget>[
|
||||||
new Icon(
|
new Icon(
|
||||||
|
@ -17,18 +17,22 @@ class MyHome extends StatefulWidget {
|
|||||||
MyHomeState createState() => new MyHomeState();
|
MyHomeState createState() => new MyHomeState();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// SingleTickerProviderStateMixin is used for animation
|
||||||
class MyHomeState extends State<MyHome> with SingleTickerProviderStateMixin {
|
class MyHomeState extends State<MyHome> with SingleTickerProviderStateMixin {
|
||||||
|
// Create a tab controller
|
||||||
TabController controller;
|
TabController controller;
|
||||||
|
|
||||||
@override
|
@override
|
||||||
void initState() {
|
void initState() {
|
||||||
super.initState();
|
super.initState();
|
||||||
|
|
||||||
|
// Initialize the Tab Controller
|
||||||
controller = new TabController(length: 3, vsync: this);
|
controller = new TabController(length: 3, vsync: this);
|
||||||
}
|
}
|
||||||
|
|
||||||
@override
|
@override
|
||||||
void dispose() {
|
void dispose() {
|
||||||
|
// Dispose of the Tab Controller
|
||||||
controller.dispose();
|
controller.dispose();
|
||||||
super.dispose();
|
super.dispose();
|
||||||
}
|
}
|
||||||
@ -40,10 +44,13 @@ class MyHomeState extends State<MyHome> with SingleTickerProviderStateMixin {
|
|||||||
appBar: new AppBar(
|
appBar: new AppBar(
|
||||||
// Title
|
// Title
|
||||||
title: new Text("Using Tabs"),
|
title: new Text("Using Tabs"),
|
||||||
|
// Set the background color of the App Bar
|
||||||
backgroundColor: Colors.blue,
|
backgroundColor: Colors.blue,
|
||||||
|
// Set the bottom property of the Appbar to include a Tab Bar
|
||||||
bottom: new TabBar(
|
bottom: new TabBar(
|
||||||
tabs: <Tab>[
|
tabs: <Tab>[
|
||||||
new Tab(
|
new Tab(
|
||||||
|
// set icon to the tab
|
||||||
icon: new Icon(Icons.favorite),
|
icon: new Icon(Icons.favorite),
|
||||||
),
|
),
|
||||||
new Tab(
|
new Tab(
|
||||||
@ -53,16 +60,19 @@ class MyHomeState extends State<MyHome> with SingleTickerProviderStateMixin {
|
|||||||
icon: new Icon(Icons.airport_shuttle),
|
icon: new Icon(Icons.airport_shuttle),
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
|
// setup the controller
|
||||||
controller: controller,
|
controller: controller,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
// Body
|
// Set the TabBar view as the body of the Scaffold
|
||||||
body: new TabBarView(
|
body: new TabBarView(
|
||||||
|
// Add tabs as widgets
|
||||||
children: <Widget>[
|
children: <Widget>[
|
||||||
new first_tab.First(),
|
new first_tab.First(),
|
||||||
new second_tab.Second(),
|
new second_tab.Second(),
|
||||||
new third_tab.Third()
|
new third_tab.Third()
|
||||||
],
|
],
|
||||||
|
// set the controller
|
||||||
controller: controller,
|
controller: controller,
|
||||||
));
|
));
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user