I have a problem when i navigate to multiple pages and then show search.
More specifically, i have a product page with some details. At the bottom there is a list of similar products.
The flow is:
open many similar products (so I navigate to the same screen using Navigator pushNamed).
then, navigate from the las product page to the search page
tap on search bar, open search delegate using the showSearch function
My issue is that when i tap on the search bar, then the whole widget tree is rebuilded and my app is very heavy because rebuilds the previous product pages and everything else.
This happens due to the general rebuild on keyboard changes(i.e: showing and hiding Keyboard).
I recommend to have a heavy operation like loading data from backend should be held on initState in State with StatefullWidget.
Try to debug and understand why do you rebuild the tree. It seems to me, that you need to simplify a navigation flow.
Related
sorry in advance if i didnt describe my question clearly:
I have several pages made by PageView.builder, while swiping these pages on main screen left and right, I found their initState is already working, and GetXController inside are also loading their data. I use Get.delete<Controller> while clicking back button and coming back to main screen to remove these data.
However, the state and data will bring back to main screen if I didnt activate Get.delete<Controller>, and therefore next time I come to this page, the state of page will be not default, for instance the button still keep pressed status.
So my question is how to prevent page.builder to build the widget before I come inside to this page, or how to delete getxcontroller if I am not in this page. Thanks a lot!
Try resetting the GetX by calling
Get.reset(); --> this will re-initialize controllers
Alternatively calling
Get.put(ControllerName()); in a build method will re-initialize the controller
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().
I have a problem with my Here Maps Navigation. I can start the navigation on my flutter app but every time I open another page on the app and come back to the navigation page, it restarts the navigation. It tries to get the current location again, takes a lot of time to do that, and shows the default "invalid" map page. I want the navigation to save it's current state even if I change the view to another page on my app and come back to navigating. Is there a way to do this? Am I missing something here?
I finally found a way to solve it by saving the state of my Flutter pages. I used the PageView widget for the main.dart's scaffold body and AutomaticKeepAliveClientMixin on the pages I wanted to save the states of. You can check this YouTube video for how to implement this: https://www.youtube.com/watch?v=fGe45NikVqE
I understand the basics here. If my data is going to change it should be stateful so I can update it otherwise stateless.
My question is more oriented in a bottomnavigation scenario. So, I have 3 tabs in my bottomnavigator (Profile, Home, Settings). The entry point is Home which is a stateful Widget.
The other two Widgets I want to basically populate the information in them with the api data.
The Problem
If I am in the Home screen and I click in the Profile icon in the bottomnavigator it does not load the information from the api. Even if it does, If I click in the Home screen and click again in the Profile screen to go back, the information does not refresh.
Solution
So what would be the way to handle this? I expect that if I click in each of the bottomnavigation items the information is refreshed with the api data. Is this because the Widgets are Stateful or Stateless or I am missing something else?
By default, the pages in Bottom Navigation bar refreshes/rebuild when they are are tapped on.
Make sure a few things in your app-
You are not using a "indexed stack" or any similar widget for these pages. These widgets preserves the state of your page
The navigation is taking place on its own. You have not defined any Navigator.Push etc for tap's in navigation bar.
You should call the API inside the initState method of that particular page. Like if you need profile details, call the api for profile information inside the initState method of Profile Tab and not the "Scaffold" page which has the navigation bar.
I'm making an app with a BottomNavigationBar with 5 different screens, each of them has a web view. The problem is that everytime I come back to a screen that was previously loaded, it reloads. I have tried using AutomaticKeepAliveClient from copy pasting this code but I doesn't seem to work. I'm new with Flutter so be precise please, thank you.
AutomaticKeepAliveClient is mainly used for keeping a child alive in lazily rendered list views. In your case whenever you switch tabs your current page get disposed and new page materializes on top of it, that means each time when you switch tab a new page is created including all it's widgets.
So if you want to keep your previously loaded web views alive, you have to go with either PageView widget or use Stack widget to load your pages programmatically while the user clicks on a tab.
This is a detailed example about implementing your requirement using PageView widget . you can also find an example with Stack widget under that question.