import 'package:flutter/material.dart';
import 'tabs/first.dart';
import 'tabs/second.dart';
import 'tabs/third.dart';
void main() => runApp(new MaterialApp(title: "Using Tabs", home: new MyHome()));
class MyHome extends StatefulWidget {
@override
State<StatefulWidget> createState() => MyHomeState();
}
class MyHomeState extends State<MyHome> with SingleTickerProviderStateMixin {
TabController controller;
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Center(
child: new Text("Using Tabs"),
),
backgroundColor: Colors.blue,
bottom: getTabBar(),
),
body: getTabBarView(<Widget>[new first(), new second(), new third()]),
);
}
@override
void initState() {
super.initState();
controller = new TabController(length: 3, vsync: this);
}
@override
void dispose() {
controller.dispose();
super.dispose();
}
TabBar getTabBar() {
return new TabBar(
tabs: <Widget>[
new Tab(
icon: new Icon(Icons.favorite),
),
new Tab(
icon: new Icon(Icons.adb),
),
new Tab(
icon: new Icon(Icons.airport_shuttle),
),
],
controller: controller,
);
}
TabBarView getTabBarView(var tabs) {
return new TabBarView(
children: tabs,
controller: controller,
);
}
}
import 'package:flutter/material.dart';
class first extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Container(
child: new Center(
child: new Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Icon(Icons.favorite, size: 160.0, color: Colors.red),
new Text("First Tab")
],
),
),
);
}
}
import 'package:flutter/material.dart';
class second extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Container(
child: new Center(
child: new Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Icon(Icons.adb, size: 160.0, color: Colors.green),
new Text("Second Tab")
],
),
),
);
}
}
import 'package:flutter/material.dart';
class third extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Container(
child: new Center(
child: new Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Icon(Icons.airport_shuttle, size: 160.0, color: Colors.blue),
new Text("Third Tab")
],
),
),
);
}
}
网友评论