[Flutter]TabBar(タブバー)をスクロールできる(scrollable)ようにするには？

どうも、ちょげ(@chogetarou)です。

TabBarをスクロールできるようにする方法を紹介します。

方法

TabBarをスクロールできるようにするには、引数「isScrollable」に「true」を指定します。

TabBar(
  isScrollable: true,
  tabs: [
    /*タブ*/
  ],
),

以下は、使用例です。

使用例

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: DefaultTabController(
        length: 10,
        child: Scaffold(
          body: TabBar(
            isScrollable: true,
            labelColor: Colors.pink,
            unselectedLabelColor: Colors.blue,
            tabs: [
              for (var i = 0; i < 10; i++)
                Tab(
                  child: Text('Tab $i'),
                ),
            ],
          ),
        ),
      ),
    );
  }