I'm trying to make a Gym app. You can add a workout by pressing the + on the appbar, and this takes you to a new screen where you can add the information about all the exercises and the workout name. When you press the check button, it goes back to the main screen where it displays all the workout that you've created, so that if you tap on a list tile it displays all the exercises.
My problem is that I don't know how to pass all the information about the exercises back to the main page. The only thing that I pass back is the workout name. My idea was to pass a Map<String workoutName, List> so that in the main page I have everything that I need. What do you think about it?
P.S. Rn I'm not storing anything in LocalStorage yet, mainly because I don't know what to store I was thinking about storing the Map<String workoutName, List> But I'm a fresh dev on Flutter so there may be easier solutions.
There are many ways to do this. Because of the inevitable growth of your requirements, I suggest going with the most common way to both pass variables and control your state. Meaning: when your variables change, when you return to your original screen, the screen also rebuilds to show your new information. Riverpod has become the successor to the previously Flutter team recommended State Management solution.
I suggest finding a nice, popular tutorial on Riverpod, perhaps building an app entirely with the video to give yourself a good start.
Related
I'm working towards designing an interactive menu. The main idea is a dashboard with some buttons within (see picture for example). After an user clicks on the picture, the app would render a similar dashboard, but with different buttons.
The flow of the dashboard would have depth 3 => Main categories => sub categories => sub sub categories.
My question here is, what is the best practice to avoid the user from generating a lot of screens within the app (by clicking a lot of buttons)? Does flutter automatically take care of this? I guess my main concern is, what could go wrong in terms of designing something like this in terms of cell phone using too much power to render the app?
Thanks!
My humble approach toward this is to create only one view (screen) and use a state management package to update the view. I'm familiar with flutter_bloc.
In your state you would define an int to keep track of the menu level:
menuLevel == 0: main memu
menuLevel == 1: sub menu
menuLevel == 2: sub sub menu
Then in your view's BlocBuilder you update the view based on the menuLevel state property.
This answer might sound a bit vag because it assumes that you are familiar with state management in Flutter. In particular with flutter_bloc. If not, I strongly recommend you learn a bit more about state management as it will save you time and help you better tackle this kind of situation in an efficient manner.
I've been reading the tutorials etc. and I'm now implementing Shared Preferences to save variables between screens. In my app the user moves to and from items in a ListView widget, and may return to a particular screen, I need to save their activity there in case of that.
In Java on Android you would save to sharePrefs when the user exits an activity (screen) because it's a slow operation and saving each time a variable changes is not performant.
Is there a best practice time to save in flutter? How do you know a user is exiting a screen, and descending back to an earlier dart file?
Apologies if this is a turbo ignorant question.
When you exit a page in Flutter, the dispose method is called so I think you could save the Shared Preferences in that method.
Here's a pretty good article on this area: https://medium.com/flutter-community/widget-state-buildcontext-inheritedwidget-898d671b7956
I tried the example which is showing how to get data from history to re-generate UI; The thing I see mostly in all "history usage" examples are related to UI re-generation only so it is none-static way...
But what about "each UI state may have its unique url something like JSF does with flows"? For example I have app url like a
http://localhost:8080/myapp/MyApp.html
the app default UI contains main menu which is helping to navigate through my test catalog; I tried to make possible keep the UI dynamics in history by building url in this way
http://localhost:8080/myapp/MyApp.html#menu_testcategory_page1
but when I click internet browser "refresh" button the url keeps the same as http://localhost:8080/myapp/MyApp.html#menu_testcategory_page1 but the UI comes back to its default state :(
So my question is
is there an optimal way in pure gwt to stay in the same UI state even after browser's refresh button is clicked (I mean the unload/load window events occur)?
thanks
P.S. gwt 2.3
You should implement Activities and Places pattern: http://www.gwtproject.org/doc/latest/DevGuideMvpActivitiesAndPlaces.html
I am using it for 3 years, and it works very well.
Note, however, that when you reload a page, you lose all of your state, data, etc. If you need to preserve some of it, you can use a combination of a Place (#page1) and a token that tells the corresponding Activity the state of the View representing this Place, i.e. (#page1:item=5).
You probably just forgot to call
History.fireCurrentHistoryState();
from your entry point.
I'm in the process of comparing MvvmCross with ReactiveUI for a major pharma project on Win Store, WP8, iOS, Droid. We've already selected Xamarin.
I'm totally new to ReactiveUI. I really like what I see in principle, and I think Paul is a genius. However the details are becoming a real bear. I've spend several days tracking down documentation (the manual is from 2011 and seems almost entirely outdated - it doesn't even contain the word "Router") and sample code.
I'm looking at the sample from ReactiveUI.Samples
Also the project MobileSample-RT from the ReactiveUI solution.
I based my little hello world on the ReactiveUI.Samples "Routing" example. Frankly this isn't much of an example as all it does is navigate from AppBootstrapper to the one and only view. I'm trying to do something similar to the "three page" example from MobileSample-RT. The problem is, if I try something like this in my project:
HostScreen.Router.Navigate.Execute(RxApp.DependencyResolver.GetService(typeof(LoginViewModel)));
It crashes (pdb symbols not loaded in ReactiveUI.dll)
If I try this:
HostScreen.Router.NavigateCommandFor<LoginViewModel>().Execute(HostScreen);
Same result - hard crash. That really threw me as it seems like something that should "just work".
I can call this:
HostScreen.Router.Navigate.Execute(new LoginViewModel(HostScreen));
And it does go to my view, as expected. I also wired up a back button in the main screen:
this.OneWayBind(AppBootstrapper, x => x.Router.NavigateBack, x => x.BackButton.Command);
And that indeed moves back from the view to which I'd just navigated.
So now I want to move forward again. I click on the button that does this (again):
HostScreen.Router.Navigate.Execute(new LoginViewModel(HostScreen));
And I go back to that view. However this time it takes 2 clicks on the back button to get actually move back. If I then move forward again, it takes 3 clicks the next time. The NavigationStack is filling up with new instances of LoginViewModel.
So, what IS the correct way to do routing/navigation? Why are those commands crashing? Rather than calling "new" each time in the Navigate.Execute, how do I navigate to a viewmodel that is already in the navigation stack (or should it be there in the first place?).
Many thanks for any clarity you can provide.
If you're building for iOS and Android, you simply don't want to use Routing - the notion of routing conflicts too much with what the platforms want you to do (even on WP8 it's a stretch but I was able to hacky make it work). You should stick with View-first location.
However, if you're using Xamarin Forms, ReactiveUI works great with VM-based routing (since Xamarin managed to do all the hacks to make it possible!). Check out https://github.com/paulcbetts/xamarinevolve2014 for a demo of it
I know the docs suck and I'm working on new ones:
https://github.com/reactiveui/ReactiveUI/pull/391 - Pull Request / Progress
https://github.com/reactiveui/ReactiveUI/tree/docs/docs/basics - Browsable version
Im pretty new in using the MVVM architecture and looking for some advice on the "correct" to approach this task.
2 page app.
Page 1 displays the alphabet.
Page 2 displays the selected character's details.
Example - Select "A" and screen 2 displays apple, Apricot, Aprium. Select "B" screen 2 displays Banana, Blackberry, Blackcurrant, Blueberry.
Data is being retrieved from a web service everytime the user selects an alphabet character.
Would the correct approach be to create a static menu for screen 1 (as you would never have anything else other than the alphabet characters) and on the click event load the second screen with the items as above using the MVVM approach (i.e. pass in the selected character to the LoadItems method). Or is there a simpler way to do this using a MVVM structure?
Ive read around and its not very clear on when to use which approach but then again as i say im new with MVVM too and would like to learn the correct/preferred way so i can get a better understanding.
Another approach which maybe more in-keeping with the Windows Phone experience would be to have a single page containing a LongListSelector. Fruit bound to this view could then be grouped by letter. Implementing a JumpList would allow users to quickly navigate this list by jumping between groups. You can find a sample implementation here- http://msdn.microsoft.com/en-us/library/windowsphone/develop/jj244365(v=vs.105).aspx
Microsoft actually prefers that when you use a list in windows phone it is always better to display it in another page. So you should populate the list in another page. And if you are selecting some thing to show then pass them as parameters using the NavigationService.Navigate or store the data in Phone Application State if you have to use app wide. Phone.Application.Resources . Its good that you are going through Mvvm You'll know Xaml, WP7,8, Get Metro Application Idea also Silverlight.
Heres a toolkit that might help you. It also displays the same way in a new Windows Not a popup
Long List Selector