From CupertinoTabView open a page that covers the tabs - flutter

I'm using CupertinoTabScaffold and CupertinoTabView for my App. For one screen that opens, I would like it to open so it entirely covers the screen, also the tabs. However, I want to use the same Navigator (as opposed to Navigator.of(context, rootNavigator: true) ) because I'm also using RouteAware and switching between navigators is breaking some RouteAware functionality. How can I do that?

Related

Calling Navigator.of(context, rootNavigator: true).pop() gives black screen

I have a open Chrome custom tab and then I open another app. This other app then opens my app via Asset Links and somehow my navigation stack is not preserved correctly. This means that a new page/widget is placed on top of my custom tab and I need the user to land on the custom tab again (I have another issue on this also, but now I just want to try a dirty fix).
So I want to just close that added page/widget. If I manually navigate back on my Android device via the back arrow, it works great and the added page/widget is closed and I see my custom tab.
I have tried calling
Navigator.of(context, rootNavigator: true).pop();
If I call "pop" once I get a black page and still if I then manually navigate back I come back to the custom tab. If I pop 2 times like this
Navigator.of(context, rootNavigator: true)..pop()..pop();
I get
The following assertion was thrown building Navigator-[LabeledGlobalKey#ad310](dirty, dependencies: [HeroControllerScope, UnmanagedRestorationScope], state: NavigatorState#e4365(tickers: tracking 1 ticker)):
'package:flutter/src/widgets/navigator.dart': Failed assertion: line 5203 pos 12: '!_debugLocked': is not true.
Still I can manually navigate back to the custom tab... Any ideas on mow I can close this widget on top and get back to my custom tab?
You have to remove rootNavigator: true which is causing you to pop from the first instance in your navigator. The navigator is like a list of pages that you opened in the order you opened them. That attribute is forcing all routing from the first page on the navigator, so when you pop, you remove everything and remain with no screen at all.
Try Navigator.of(context).pop();

How do you create a side navigation drawer that persists across pages?

I've looked through many tutorials for the side nav drawer. I can create one that works fine to lead to different pages. However, when I travel to a page that's different from home, it only gives me the arrow icon to go back to home at the top left instead of keeping the button to bring me back to the side navbar. How can I prevent this?
I can't use the home page to navigate everywhere because it's just supposed to be a blank splash screen.
You can define your drawer in a separate widget file, that you can import everywhere you have a scafold.
I created a package for it because I was missing similar functionality. If you want a Flutter approach for this navigation check out: https://api.flutter.dev/flutter/material/NavigationRail-class.html
Or if you want to have a look at my package: https://pub.dev/packages/side_navigation
It's because you're moving to a new page/Scaffold (probably using Navigator.push()). So, the default button in the AppBar will be the back button.
You can either have the same Drawer in every Scaffold you navigate to, which is not recommended since you'll just keep pushing routes to the navigation stack.
Or, you can change pages within the Scaffold. Check the interactive examples in BottomNavigationBar and NavigationRail to get an idea of how to do it. Basically instead of calling Navigator.push() when a tile in Drawer is tapped, just update the selected index and call setState().

Flutter close drawer on back button press in bottom navigation bar

I'm building a flutter app with persistent bottom navigation bar that contains a menu button.
The menu is supposed to open a drawer from any screen and trough the back button it should close it.
For that I'm using a scaffold including the bottom navigation widget and also the drawer.
This works fine for all screens that are directly accessible trough the bottom navigation bar.
The problem arises if I navigate (I'm using auto_route for routing) to another sub page.
In the sub page it seems that it is not possible to close the drawer.
In the sub page I dont provide a Scaffold since I would have nested scaffolds.
I'm using the WillPopScope and onPop looks like this:
if (Scaffold.of(context).isEndDrawerOpen) {
Navigator.of(context).pop();
Unfortunately this just pops the sub page while the drawer stays open.
One solution would be to pass a closing function to every child screen (or something like a global key for the global scaffold) but I would appreciate a more elegant solution
Do you have any idea how I can fix that?
Thanks in advance!

Flutter launch new independent screen

I am having trouble launching new screen widget. I have main.dart where I am using bottomNavigationBar and body for ViewPager UI. Now I have 3 bottom tabs and when I go to 2nd tab's view and click on a button to launch another screen/view using:
onTap: () => Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => ViewMyContactList(),
),
)
the new screen replaces the 2nd tab's view, when I go to 3rd tab then come back to 2nd tab, the new screen is gone and 2nd tab's initial screen is back. Also when new screen replaces the 2nd screen's initial view and when I do system back press in Android, the app exits straightaway.
You are trying to do Multiple Navigators with BottomNavigationBar
You can reference this doc for detail https://medium.com/coding-with-flutter/flutter-case-study-multiple-navigators-with-bottomnavigationbar-90eb6caa6dbf
Each tab must keep it'own Page Route, you can use the demo code in doc or
You can use the following two package to help you
https://pub.dev/packages/multi_navigator_bottom_bar
Helps you to build multi-navigator bottom navigation bar more easily.
https://pub.dev/packages/nested_navigators Flutter widget for implementing multiple nested navigators with their own route stacks.

How to route to page, without removing BottomNavigationBar in flutter?

I'm creating my first app in flutter, and i'm having issues with state management. I have a MainPage.dart with BottomNavigationBar, and body: with tabPages[MainTab, ...]. In the MainTab i have a ListView, and when i click ListView item, it should open details, however BottomNavigationBar shouldn't be removed.
Below i have a design.(I'm using Scoped Model).
I tried these solutions
https://gist.github.com/HansMuller/0e76c54b1f2d4423efbdc2c185e761ef and How to route to page, without removing BottomNavigationBar in flutter?
But in those cases, i can't route to page without bottom navigation. When i click on FLoatingActionButton: it should open new page without bottom navigation (BottomNavigationBar stay always at the bottom, even if i don't want it)
https://medium.com/#daniyargilimov/lutter-bottomnavigationbar-with-multiple-navigators-725ff013489c
here is the working example...