Flutter: How to properly listen to providers changes when on details page? - flutter

Here is my question, I have a simple grid list, where each tile contains a text and a favorite icon.
That grid is linked to a provider (which contains all the data), and each tile is linked to a nested provider which points to an individual element of the list provided above.
Now when I click on a tile I navigate to a details page, which just shows the name of the object, a favorite icon (outlined or not if the object is favorite or not) and a button "mark as favorite".
(I do that via Navigator with an argument representing my object, that I retrieve after from the grid provider)
Now when I click on the button I want to mark that object as a favorite, which is working fine (in the grid it shows the good status thanks to the provider), BUT how do I update my details page right away ?
Should I always use a stateful widget in that case ? or is there another way to "listen" to my item provider ?
I suppose that somehow I should be able to mark my details page as a listener of my provider, but I don't know how cause the details page is not in the same hierarchy as my grid tile...
Thanks for any feedback on this !

Related

How much should presenters know about the view?

I have a Flutter mobile application where I do request data from the backend, and each individual record of this data have it's own identifier and category. For each of these identifiers I want to display them properly and also redirect the user to the correct page of the app. An example:
User enter the page, and we request the data
Data arrives and we present it.
When clicking at each item, we should redirect the user to the appropriate page of that item.
Question 1) Where should the route definition be?
Currently I created a Widget and made a switch case on the identifiers to define the route of each one click.
But shouldn't this be done already in the presenter, so the view would only display it and create the callbacks to redirect it with the given route? My concern about it is that then the presenter would know too much about the View, or am I wrong?
Question 2) Each of those items that I mentioned have their priority, and in the view each priority is displayed in their own way, like Urgent priority is displayed in red and so on...
Should presenter also define these colors for the view? The problem is that this Color it's an object from the Flutter Framework which I would like to avoid in this layer...
My current implementation is like this:
View calls controller (bloc) which call usecase that responds with the needed data.
Presenter (same bloc) gets this data and format the correct title for each identifier
The view gets the view model from presenter and displays it, but also need to do a switch case on the identifier of each item to know about the color of the item on the screen and also the route to be redirected when clicked.
Any help is appreciated.

How to change the Form according to the item selected in the drop Down menu in Flutter

I have created I method which is showing a dialog and I called it with timer.run() method in order to show the dialog at the start of the screen automatically in which i have created a form (the code snippet is attached in the photos) and the form contains drop-down menu with two items(check and bank) now i want to make the UI as dynamic whenever the user selects the Bank option in the drop-down menu a new drop-down menu is displayed to him otherwise an empty container will be displayed to him.
Solutions I tried
created i variable which holds true if the item selected is bank otherwise false and used it as a condition to either show the 2nd drop-down or not.
Make the variable global but it also didn't worked.
created a function which i called with the variable to return either drop-down or empty container but it also didn't worked.
Created the bank selected variable in other class and access it with provider package but it also didn't worked for me.
The source code is also available at Github-Repo
Thanks all someone at linkedin helped me with the solution. which is
We have to wrap the AlertDialog with StatefulBuilder and have to call setState when option is selected then it will work.

How to create alert dialog on onTap on ListTile and select option to replace listTile value

Greetings everyone I'm new to flutter I need help implementing the simple feature of the Dialog.
I have a listTile consisting of members with different roles (Tressure, Secretary, Chair Person, and Ordinary Member)
Firstly I want to create an Alert dialog so that when I click on each listTile the dialog should pop up with the title "Change Member role" and below it should be the selectable options to set the selected option to the listTile
I need help creating the Alert dialog with these options and how to go about setting the text for the selected option to ListTile.
below is the link where I found the design, now I need the source code to implement the code
Click here for understanding the design
First of all I would make a class to represent a member Member (with fields like id, name, role, whatever else you need).
Then have a Provider for managing the members data. It will contain list of members like List<Member> and methods to make changes for this list. For example: for changing member's role it will contain changeMemberRole(int memberID) method, that will modify data in that list and call notifyListeners(); in the end.
After that on the screen that need to show list of members I would get an instance of this provider, build all list tiles using it's data, and it will automatically rebuild the list once data changes.
Links that should help:
Simple state management (for understanding Providers)
Using modal bottom sheet (for dialog), but you can use AlertDialog as well

update and pass data to next tab on navigation rail in flutter

I am using navigation rail and I am trying to pass data from one tab to next from the body but I am unable to do so and I haven't find any resource on it. Kindly guide me ,if there is any other widget that can perform the task I am trying to achieve
For Passing Data Between Widgets, you need to pass it from a common parent. in your case, your first page should save its data in the MainPage(The Page holding the NavigationRail) and then the second Page gets its data from MainPage.
This type of problem is more commonly solved by using a state management solution. The Flutter site has a list of them here.
Provider is an easy to use package that can provide an object throughout your widget tree. this way you can get a shared object between the two pages and use it to exchange data.

Displaying the wiki content dynamically beside each image

I want to display images of 10 people on my dashboard, when i hover the image dynamically it needs to display a wiki page to the side of each image related to that person, how do i achieve this in tableau?
Here are the steps after you have a dashboard with your people on one of the charts. My example uses the pesticide list from the most recent #makeovermonday.
In your dashboard, drag the web page object in.
Click the option dropdown of that new object and click Add URL Action.
In the popup place the main portion of your wikipedia url in the box and select your people field which will become the dynamic portion of the URL. Mine is pesticides.
Change Run action on to Hover
Now when you hover on your main chart it will update the web page object with the person hovered on. I just hovered on Atrazine in this image
You will probably have to update your people names to make sure they match wikipedia's url.