2

I have created a new solution for my MvvmCross app that supported Windows Store and I want to support UWP on Windows 10. I have moved over the PCL successfully, but I am having problems getting the basic UWP app working using a sample provided by MS (NavigationMenu) which uses the SplitView and the AppShell pattern they are recommending for the new navigation/command model. I referenced a helpful blog post (http://stephanvs.com/implementing-a-multi-region-presenter-for-windows-10-uwp-and-mvvmcross/), which gave me some guidance on how to integrate mvvmcross into the AppShell, but startup is failing because the AppShell does not have a valid Frame defined. Frame is a read-only property, and I have been unable to see where this is being set up.

I am using the standard AppShell implementation from the NavigationMenu with the following changes as recommended in the blog post:

public sealed partial class AppShell : MvxWindowsPage // was Page

public Frame AppFrame { get { return this.Frame; } } // was this.frame

Except for code after the error, there are no differences in the setup. In looking at the MvxWindowsPage implementation, there doesn't seem to be anything special as it still invokes the Page initialization. Is there something obvious I am missing?

johnslaby
  • 83
  • 7

2 Answers2

2

So the link to the blogpost is correct, in other words you'll need to use MultiRegions from MvvmCross to get this working. But what the blogpost doesn't show is a complete working version...

I've added one on my github here: https://github.com/Depechie/MvvmCrossUWPSplitView

Some pointers to take away, like I said in the comments. Your view where the SplitView will be present, needs to have a property to return a valid Frame to look for while injecting new views. This can be returned like this return (Frame)this.WrappedFrame.UnderlyingControl; found in the code here https://github.com/Depechie/MvvmCrossUWPSplitView/blob/master/MvvmCrossUWP.Win/Views/FirstView.xaml.cs#L13

Than all views you want to load up in the SplitView will need to reference to the region you defined in that SplitView, in my case I named it FrameContent as seen here https://github.com/Depechie/MvvmCrossUWPSplitView/blob/master/MvvmCrossUWP.Win/Views/FirstView.xaml#L48

So use that name for the region attribute in all to be loaded views like so [MvxRegion("FrameContent")] example here https://github.com/Depechie/MvvmCrossUWPSplitView/blob/master/MvvmCrossUWP.Win/Views/SecondView.xaml.cs#L7

Depechie
  • 6,102
  • 24
  • 46
  • This is great. I have one last problem that I can't seem to solve. I would like to populate the frame with a default view on startup. The example leaves the frame empty until you select an option. I have tried navigating to the page using ShowViewModel from a number of places (the splitview VM constructor, Init method, in setup after the start method is called, etc.) but in every case I have tried, the view fails to load with the error 'Region xxx is not found in DefaultView', searching the default view rather than the splitview for the frame. Any ideas? – johnslaby Dec 25 '15 at 15:56
  • Well that error is because in MvvmCross world viewmodels will be initialized before views. So the frame isn't available yet to load content. Quick fix, register on the Loaded event of the frame on the firstview and navigate to any of the viewmodels then. I've updated my github example with this principal! – Depechie Dec 25 '15 at 19:37
  • Perfect! I used an attached behavior handling the Loaded event as you suggested. Your example makes reference to 'core:EventTriggerBehavior' which I couldn't find, but the guidance was spot-on. Thanks a lot. – johnslaby Dec 26 '15 at 16:29
  • Ha it's a nuget package, it are the new Microsoft UWP behaviors they are now available... – Depechie Dec 26 '15 at 16:31
1

I see what you're trying to do with the SplitView template that's provided by Microsoft. There is however a mismatch between things managed by MvvmCross and UWP.

By default MvvmCross maps ViewModels to Views based on naming conventions. What you are trying to do is use a view 'AppShell' (which is derived of Windows.UI.Xaml.Controls.Page) that doesn't adhere to the default MvvmCross convention.

The way I choose to implement this SplitView (Hamburger) functionality is by deleting the provided AppShell class entirely. I then created a new view named HomeView (since I have a ViewModel with the name HomeViewModel) and added the SplitView control there as described in the post you mentioned above.

For completeness I've created a Gist with the App.xaml.cs and HomeView.xaml as you requested. You can find them here: https://gist.github.com/Stephanvs/7bb2cdc9dbf15cb7a90f

Stephanvs
  • 723
  • 7
  • 19