dart 如何更改flutter material3 navigationBar小部件的标签文本颜色？

dauxcl2d 于 2024-01-03 发布在 Flutter

关注(0)|答案(1)|浏览(233)

我是Flutter的新手，正在开发Material 3应用程序。我试图自定义底部导航栏中选定标签文本的颜色，但我遇到了一些挑战。
以下是我迄今为止尝试的方法：
我尝试将TextStyle直接应用于标签文本，但这对所选项目的颜色没有任何影响。我还查看了BottomNavigationBar的文档，但我还没有找到一个简单的属性来修改选定的标签文本颜色。我希望为选定的标签文本实现一个特定的颜色，使其从标签项中脱颖而出。我欢迎任何指导或建议在材料3中如何处理这个问题。

bottomNavigationBar: NavigationBar(
        onDestinationSelected: (int index) {
          setState(() {
            currentPageIndex = index;
          });
        },
        indicatorColor: HexColor('CEE7EF'),
        backgroundColor: HexColor('ffffff'),
        
        labelBehavior: labelBehavior,
        selectedIndex: currentPageIndex,
        destinations: const <Widget>[
          NavigationDestination(
            selectedIcon: Icon(Icons.home),
            icon: Icon(Icons.home_outlined),
            label: 'Home',
          ),
          NavigationDestination(
            icon: Icon(Icons.important_devices),
            label: 'Devices',
          ),
          NavigationDestination(
            icon: Icon(Icons.settings),
            label: 'Settings',
          ),
        ],
      ),

字符串

dart

来源：https://stackoverflow.com/questions/77693501/how-to-change-label-text-color-of-the-flutter-material3-navigationbar-widget

1条答案

按热度按时间

jvidinwx1#

NavigationBarTheme(
      data: NavigationBarThemeData(
          labelTextStyle: MaterialStateProperty.all(
        const TextStyle(
          fontSize: 12,
          fontWeight: FontWeight.w600,
          color: Colors.black,
        ),
      )),
      child: NavigationBar(
        onDestinationSelected: (int index) {
          setState(() {
            currentPageIndex = index;
          });
        },
        indicatorColor: HexColor('CEE7EF'),
        backgroundColor: HexColor('ffffff'),
        
        labelBehavior: labelBehavior,
        selectedIndex: currentPageIndex,
        destinations: const <Widget>[
          NavigationDestination(
            selectedIcon: Icon(Icons.home),
            icon: Icon(Icons.home_outlined),
            label: 'Home',
          ),
          NavigationDestination(
            icon: Icon(Icons.important_devices),
            label: 'Devices',
          ),
          NavigationDestination(
            icon: Icon(Icons.settings),
            label: 'Settings',
          ),
        ],
      ),
    );

字符串

展开查看全部

赞(0）回复(0）举报 2024-01-03

我来回答

dart 如何更改flutter material3 navigationBar小部件的标签文本颜色？

1条答案

相关问题

热门标签

最新问答