Update: I’ve taken the best parts of this post and put into a Frameworks that’s a super simple Mvvm framework for Xamarin.Forms, it’s available on github and nuget.
In this blog I give an example of how to roll your own Mvvm in Xamarin.Forms. This Mvvm is convention based and in this case I’ve used the Page/PageModel naming rather than Model/ViewModel naming, but you can change it to View/ViewModel if you like. This blog is based off a sample app that’s available on github.
Conventions in this sample.
- A Page must have a corresponding PageModel, with naming important so a QuotePageModel must have a QuotePage
- A Page can have a Init Method with no parameters
- A Page can have a PageModel property which is the view model
- The BindingContext on the page will be automatically set with the Model
- A model can have a Init method that takes a object
- A model can have a ReverseInit method that also take a object and is called when a model is poped with a object
Lets see a Page
And the corresponding PageModel
Navigating Models
You can push and pop pages from your view models using PushPageModel() and PopPageModel methods.
Eg. PushPageModel<QuotePageModel>(quote);
But before you can do that you need to implement and register a IRootNavigation service. In my case I’ve used a ContainerPage and registered that as the NavigationHandler
Implementing Property Changed
You’ll notice that I don’t manually implement property change events, instead I used a opensource project called Fody/PropertyChanged. You can install this from nuget.
Inversion of Control/TinyIOC
Dependencies on ViewPage constructors will be automatically resolved. Use TinyIOC to register dependencies.
Where’s the magic?
If you want to know where the magic is happening then take a look at BasePageModel.cs in the sample application.
Platform Dependencies
This app makes use of platform dependancies for SQLite.
Unit Testing
If we follow the conventions then Models are loosely coupled and easily testable.
You can pass in mocked dependencies into Models and test. See an example here:
Please go and have a look at the code on github.
https://github.com/rid00z/XamarinFormsQuoteApp
Thanks
Michael
Great post Michael.
I’m trying to replace your “RootContainerPage : MasterDetailPage, IRootNavigation” with something much more simple: “RootContainerPage : NavigationPage, IRootNavigation”.
the first page model displays fine but when I write “PushPageModel();”
nothing happened, I just can’t navigate to the next page.
Can you please advice?
It would be great if you could make another sample based on simple Navigation pages.
Thanks,
Gadi Paz
It’s WORKING!!!
Many thanks for that great post!!!
Very interesting stuff looks nice. Only question is why are you using TinyIOC instead of the built in IOC container of Xamarin.Forms?
Hi James
I’m using TinyIOC for constructor injection. I didn’t think Xamarin.Forms IOC had constructor injection?
Thanks
Great post. Looking forward to implementing this in my current XF project.