mirror of
https://github.com/nisrulz/flutter-examples.git
synced 2025-07-15 02:46:03 +08:00
81 lines
2.1 KiB
Dart
81 lines
2.1 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:using_bottom_nav_bar/tabs/first.dart';
|
|
import 'package:using_bottom_nav_bar/tabs/second.dart';
|
|
import 'package:using_bottom_nav_bar/tabs/third.dart';
|
|
|
|
void main() {
|
|
runApp(new MaterialApp(
|
|
// Title
|
|
title: "Using Tabs",
|
|
// Home
|
|
home: new MyHome()));
|
|
}
|
|
|
|
class MyHome extends StatefulWidget {
|
|
@override
|
|
MyHomeState createState() => new MyHomeState();
|
|
}
|
|
|
|
// SingleTickerProviderStateMixin is used for animation
|
|
class MyHomeState extends State<MyHome> with SingleTickerProviderStateMixin {
|
|
// Create a tab controller
|
|
TabController controller;
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
|
|
// Initialize the Tab Controller
|
|
controller = new TabController(length: 3, vsync: this);
|
|
}
|
|
|
|
@override
|
|
void dispose() {
|
|
// Dispose of the Tab Controller
|
|
controller.dispose();
|
|
super.dispose();
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return new Scaffold(
|
|
// Appbar
|
|
appBar: new AppBar(
|
|
// Title
|
|
title: new Text("Using Bottom Navigation Bar"),
|
|
// Set the background color of the App Bar
|
|
backgroundColor: Colors.blue,
|
|
),
|
|
// Set the TabBar view as the body of the Scaffold
|
|
body: new TabBarView(
|
|
// Add tabs as widgets
|
|
children: <Widget>[new FirstTab(), new SecondTab(), new ThirdTab()],
|
|
// set the controller
|
|
controller: controller,
|
|
),
|
|
// Set the bottom navigation bar
|
|
bottomNavigationBar: new Material(
|
|
// set the color of the bottom navigation bar
|
|
color: Colors.blue,
|
|
// set the tab bar as the child of bottom navigation bar
|
|
child: new TabBar(
|
|
tabs: <Tab>[
|
|
new Tab(
|
|
// set icon to the tab
|
|
icon: new Icon(Icons.favorite),
|
|
),
|
|
new Tab(
|
|
icon: new Icon(Icons.adb),
|
|
),
|
|
new Tab(
|
|
icon: new Icon(Icons.airport_shuttle),
|
|
),
|
|
],
|
|
// setup the controller
|
|
controller: controller,
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|