Flutter的Cupertino下顶部导航栏切换内容

实现方式：
material下则可以使用Tabbar+ TabBarView来实现。
CupertinoPageScaffold下，不能使用Tabbar，使用了CupertinoSegmentedControl+ TabBarView来实现。
效果如下：

代码：

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:moka_flutter/config/config.dart'; // 我自己定义的配置文件

class MsgCenterPage extends StatefulWidget {
  MsgCenterPage({Key key}) : super(key: key);

  @override
  _MsgCenterPageState createState() => new _MsgCenterPageState();
}

class _MsgCenterPageState extends State<MsgCenterPage> with SingleTickerProviderStateMixin {
  int selectIndex = 1;
  TabController tabController;

  @override
  void initState() {
    super.initState();

    // 添加监听器
    tabController = TabController(length: 2, vsync: this)
    ..addListener(() {
      if (tabController.index.toDouble() == tabController.animation.value) {
        switch (tabController.index) {
          case 0:
            logPrint('1');
            setState(() {
              selectIndex = 1;
            });
            break;
          case 1:
            logPrint('2');
            setState(() {
              selectIndex = 2;
            });
            break;
        }
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    TextStyle selectedStyle = new TextStyle(
      color: MkColor.textOrange,
      fontSize: 16.0,
    );
    TextStyle noSelectedStyle = new TextStyle(
      color: MkColor.textBlack,
      fontSize: 14.0,
    );

    return CupertinoPageScaffold(
      navigationBar: new CupertinoNavigationBar(
        actionsForegroundColor: MkColor.textOrange,
        middle: new CupertinoSegmentedControl<int>(
          children: {
            1: Padding(
              padding: EdgeInsets.symmetric(horizontal: 15.0, vertical: 6.0),
              child: Text(
                "消息",
                style: selectIndex == 1 ? selectedStyle : noSelectedStyle,
              ),
            ),
            2: Padding(
              padding: EdgeInsets.symmetric(horizontal: 15.0, vertical: 6.0),
              child: Text(
                "公告",
                style: selectIndex == 1 ? noSelectedStyle : selectedStyle,
              ),
            ),
          },
          borderColor: MkColor.white,
          pressedColor: MkColor.white,
          onValueChanged: (index) {
            logPrint(index, message: "点击了第几个");
            setState(() {
              selectIndex = index;
              tabController.animateTo(index - 1);
            });
          },
        ),
        previousPageTitle: "返回",
        border: null,
      ),
      child: new Container(
        color: MkColor.white,
        child: TabBarView(
          children: <Widget>[
            new Text('我是消息的内容'),
            new Text('我是公告的内容'),
          ],
          controller: tabController,
        ),
      ),
    );
  }
}