MvvmCross WPF Slideout Menu Presenter

Sample MvvmCross WPF application with a slideout presenter. A slideout button is defined in the HomeView allowing one to switch between all three views. MenuOne has a button to show a full screen view, replacing the slideout view with a full screen view.


Applicaiton is made up of four Views:


SlideoutPresenter.cs in V.Slideout.Wpf\Utilitiles manages swapping and replacing Views based on user input. By decorating a View's xaml.cs class definition with a Region attribute will define where that View is shown.

i.e. From MenuOneView.xaml.cs

public partial class MenuOneView

Tells the SlideoutPresenter this View should show the slideout menu button and to replace the currently shown View in the HomeView.

For a full screen view DetailFullScreenView.xaml.cs is decorated with

public partial class DetailFullScreenView

Telling the SlideoutPresenter to replace the entire HomeView with the contents of DetailFullScreenView. Once the user closes DetailFullScreenView the HomeView with the slideout button will again be shown the user. DetailFullScreenView is stacked on top of HomeView to take over the whole screen.

Slideout Menu

The slideout menu is in the HomeView grid that is hidden/shown via slideout menu button. A list of our items to show in the menu are created in the HomeViewModel and bound to a ListBox of buttons. Once a button is pressed the View is swapped out accordingly.