二、播放器页面对导航栏状态栏的修改设置 @overrideWidgetbuild(BuildContextcontext){super.build(context);SystemUiOverlayStylevalue;if(Platform.isAndroid){value=SystemUiOverlayStyle(statusBarColor:Colors.transparent,/// 安卓系统状态栏存在底色,所以需要加这个systemNavigationBarColor:Colors.transparent,systemNavigat...
Scaffold的属性bottomNavigationBar配置的就是页面的底部的导航栏菜单,这里使用了NavigationBar,NavigationBar中destinations属性用来配置菜单选项,要求最少有两个子菜单选项,本实现中定义如下: static const List<NavigationDestination> navigationList = [ NavigationDestination( tooltip: "", icon: Icon(Icons.widgets_outli...
unselectedLabelStyleTextStyle未选中时子项文字的style fixedColorColortype为fixed时导航栏的颜色,默认使用ThemeData.primaryColor iconSizedouble图标大小 需要注意,BottomNavigationBar如果不指定type,则当items小于4个时,type属性值为fixed,大于或等于4个时,则值会变为shifting,通常需要显式的将type设置为fixed以达到期望...
bottomNavigationBar: BottomNavigationBar( currentIndex:this._currentIndex,//配置对应的索引值选中onTap: (intindex) { setState(() {//改变状态this._currentIndex =index; }); }, iconSize:36.0,//icon的大小fixedColor: Colors.red,//选中的颜色type: BottomNavigationBarType.fixed,//配置底部tabs可以有多...
自定义BottomNavigationBar的样式包括颜色、形状和大小。你可以通过设置backgroundColor、elevation和shape属性来实现。 BottomNavigationBar(// 导航项数组items:_navItems,// 当前选中项的索引currentIndex:_currentIndex,// 点击导航项时触发的回调函数onTap:_onItemTapped,// 自定义选中项的颜色selectedItemColor:Colors....
BottomNavigationBar => 小型屏(宽度小于 640) Drawer => 大型屏(宽度大于 960) 这三种组件一般会配合Scaffold一起使用,为了让导航组件能够根据屏幕尺寸进行动态调整,我们来实现一个「自适应」的Scaffold。 步骤1:新建一个 dart 源文件,命名为adaptive_scaffold.dart。
appBar:newAppBar( title:newText('TabBar Demo'), leading:Icon(Icons.menu), actions: <Widget>[ Icon(Icons.search) ], bottom:newTabBar( tabs:_myTabs, indicatorColor: Colors.black, indicatorWeight:5, indicatorSize: TabBarIndicatorSize.label, ...
BottomNavigationBarItem( icon: Icon(Icons.person), label: 'Profile', ), ], ), ), ); } } 在上述代码中,我们通过设置BottomNavigationBar的backgroundColor属性为Colors.blue来将底部菜单的背景颜色更改为蓝色。你可以根据需要选择不同的颜色。
(bottomNavigationBar:NavigationBar(onDestinationSelected:(intindex){setState((){currentPageIndex=index;});},indicatorColor:Colors.black,selectedIndex:currentPageIndex,destinations:const<Widget>[NavigationDestination(selectedIcon:Icon(Icons.home),icon:Icon(Icons.home_outlined),label:"Home",),Navigation...
NavigationRail(backgroundColor:Colors.blueGrey,// 设置导航栏的背景色// 其他配置属性...) 选中项颜色:使用selectedIconTheme属性设置选中项的图标主题,以及selectedLabelTextStyle属性设置选中项的标签文本样式。 代码语言:javascript 复制 NavigationRail(selectedIconTheme:IconThemeData(color:Colors.red),// 设置选中项...