flutter - 如何使标签栏中的文本显示在同一行？

Question

我试图克隆一个名为 stucor 的应用程序，但该应用程序中的选项卡栏不同，当我尝试在 flutter 中实现时，选项卡栏中的所有文本都具有相同的大小并且其中的文本有很多行喜欢

因此，我尝试将文本包装在 FittedBox 小部件中，但随后字体大小变小了，如上图所示。我想要实现的是

  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 7,
          child: Scaffold(
        appBar: AppBar(
          bottom: TabBar(
            tabs: [

              Tab(child: FittedBox(child: Text('HOME', style: TextStyle(color: Colors.black),)) ),
              Tab(child: Text('RESULTS', style: TextStyle(color: Colors.black),) ),
              Tab(child: Text('INTERNALS', style: TextStyle(color: Colors.black),) ),
              Tab(child: Text('NOTES', style: TextStyle(color: Colors.black),) ),
              Tab(child: Text('EVENTS', style: TextStyle(color: Colors.black),) ),
              Tab(child: Text('QUESTION PAPERS', style: TextStyle(color: Colors.black),) ),
              Tab(child: Text('JOBS', style: TextStyle(color: Colors.black),) )]),```

Answer 1

如评论中所述，您可以通过将 TabBar 的 isScrollable 属性设置为 true< 来实现 TabBar 行为.

将其作为答案张贴在这里以便其他人可以看到:

我使用您的小部件树添加了一个示例:

 Widget build(BuildContext context) {
    return DefaultTabController(
      length: 7,
          child: Scaffold(
        appBar: AppBar(
          bottom: TabBar(
            isScrollable: true, // new line
            tabs: [

              Tab(child: FittedBox(child: Text('HOME', style: TextStyle(color: Colors.black),)) ),
              Tab(child: Text('RESULTS', style: TextStyle(color: Colors.black),) ),
              Tab(child: Text('INTERNALS', style: TextStyle(color: Colors.black),) ),
              Tab(child: Text('NOTES', style: TextStyle(color: Colors.black),) ),
              Tab(child: Text('EVENTS', style: TextStyle(color: Colors.black),) ),
              Tab(child: Text('QUESTION PAPERS', style: TextStyle(color: Colors.black),) ),
              Tab(child: Text('JOBS', style: TextStyle(color: Colors.black),) )]),