Flutter学习(顶部TabBar使用)

import 'package:flutter/material.dart';

import 'package:flutter_study01/Modules/Ticket/SecondPageOne.dart';
import 'package:flutter_study01/Modules/Ticket/SecondPageTwo.dart';
import 'package:flutter_study01/Modules/Ticket/SecondPageThree.dart';


void main() => runApp(FirstPushPage());

class FirstPushPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp (
        home:DefaultTabController(
          length: 3,
          child: Scaffold(
            appBar: AppBar(
              bottom: TabBar(
                tabs: [
                  Tab(icon: Icon(Icons.directions_car)),
                  Tab(icon: Icon(Icons.directions_transit)),
                  Tab(icon: Icon(Icons.directions_bike)),
                ],
              ),
              title: Text('Tabs Example'),
              backgroundColor: Colors.blue,
            ),
            body: TabBarView(
              children: [
                SecondPageOne(),
                SecondPageTwo(),
                SecondPageThree(),
              ],
            ),
          ),
        )
    );
  }
}

你可能感兴趣的:(Flutter,Flutter,Flutter顶部Tab)