Flutter AppBar定義頂部Tab切換（滑動）

（一）效果及效果圖
效果：

頭部的選項可以切換，可以左右滑動
（二）實作
在上一篇博客的基礎上加一個屬性：
isScrollable: true,

以下是全部代碼，如果想要運行，就要在main.dart里面寫一個入口函式，即在home的位置寫Categorypage()

import 'package:flutter/material.dart';

class Categorypage extends StatefulWidget {
  @override
  _CategorypageState createState() => _CategorypageState();
}

class _CategorypageState extends State<Categorypage> {
  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 8,
      child: Scaffold(
        appBar: AppBar(
          title: Row(
            children: [
              Expanded(
                child: TabBar(
                indicatorColor: Colors.red, 
                  isScrollable: true,//多個按鈕可以滑動
                  tabs: <Widget>[
                    Tab(text: "熱門1"),
                    Tab(text: "推薦2"),
                    Tab(text: "熱門3"),
                    Tab(text: "推薦4"),
                    Tab(text: "熱門5"),
                    Tab(text: "推薦6"),
                    Tab(text: "熱門7"),
                    Tab(text: "推薦8"),
                  ]),
              ),
            ],
          ),
          backgroundColor: Colors.green,
        ),
        body: TabBarView(
          children: <Widget>[
            ListView(
              children: [
                ListTile(
                  title: Text("第一個tab"),
                ),
                ListTile(
                  title: Text("第一個tab"),
                ),
              ],
            ),
            ListView(
              children: [
                ListTile(
                  title: Text("第二個tab"),
                ),
                ListTile(
                  title: Text("第二個tab"),
                ),
              ],
            ),
             ListView(
              children: [
                ListTile(
                  title: Text("第三個tab"),
                ),
                ListTile(
                  title: Text("第二個tab"),
                ),
              ],
            ),
            ListView(
              children: [
                ListTile(
                  title: Text("第四個tab"),
                ),
                ListTile(
                  title: Text("第二個tab"),
                ),
              ],
            ),
            ListView(
              children: [
                ListTile(
                  title: Text("第五個tab"),
                ),
                ListTile(
                  title: Text("第二個tab"),
                ),
              ],
            ),
             ListView(
              children: [
                ListTile(
                  title: Text("第6個tab"),
                ),
                ListTile(
                  title: Text("第二個tab"),
                ),
              ],
            ), ListView(
              children: [
                ListTile(
                  title: Text("第7個tab"),
                ),
                ListTile(
                  title: Text("第二個tab"),
                ),
              ],
            ),
             ListView(
              children: [
                ListTile(
                  title: Text("第8個tab"),
                ),
                ListTile(
                  title: Text("第二個tab"),
                ),
              ],
            )
          ],
        ),
      ),
    );
  }
}