Flutter学习笔记(三)-TabBar的使用

Flutter TabBar的使用

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_app/list_main.dart';

class HomePageWidget extends StatefulWidget {
  @override
  State createState() => _HomePageState();
}

class _HomePageState extends State {
  int _index = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("主页"),
      ),
      body: Column(
        children: [
          Expanded(
            child: Container(
              child: Align(
                child: getItemWidget(_index),
              ),
              color: Colors.white,
              margin: EdgeInsets.all(0),
            ),
          ),
          buildTabBar()
        ],
      ),
    );
  }

  Widget buildTabBar() {
    return CupertinoTabBar(
      currentIndex: _index,
      items: buildBarItems(),
      onTap: onTap,
    );
  }

  List buildBarItems() {
    List items = new List();
    items.add(
        BottomNavigationBarItem(icon: Icon(Icons.list), title: Text("列表")));
    items.add(BottomNavigationBarItem(
        icon: Icon(Icons.access_alarm), title: Text("电话")));
    return items;
  }

  Widget getItemWidget(int index) {
    if (index == 0) {
      return ListPageState();
    }
    return Text("Page: $index");
  }

  void onTap(int index) {
    setState(() {
      _index = index;
    });
  }
}

你可能感兴趣的:(Flutter学习笔记(三)-TabBar的使用)