為BottomNavigationBarItem的標簽添加漸變-有解無憂

在我的 flutter 應用程式中，我有一個底部導航欄。我想為所選專案添加一個 LinearGradient。

我設法通過使用activeIconBottomNavigationBarItem的屬性向圖示添加漸變。

但是我不知道如何向專案的標簽添加相同的漸變。由于BottomNavigationBarItem.title已棄用并且BottomNavigationBarItem.label只允許我添加一個字串，因此我無法直接將漸變添加到標簽中。

我曾嘗試弄亂selectedLabelStyleBottomNavigationBar 的，但沒有成功。

這是我的 BottomNavigationBar 外觀的螢屏截圖。為BottomNavigationBarItem的標簽添加漸變目前標簽只有一種顏色。我希望它與圖示具有相同的漸變。

有誰知道我如何實作這一目標？

非常感謝！

       BottomNavigationBar(
          onTap: onTabTapped,
          currentIndex: _currentPage,
          backgroundColor: context.appTheme.primaryBackgroundColor,
          type: BottomNavigationBarType.fixed,
          unselectedItemColor: context.appTheme.primaryTextColor,
          showUnselectedLabels: true,
          items: [
            BottomNavigationBarItem(
              activeIcon: GradientMask(
                child: Icon(Icons.home_filled),
                gradient: context.appTheme.primaryGradient,
              ),
              icon: Icon(Icons.home_filled),
              label: 'Home',
            ),
            BottomNavigationBarItem(
              activeIcon: GradientMask(
                child: Icon(Icons.search),
                gradient: context.appTheme.primaryGradient,
              ),
              icon: Icon(Icons.search),
              label: 'Search',
            ),
            BottomNavigationBarItem(
              activeIcon: GradientMask(
                child: Icon(Icons.savings),
                gradient: context.appTheme.primaryGradient,
              ),
              icon: Icon(Icons.savings),
              label: 'Earnings'
            ),
            BottomNavigationBarItem(
              activeIcon: GradientMask(
                child: Icon(Icons.volunteer_activism),
                gradient: context.appTheme.primaryGradient,
              ),
              icon: Icon(Icons.volunteer_activism),
              label: 'Sharing'
            ),
            BottomNavigationBarItem(
              activeIcon: GradientMask(
                child: Icon(Icons.inventory_2),
                gradient: context.appTheme.primaryGradient,
              ),
              icon: Icon(Icons.inventory_2),
              label: 'My Items'
            )
          ],
        ),

uj5u.com熱心網友回復：

圖示和活動圖示也可以采用列小部件。您可以用一列包裹圖示并在其中添加相關文本并忽略標簽。

轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/334719.html

標籤：扑坡度导航栏

上一篇：單擊書籍時如何顯示書籍詳細資訊

下一篇：如何修復顫振中的無效雙倍