MVVM and modality in portable view models - mvvm

My app (written using MvvmCross and with MVVM pattern in mind) needs to display popup windows where user can choose of confirm certain options. So basically it's a classic modal dialog, but since the app's view model is implemented in a portable class library, it needs to tackle modality in a generalized sense - some platforms simply don't have exact match for a modal dialog.
There are a few threads discussing dialogs in MVVM (Open dialog in WPF MVVM, WPF MVVM dialog example). Following their advices I could probably solve this by introducing DialogService and implementing it for each platform. However I will be treating then dialogs like other services - storage service, map service etc.. But a dialog is a part of the presentation concept, so I wonder if it can be treated more like a view, so instead of calling an instance of an obscure IDialogService I could navigate to it using an MVVM framework of my choice (MvvmCross in my case).
I checked MvvmCross implementation and samples but found almost no dialog-related stuff.

Within MvvmCross, the presenter is responsible for how Views/ViewModels are shown when using ShowViewModel.
This presenter is a view/UI level object - it's ultimately the UIs job to decide if a view should be shown as a page, as a control, in a tab, in a split-view, as a dialog, etc.
v3 does introduce a presentation hint that the ViewModel can help suggest how the View should be shown - but it's up to the presenter on each platform to determine how (if) to use this hint.
Alternatively, Dialogs/flyouts/etc can easily be shown using MvxMessenger messages from ViewModel to View with a little bit of code behind.
For 'modality', also consider Greg's post on 'returning results' - see http://www.gregshackles.com/2012/11/returning-results-from-view-models-in-mvvmcross/

Related

How do you bind a ViewModel to the Windows 8 Settings pane in MvvmCross?

I've been looking at MvvmCross for cross platform mobile development.
Since navigation of views is done by calling ShowViewModel<>(), how would you create the settings pane (which is a user control) in Windows 8 using MvvmCross?
MvvmCross provides a general ShowViewModel<T> navigation mechanism which uses a Presenter to display and set the DataContext on Views. Views that are shown this way typically cover the 'whole screen' and benefit from automatically constructed ViewModels using CIRS (see http://slodge.blogspot.co.uk/2013/03/v3-new-viewmodel-lifecycle.html)
However, just because navigation is typically done using ShowViewModel<T> this doesn't prevent you from using ViewModels in other ways. Common exceptions to the ShowViewModel<T> mechanism are things like iOS Tabbed and SplitView children, WindowsPhone Pivot/Panorama items, Android sub-Fragments and Dialogs, and Windows8 sub-panes such as flyouts.
At a practical level in Windows8, every XAML UserControl has a DataContext property which you can set in code - so you can always:
create any UserControl in code
then create a ViewModel
using new,
using Mvx.IoCConstruct<TViewModel>()
or using Mvx.Resolve<IMvxViewModelLoader>().LoadViewModel(request, state)
then set the UserControls DataContext property
then show the UserControl
Where you do this in your code... whether you use page code-behind, some Messenger-Message receiver or some other mechanism - well that's up to you - but this is something which is appropriate to put into the UI code project - it's definitely a View concern.
One final aside... while it is true that the settings pane is a UserControl, a LayoutAwarePage is also a UserControl too - so you can use LayoutAwarePage in flyouts too - but don't expect to see the OnNavigatedTo calls invoked when you do - e.g. see SettingsFlyout in http://code.msdn.microsoft.com/windowsapps/App-settings-sample-1f762f49

GWT MVP composition of parts

We've been using the recommended GWT approach of building parts of our application in an MVP manner. The logic we use is based on Google's examples - the Presenter fetches/prepares data and sets it on the View, and the View contains a reference to the Presenter which it calls (e.g. in UiHandlers).
Some parts of the application which we built should be reused in other views. For example - a view which is sometimes the "main view" of a part of the application - can be used inside a pop-up in another part of the application (of course, the views/presenters are initialized differently in this other case, but basically it is the same thing).
What would be the correct approach to do stuff like this? I cannot seem to find a suitable one without resorting to ugly hacky stuff.
For example - if I put the presenter of the reused component inside the main view - it is easy to initialize the reused component, but it is ugly to receive a result back in the main presenter. This can be solved by passing a runnable or creating a custom handler or passing the parent presenter itself to the reused presenter.
All of these approaches don't seem right to me though and seem ugly.
Any ideas/experiences?
What you're describing is a view being able to be controlled by 2 distinct presenters. Abstracting those presenters behind a common API, in the form of an interface, should be enough.
You can also see it as a composite widget being used within two distinct views. The composite widget would then expose events and a public API that both views could wire to their specific presenters.
See Activites and Places,It can help you to desing and structure you app.
https://developers.google.com/web-toolkit/doc/latest/DevGuideMvpActivitiesAndPlaces
.

How do I implement base view functionality on Windows Phone 7?

Lets say that on all my views, or generally at any time in my app, I want to be able to show an error message popup, and it always looks the same. How do I do that?
First thought is having all my view models extend a base view model which facilitates these things, but after that, do I have this base view model actually create the UI widgets and display them?
thanks,
Mark
If you've got some common functionality that you want to provide across a range of views, then you can implement a base class that inherits from the PhoneApplicationPage, and then derive all your classes from that class instead. The XAML for your pages then looks like this:
<local:BasePage xmlns ...
xmlns:local="clr-namespace:MyNamespace"
x:Class="MyNamespace.MyPage">
However, you will not be able to define common UI components in the XAML for your base page. If you wanted to have common UI components you would have create them manually in the code-behind for the base page, perhaps in a handler for the Loaded event, but I think a better solution would be to provide your common UI in a UserControl, which you then add to each of your pages.
If you want to show a Toast or Message Box, then I would recommend the ToastRequestTrigger and MessageBoxRequestTrigger from the Silverlight Toolkit as described in the patterns & practices WP7 Developer Guide.
you could probably define an event on base view model, which is fired inside view model whenever an error occurs, then in view, you can subscribe to this event and display the popup. You can carry error context in EventArgs of the fired event.
Additionally you could unify the logic for displaying the popup but that's probably another story :)
This is testable and nicely decoupled from the view.
Hope this helps,
Robert

GWT 2.1 MVP (Activities/Places) and Tabbed Displays [duplicate]

This question already has an answer here:
GWT 2.1 Places example without Activities
(1 answer)
Closed 3 years ago.
On an existing project we’re using MVP (hand crafted) reasonably well. It’s understood and does mostly what we need. For a new project I'm looking at using the MVP framework built into GWT 2.1 (Activities and Places).
Our applications are mostly tabbed displays with each tab bound to a single view widget.
I’ve tried to use Activities and Places without success for this type of display. Part of the problem is that the example Hello World article ended up leaving me chasing my tail, too many new concepts for my brain to digest.
The Hello World sample IMO is not a sufficient introduction and doesn’t deal with many of the real world use cases. I was hoping someone could point me in the direction of any sample applications that use MVP for tabbed displays. Thomas Broyer has some excellent posts on his blog but these have still left me a little perplexed.
Previously I’ve used an AppController to handle tabs changes and single presenters for each tab. The new architecture in GWT 2.1 leaves me more confused that it should.
I'm using the gwt Activities/Places framework for a tabbed display, and it works great, BUT: I decided to abandon the TabLayoutPanel widget we had been using and create my own navbar (that looks like tabs) and a content pane. The effect is the same - it looks identical - but the implementation is much cleaner.
I think the problem is in trying to mix Activities/Places, which has its own idea of navigation, with a TabPanel, which has another idea of navigation. At first I tried to throw them together, overriding tab button behavior to trigger a PlaceController, which in turn switched the tabs around, but... it was messy. With the independent navbar / content pane, the PlaceController could do everything just like it wanted to. You just have to manually switch the views, instead of letting a TabPanel do it for you.
I also faced this problem but managed to make it work using one activity per Tab and each activity using a presenter (or more) to display the components of the tab.
Regarding the solution found by Riley Lark, I, instead, opted by using a Decorator pattern and, so, keep the original TabbedPanel. How ? Each activity gets injected (GIN) a presenter that contains a decorator for the TabbedPanel.
So, for example:
Tab1Activity gets injected with Tab1Presenter, which, in turn, gets injected with Tab1Decorator which decorates the TabbedPanel with a Tab1ContentPanel (this panel contains all the widgets to be displayed on the Tab1 tab)
Tab2Activity gets injected with Tab2Presenter, which, in turn, gets injected with Tab2Decorator which decorates the same TabbedPanel with a Tab2ContentPanel (this panel contains all the widgets to be displayed on the Tab2 tab)
Seems complex but, after creating the first decorator, it really paid off and I was able to keep the TabbedPanel and take advantage of the URL history management implicit in the framework.

Opening an about box using MVVM pattern

I'm working on a new WPF application and I'm trying to stay as close to the MVVM pattern as I can. My XAML files right now have no codebehinds, and all my interactivity is achieved using Josh Smith's RelayCommand class and commands in my ViewModel classes.
This worked great until I started working on the housekeeping tasks, such as an about box and a system preferences page. I want to have these as modal dialogs, but if I create a RelayCommand to open these pages, I'll be creating a dependency on the view within my view model.
This strikes me as against the grain of the MVVM pattern.
Is there an established method for creating new windows (modal and/or modeless) within the MVVM pattern without creating a dependency? It seems the only way I can keep the ViewModel clean is to create a Click event handler in the XAML codebehind file and create the new view within the old view.
Any recommendations?
One way to handle this is to implement a service that provides Views to ViewModels. Views register with the service and ViewModels can request dialogs from the service. This is an example of the Gang of Four mediator pattern.
Take a look at my Modal Dialogs solution for Silverlight 4:
Modal dialogs with MVVM and Silverlight 4
Please see my answer to this question about why the Window class itself is a ViewModel, so you can use it directly from your ViewModel without worries.
Laurent Bugnion has a weak-referenced mediator, in which he uses it to show dialog messages. Along with the message that is broadcast, a callback delegate is sent for the subscriber to execute. You could use the same concept to show an about dialog. Check out DialogMessage.cs from the source here.
We use Controller classes which are responsible for the UI Workflow. They create the modal windows and they mediate between various ViewModels.
How you can open a modal window with the View-Model-ViewModel (MVVM) pattern is shown in the ViewModel sample application here:
WPF Application Framework (WAF)
http://waf.codeplex.com