flutternavbarpersistent

Failed assertion: line 125 pos 12: 'assertMidButtonStyles(navBarStyle, items!.length)'


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.


Solution

  • 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.