I have some problems while I use persistent_bottom_nav_bar, which is flutter package.
What I'm suffering from is same as below:
▽ bottomNav.dart
import 'package:flutter/material.dart';
import 'package:persistent_bottom_nav_bar/persistent-tab-view.dart';
import 'package:project1_makers/main.dart';
class bottomNav extends StatelessWidget {
PersistentTabController _controller = PersistentTabController(initialIndex: 0);
@override
Widget build(BuildContext context) {
return PersistentTabView(
context,
controller: _controller,
screens: _buildScreens(),
items: _navBarsItems(),
confineInSafeArea: true,
backgroundColor: Colors.white,
// Set Components with true/false
handleAndroidBackButtonPress: true,
resizeToAvoidBottomInset: true,
stateManagement: true,
hideNavigationBarWhenKeyboardShows: true,
decoration: NavBarDecoration(
borderRadius: BorderRadius.circular(10.0),
colorBehindNavBar: Colors.white,
),
popAllScreensOnTapOfSelectedTab: true,
popActionScreens: PopActionScreensType.all,
itemAnimationProperties: ItemAnimationProperties(
duration: Duration(milliseconds: 200),
curve: Curves.ease,
),
screenTransitionAnimation: ScreenTransitionAnimation(
animateTabTransition: true,
curve: Curves.ease,
duration: Duration(milliseconds: 200),
),
navBarStyle: NavBarStyle.style15,
);
}
List<Widget> _buildScreens(){
return [
MyHomePage(),
];
}
List<PersistentBottomNavBarItem> _navBarsItems(){
return [
PersistentBottomNavBarItem(
icon: Icon(Icons.home),
title: ("Home"),
activeColorPrimary: Color(0xFF254690),
inactiveColorPrimary: Color(0xFFD3DAE9),
),
PersistentBottomNavBarItem(
icon: Icon(Icons.chat_rounded),
title: ("Chat"),
activeColorPrimary: Color(0xFF254690),
inactiveColorPrimary: Color(0xFFD3DAE9),
),
];
}
}
▽ main.dart
import 'package:flutter/material.dart';
import 'package:project1_makers/bottomNav.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(primaryColor: Colors.white),
debugShowCheckedModeBanner: false,
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
@override
State<StatefulWidget> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Stack(
children: <Widget>[
bottomNav(),
],
)
);
}
}
▽ result
══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
The following assertion was thrown building bottomNav(dirty):
NavBar styles 15-18 only accept 3 or 5 PersistentBottomNavBarItem items.
'package:persistent_bottom_nav_bar/persistent-tab-view.widget.dart':
Failed assertion: line 125 pos 12: 'assertMidButtonStyles(navBarStyle, items!.length)'
The relevant error-causing widget was:
bottomNav [My_direction]
When the exception was thrown, this was the stack:
#2 new PersistentTabView (package:persistent_bottom_nav_bar/persistent-tab-view.widget.dart:125:12)
#3 bottomNav.build (package:project1_makers/bottomNav.dart:11:12)
#4 StatelessElement.build (package:flutter/src/widgets/framework.dart:4648:28)
#5 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4574:15)
#6 Element.rebuild (package:flutter/src/widgets/framework.dart:4267:5)
#7 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:4553:5)
#8 ComponentElement.mount (package:flutter/src/widgets/framework.dart:4548:5)
#9 Element.inflateWidget (package:flutter/src/widgets/framework.dart:3611:14)
#10 MultiChildRenderObjectElement.inflateWidget (package:flutter/src/widgets/framework.dart:6221:36)
#11 MultiChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:6232:32)
... Normal element mounting (19 frames)
#30 Element.inflateWidget (package:flutter/src/widgets/framework.dart:3611:14)
#31 MultiChildRenderObjectElement.inflateWidget (package:flutter/src/widgets/framework.dart:6221:36)
#32 MultiChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:6232:32)
... Normal element mounting (238 frames)
#270 Element.inflateWidget (package:flutter/src/widgets/framework.dart:3611:14)
#271 MultiChildRenderObjectElement.inflateWidget (package:flutter/src/widgets/framework.dart:6221:36)
#272 MultiChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:6232:32)
... Normal element mounting (345 frames)
#617 Element.inflateWidget (package:flutter/src/widgets/framework.dart:3611:14)
#618 Element.updateChild (package:flutter/src/widgets/framework.dart:3363:18)
#619 RenderObjectToWidgetElement._rebuild (package:flutter/src/widgets/binding.dart:1189:16)
#620 RenderObjectToWidgetElement.mount (package:flutter/src/widgets/binding.dart:1159:5)
#621 RenderObjectToWidgetAdapter.attachToRenderTree.<anonymous closure> (package:flutter/src/widgets/binding.dart:1104:18)
#622 BuildOwner.buildScope (package:flutter/src/widgets/framework.dart:2535:19)
#623 RenderObjectToWidgetAdapter.attachToRenderTree (package:flutter/src/widgets/binding.dart:1103:13)
#624 WidgetsBinding.attachRootWidget (package:flutter/src/widgets/binding.dart:937:7)
#625 WidgetsBinding.scheduleAttachRootWidget.<anonymous closure> (package:flutter/src/widgets/binding.dart:917:7)
(elided 13 frames from class _AssertionError, class _RawReceivePortImpl, class _Timer, dart:async, and dart:async-patch)
I'd like to use NavBarStyle 15, but it is hard to apply.
Would you help me to fix this error?
It would be appreciated when you point out something is lack on my description.
This is easy to solve, take a closer look at the error message itself, there it says the following: NavBar styles 15-18 only accept 3 or 5 PersistentBottomNavBarItem items.
But you only have 2 PersistentBottomNavBarItems in your _navBarsItems
list.