Home > Software engineering >  Persistent Navigation Bar Error in Flutter
Persistent Navigation Bar Error in Flutter

Time:08-21

I am new to flutter and wanted to add a persistent navigation bar that will contain 4 icons leading to 3 different pages with icon-1 as the default home screen. The code is attached below.

The version of the Persistent Bottom Nav Bar I am using is 4.0.2

Home Screen

import 'package:flutter/material.dart';
import 'package:myspace/widgets/right_drawer.dart';
import 'package:myspace/widgets/bottom_navigation_bar.dart';
import 'package:persistent_bottom_nav_bar/persistent-tab-view.dart';


class HomeScreen extends StatefulWidget {
  const HomeScreen({Key? key}) : super(key: key);

  @override
  State<HomeScreen> createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.transparent,
        elevation: 0.0,
        title: Text(
          'mySpace',
          style: TextStyle(
            fontSize: 24.0,
            fontWeight: FontWeight.bold,
            color: Colors.blue.shade900
          ),
        ),
        actions: [
          Builder(
            builder: (context) => IconButton(
                onPressed: () => Scaffold.of(context).openEndDrawer(),
                icon: Icon(Icons.account_circle, color: Colors.blue.shade900, size: 30.0,)
            ),
          ),
        ],
      ),
      endDrawer: const RightDrawerWidget(),
      bottomNavigationBar: BottomListWidget(),
    );
  }
}

and the widget file for Bottom Navigation Bar :

import 'package:flutter/material.dart';
import 'package:myspace/Screens/homescreen.dart';
import 'package:myspace/Screens/chat_system.dart';
import 'package:myspace/Screens/help_and_support.dart';
import 'package:myspace/Screens/news.dart';
import 'package:persistent_bottom_nav_bar/persistent-tab-view.dart';

class BottomListWidget extends StatefulWidget {
  const BottomListWidget({Key? key}) : super(key: key);

  @override
  State<BottomListWidget> createState() => _BottomListWidgetState();
}

class _BottomListWidgetState extends State<BottomListWidget> {

  PersistentTabController _controller = PersistentTabController(initialIndex: 0);

  @override
  Widget build(BuildContext context) {
    return PersistentTabView(
        context,
        controller: _controller,
        screens: _buildScreens(),
      items: _navBarItems(),
      confineInSafeArea: true,
      itemAnimationProperties: const ItemAnimationProperties(
        duration: Duration(milliseconds: 200),
        curve: Curves.ease,
      ),
      screenTransitionAnimation: const ScreenTransitionAnimation(
        duration: Duration(milliseconds: 200),
        curve: Curves.ease,
        animateTabTransition: true
      ),
      navBarStyle: NavBarStyle.style10,
    );
  }
}

List<PersistentBottomNavBarItem> _navBarItems() {
  return [
    PersistentBottomNavBarItem(
      icon: const Icon(Icons.home),
      title: ('Home'),
      activeColorPrimary: Colors.blue.shade800,
      inactiveColorPrimary: Colors.grey,
    ),
    PersistentBottomNavBarItem(
      icon: const Icon(Icons.newspaper_sharp),
      title: ('Happenings'),
      activeColorPrimary: Colors.blue.shade800,
      inactiveColorPrimary: Colors.grey,
    ),
    PersistentBottomNavBarItem(
      icon: const Icon(Icons.support_agent_rounded),
      title: ('Help'),
      activeColorPrimary: Colors.blue.shade800,
      inactiveColorPrimary: Colors.grey,
    ),
    PersistentBottomNavBarItem(
      icon: const Icon(Icons.message),
      title: ('Chats'),
      activeColorPrimary: Colors.blue.shade800,
      inactiveColorPrimary: Colors.grey,
    ),
  ];
 }

 List<Widget> _buildScreens() {
  return [
    const HomeScreen(),
    const RecentNewsScreen(),
    const HelpAndSupport(),
    const ChatSystem()
  ];
 }

After building this app I am getting error as:

Launching lib\main.dart on EB2101 in debug mode...
Running Gradle task 'assembleDebug'...
/E:/flutter/.pub-cache/hosted/pub.dartlang.org/persistent_bottom_nav_bar-4.0.2/lib/persistent-tab-view.widget.dart:368:22: Warning: Operand of null-aware operation '!' has type 'WidgetsBinding' which excludes null.
 - 'WidgetsBinding' is from 'package:flutter/src/widgets/binding.dart' ('/E:/flutter/packages/flutter/lib/src/widgets/binding.dart').
      WidgetsBinding.instance!.addPostFrameCallback((_) {
                     ^
/E:/flutter/.pub-cache/hosted/pub.dartlang.org/persistent_bottom_nav_bar-4.0.2/lib/animations/animations.dart:55:20: Warning: Operand of null-aware operation '!' has type 'WidgetsBinding' which excludes null.
 - 'WidgetsBinding' is from 'package:flutter/src/widgets/binding.dart' ('/E:/flutter/packages/flutter/lib/src/widgets/binding.dart').
    WidgetsBinding.instance!.addPostFrameCallback((_) {
                   ^
/E:/flutter/.pub-cache/hosted/pub.dartlang.org/persistent_bottom_nav_bar-4.0.2/lib/nav-bar-styles/style-6-bottom-nav-bar.widget.dart:44:20: Warning: Operand of null-aware operation '!' has type 'WidgetsBinding' which excludes null.
 - 'WidgetsBinding' is from 'package:flutter/src/widgets/binding.dart' ('/E:/flutter/packages/flutter/lib/src/widgets/binding.dart').
    WidgetsBinding.instance!.addPostFrameCallback((_) {
                   ^
/E:/flutter/.pub-cache/hosted/pub.dartlang.org/persistent_bottom_nav_bar-4.0.2/lib/nav-bar-styles/style-8-bottom-nav-bar.widget.dart:44:20: Warning: Operand of null-aware operation '!' has type 'WidgetsBinding' which excludes null.
 - 'WidgetsBinding' is from 'package:flutter/src/widgets/binding.dart' ('/E:/flutter/packages/flutter/lib/src/widgets/binding.dart').
    WidgetsBinding.instance!.addPostFrameCallback((_) {
                   ^
/E:/flutter/.pub-cache/hosted/pub.dartlang.org/persistent_bottom_nav_bar-4.0.2/lib/nav-bar-styles/style-11-bottom-nav-bar.widget.dart:46:20: Warning: Operand of null-aware operation '!' has type 'WidgetsBinding' which excludes null.
 - 'WidgetsBinding' is from 'package:flutter/src/widgets/binding.dart' ('/E:/flutter/packages/flutter/lib/src/widgets/binding.dart').
    WidgetsBinding.instance!.addPostFrameCallback((_) {
                   ^
/E:/flutter/.pub-cache/hosted/pub.dartlang.org/persistent_bottom_nav_bar-4.0.2/lib/nav-bar-styles/style-12-bottom-nav-bar.widget.dart:46:20: Warning: Operand of null-aware operation '!' has type 'WidgetsBinding' which excludes null.
 - 'WidgetsBinding' is from 'package:flutter/src/widgets/binding.dart' ('/E:/flutter/packages/flutter/lib/src/widgets/binding.dart').
    WidgetsBinding.instance!.addPostFrameCallback((_) {
                   ^
/E:/flutter/.pub-cache/hosted/pub.dartlang.org/persistent_bottom_nav_bar-4.0.2/lib/nav-bar-styles/style-13-bottom-nav-bar.widget.dart:46:20: Warning: Operand of null-aware operation '!' has type 'WidgetsBinding' which excludes null.
 - 'WidgetsBinding' is from 'package:flutter/src/widgets/binding.dart' ('/E:/flutter/packages/flutter/lib/src/widgets/binding.dart').
    WidgetsBinding.instance!.addPostFrameCallback((_) {
                   ^
/E:/flutter/.pub-cache/hosted/pub.dartlang.org/persistent_bottom_nav_bar-4.0.2/lib/nav-bar-styles/style-14-bottom-nav-bar.widget.dart:46:20: Warning: Operand of null-aware operation '!' has type 'WidgetsBinding' which excludes null.
 - 'WidgetsBinding' is from 'package:flutter/src/widgets/binding.dart' ('/E:/flutter/packages/flutter/lib/src/widgets/binding.dart').
    WidgetsBinding.instance!.addPostFrameCallback((_) {
                   ^

CodePudding user response:

The package is 17 months old and doesn't support flutter version 3.0 .. I assume that you are running flutter version >3 which isn't supported by this package.. Try some other package or downgrade flutter version. You can also fork the repo and update the widget binding codes and use them.

CodePudding user response:

Kindly use this persistent_bottom_nav_bar_v2

This package is a continuation of persistent_bottom_nav_bar which currently is not continued.

  • Related