Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

While using persistent_bottom_nav_bar_v2 5.2.3, snackbar is displaying on the top(above appbar) of the screen #174

Open
akhilbiju3 opened this issue Jun 25, 2024 · 1 comment

Comments

@akhilbiju3
Copy link

Version

5.2.3

Flutter Doctor Output

Flutter (Channel stable, 3.22.2, on Microsoft Windows [Version 10.0.19045.4529], locale en-IN)
    • Flutter version 3.22.2 on channel stable at C:\Users\Akhil\Documents\flutter_windows_3.10.5-stable\flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 761747bfc5 (3 weeks ago), 2024-06-05 22:15:13 +0200
    • Engine revision edd8546116
    • Dart version 3.4.3
    • DevTools version 2.34.3

[√] Windows Version (Installed version of Windows is version 10 or higher)

[√] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at C:\Users\Akhil\AppData\Local\Android\sdk
    • Platform android-34, build-tools 34.0.0
    • Java binary at: C:\Program Files\Android\Android Studio\jbr\bin\java
    • Java version OpenJDK Runtime Environment (build 17.0.10+0--11572160)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe

[√] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.8.6)
    • Visual Studio at C:\Program Files\Microsoft Visual Studio\2022\Community
    • Visual Studio Community 2022 version 17.8.34525.116
    • Windows 10 SDK version 10.0.22621.0

[√] Android Studio (version 2023.3)
    • Android Studio at C:\Program Files\Android\Android Studio
    • Flutter plugin can be installed from:
       https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
       https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 17.0.10+0--11572160)

[√] VS Code (version 1.90.2)
    • VS Code at C:\Users\Akhil\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 3.90.0

[√] Connected device (5 available)
    • M2101K6P (mobile)            • abda523b      • android-arm64  • Android 13 (API 33)
    • sdk gphone64 x86 64 (mobile) • emulator-5554 • android-x64    • Android 13 (API 33) (emulator)
    • Windows (desktop)            • windows       • windows-x64    • Microsoft Windows [Version 10.0.19045.4529]
    • Chrome (web)                 • chrome        • web-javascript • Google Chrome 126.0.6478.115
    • Edge (web)                   • edge          • web-javascript • Microsoft Edge 126.0.2592.68

[√] Network resources
    • All expected network resources are available.

• No issues found!

What platforms are you seeing the problem on?

Android, iOS

What happened?

When using persistent_bottom_nav_bar_v2 5.2.3, snackbar is displaying on the top of the screen. This issue occurs where ever we use persistent bottom nav bar

Steps to reproduce

  1. Go to '...'
  2. Click on '....'
  3. Scroll down to '....'
  4. See error

Code to reproduce the problem

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

  @override
  State<BottomNavigation> createState() => _BottomNavigationState();
}

class _BottomNavigationState extends State<BottomNavigation> {
  // @override
  // void initState() {
  //   if (API.isLoggenIn == null || API.isLoggenIn == false) {
  //     Navigator.pushReplacement(
  //         context, MaterialPageRoute(builder: (context) => GymLoginPage()));
  //   }
  //   super.initState();
  // }

  PersistentTabController _controller = PersistentTabController(
    initialIndex: 0,
  );
  @override
  Widget build(BuildContext context) {
    final screens = [GymHome(), MembershipScreen(), CategoryScreen(), AnnouncementScreen(), ProfileScreen()];
    List<PersistentTabConfig> tabs() => [
          PersistentTabConfig(
            screen: const GymHome(),
            item: ItemConfig(
              activeForegroundColor: bottomNavigationActiveIconColor,
              inactiveForegroundColor: bottomNavigationInActiveIconColor,
              icon: Icon(CupertinoIcons.home),
              //title: "Home",
            ),
          ),
          PersistentTabConfig(
            screen: const MembershipScreen(),
            item: ItemConfig(
              activeForegroundColor: bottomNavigationActiveIconColor,
              inactiveForegroundColor: bottomNavigationInActiveIconColor,
              icon: Icon(CupertinoIcons.creditcard),
              //title: "Wishlist",
            ),
          ),
          PersistentTabConfig(
            screen: CategoryScreen(),
            item: ItemConfig(
              icon: Icon(CupertinoIcons.bag),
              activeForegroundColor: bottomNavigationActiveIconColor,
              inactiveForegroundColor: bottomNavigationInActiveIconColor,
              //title: "Categories",
            ),
          ),
          PersistentTabConfig(
            screen: const AnnouncementScreen(),
            item: ItemConfig(
              icon: Icon(CupertinoIcons.bell),
              activeForegroundColor: bottomNavigationActiveIconColor,
              inactiveForegroundColor: bottomNavigationInActiveIconColor,
              //title: "Cart",
            ),
          ),
          PersistentTabConfig(
            screen: const ProfileScreen(),
            item: ItemConfig(
              icon: const Icon(Icons.person),
              activeForegroundColor: bottomNavigationActiveIconColor,
              inactiveForegroundColor: bottomNavigationInActiveIconColor,
              //title: "Account",
            ),
          ),
        ];
    return Scaffold(
        bottomNavigationBar: PersistentTabView(
      navBarOverlap: NavBarOverlap.full(),
      controller: _controller,
      tabs: tabs(),
      navBarBuilder: (navBarConfig) => Style4BottomNavBar(
        navBarConfig: navBarConfig,
        navBarDecoration: NavBarDecoration(
          //boxShadow: const [BoxShadow(color: Colors.grey, blurRadius: 5)],
          color: bottombackgroundColor,
        ),
      ),
      backgroundColor: bottombackgroundColor,
      stateManagement: true,
      popAllScreensOnTapAnyTabs: true,
      popActionScreens: PopActionScreensType.all,
      screenTransitionAnimation: const ScreenTransitionAnimation(
        curve: Curves.ease,
        duration: Duration(milliseconds: 200),
      ),
    ));
  }
in the above code there is a profile page and there i tried to call ScaffoldMessenger.of(context).showSnackBar(SnackBar(
                                              content: Text("Referral Code Copied"),
                                            )); 
at that time issue occured

Relevant log output

No response

Screenshots

image

@akhilbiju3 akhilbiju3 changed the title While using persistent_bottom_nav_bar_v2 5.2.3, snackbar is displaying on the top of the screen While using persistent_bottom_nav_bar_v2 5.2.3, snackbar is displaying on the top(above appbar) of the screen Jun 25, 2024
@jb3rndt
Copy link
Owner

jb3rndt commented Jun 30, 2024

The problem is that the PersistentTabView is set as the child of the Scaffold.bottomNavigationBar. Instead, just remove the scaffold. The PersistentTabView serves as a container for all the full size screens and the bottom navigation bar.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants