在Flutter中更改底部菜单的颜色可以通过使用BottomNavigationBar组件来实现。BottomNavigationBar是一个底部导航栏组件,可以在底部显示多个导航项。 要更改底部菜单的颜色,可以通过设置BottomNavigationBar的backgroundColor属性来实现。该属性接受一个Color对象,用于设置底部菜单的背景颜色。 以下是一个示例代码,演示如何在F...
type:导航栏的类型,可以是BottomNavigationBarType.fixed或BottomNavigationBarType.shifting。如果不指定,默认值根据items的数量自动决定。 fixedColor:当type为BottomNavigationBarType.fixed时,用于设置未选中项的颜色。如果不设置,将使用主题中的颜色。 backgroundColor:导航栏的背景颜色。如果不设置,将使用主题中的背景颜...
您可以通过以下方法来自定义 NavigationRail 的外观: 背景色:使用backgroundColor属性设置导航栏的背景色。 代码语言:javascript 复制 NavigationRail(backgroundColor:Colors.blueGrey,// 设置导航栏的背景色// 其他配置属性...) 选中项颜色:使用selectedIconTheme属性设置选中项的图标主题,以及selectedLabelTextStyle属性设...
statusBarColor: Colors.transparent,// 去除状态栏遮罩statusBarIconBrightness: Brightness.dark,// 状态栏图标字体颜色systemNavigationBarColor: Color.fromARGB(255,242,247,251),// 底部导航栏颜色) ), colorScheme:constColorScheme.light( surface: Color.fromARGB(255,242,247,251),// 和底部导航栏保持一致...
this.bottomNavigationBar, // 底部导航栏 this.bottomSheet, // 底部可隐藏导航栏 this.backgroundColor, // 内容区域颜色 this.resizeToAvoidBottomPadding, // 是否重新布局来避免底部被覆盖了,比如当键盘显示的时候,重新布局避免被键盘盖住内容。默认值为 true。
this.bottomNavigationBar, this.bottomSheet, this.backgroundColor, this.resizeToAvoidBottomInset, this.primary = true, this.drawerDragStartBehavior = DragStartBehavior.start, this.extendBody = false, this.extendBodyBehindAppBar = false, this.drawerScrimColor, ...
BottomNavigationBarItem( icon: Icon(Icons.movie), title: Text('Movie'),//backgroundColor: Colors.orange), ]; 4. 构建底部导航,并添加点击事件 在Scaffold脚手架里面,我们添加基本的 appbar body,这个是List<Widget>,导航页面数组 bottomNavigationBar, 设置其type、items、currentIndex,当然还有onTap事件 ...
dependencies: curved_navigation_bar: ^0.3.1 import 'package:curved_navigation_bar/curved_navigation_bar.dart'; 使用 items:按钮小部件列表 index:NavigationBar的索引,可用于更改当前索引或设置初始索引 color:NavigationBar的颜色,默认值为Colors.white buttonBackgroundColor:浮动按钮的背景色 backgroundColor: Navi...
bottomNavigationBar: NavigationBar( //菜单组 destinations: navigationList, //当前选中的 selectedIndex:_currentIndex , //选择点击事件 onDestinationSelected: (int index){ setState(() { _currentIndex = index; }); }, //背景颜色 backgroundColor: Colors.white, ...
2.3.BottomNavigationBarItem属性 icon:要显示的图标控件 title:要显示的标题控件 activeIcon:选中时要显示的icon backgroundColor:背景颜色,BottomNavigationBarType为shifting时, BottomNavigationBar的背景颜色,会覆盖BottomNavigationBar.backgroundColor 有兴趣的小伙伴,自己去试试吧!这里就不一一演示了!