切換到 TabBarView 中的另一個選項卡時，選項卡的文本部分隱藏，flutter

Question

請告訴我如何刪除 TabBar 中的隱藏嘗試。 我使用容器來給出大小，但它並沒有改變標簽的大小。 我認為通過使用指標大小，可以做到，但不確定如何以及哪種方法最適合這些情況。

這是代碼 -

bottom: TabBar(
            unselectedLabelColor: Colors.white,
            labelColor: Colors.white,
            tabs: [
              Container(
                width: 100,
                child: const Tab(
                  text: 'Attempted',
                ),
              ),
              Container(
                width: 120,
                child: const Tab(
                  text: 'Booked',
                ),
              ),
              Container(
                width: 80,
                child: const Tab(
                  text: 'Travelled',
                ),
              ),
              Container(
                width: 100,
                child: const Tab(
                  text: 'Cancelled',
                ),
              ),
            ],
            controller: _tabController,
            indicatorColor: Colors.white,
            indicatorSize: TabBarIndicatorSize.tab,

Answer 1

嘗試添加isScrollable屬性

  TabBar(
            isScrollable: true,
            tabs: []
          )

Answer 2

您的第一個選項卡文本Attempted比Container的寬度長，並且不適合您的容器。 您可以刪除所有容器小部件並像這樣使用FittedBox小部件。

tabs: const [
            FittedBox(
              child: Tab(
                text: 'Attempted',
              ),
            ),
            FittedBox(
              child: Tab(
                text: 'Booked',
              ),
            ),
            FittedBox(
              child: Tab(
                text: 'Travelled',
              ),
            ),
            FittedBox(
              child: Tab(
                text: 'Cancelled',
              ),
            ),
          ],