MVVM Light Toolkit design approach (Navigation & view load)

Question

I am building a simple application with 4-5 views in Silverlight. I came across MVVM Light toolkit and I think it suits my need.

Background

Application will have views with typical list and details display

Manufacturer
Product

and so on with left navigation, header and footer (User controls).

I am thinking of having a main page with user controls created at design time.

Problem

On selection of links from left navigation control, the central panel should be updated with a different view (like Manufacturer, product and so on)

I understand that Messenger is an option to communicate between different VMs in light toolkit.

Question

How can I design my app with MVVM light toolkit. Central pane need to be loaded with a different view at runtime.

I am particularly looking at help in implementing the navigation portion of the application.

Thank you.

score 1 · Answer 1 · answered Jun 06 '11 at 18:42

I had to implement basic nagivigtion in an NON mvvm way. I have a message listener sitting on the constructor of my main view that listens for a page navigation message(custom message learn it, love it,use it)then it sets the content source of the nav frame to the url that is sent in the message. I have the URLs for all my page and subpage navigation setup using string constants.

public MainPage()
        {
            InitializeComponent();
            Loaded += OnLoaded;
            WebContext.Current.Authentication.LoggedOut +=
                new EventHandler<System.ServiceModel.DomainServices.Client.ApplicationServices.AuthenticationEventArgs>(Authentication_LoggedOut);
            Messenger.Default.Register<msgs.NavigationRequest<PageURI>>(this, (uri => ContentFrame.Navigate(uri.Content)));
            Messenger.Default.Register<WavelengthIS.Core.Messaging.ExceptionMessage>(this, ex => ShowExceptionMessage(ex));
            Messenger.Default.Register<WavelengthIS.Core.Messaging.StringMessage>(this, str => ShowMessageForUser(str));

        }


public class PageURI : Uri
    {
        public PageURI(string uriString, UriKind uriKind)
            : base(uriString, uriKind)
        {

        }


    }


public class PageLinks
    {
        public const string SEARCHBYDAYCOUNTVIEW = "/Views/PatientSearchHeaders/SearchByDayCountView.xaml";
        public const string SEARCHBYPATIENTCRITERIAVIEW = "/Views/PatientSearchHeaders/SearchByPatientCriteriaView.xaml";
        public const string QUESTIONAIRRESHELL = "/Views/QuestionairreViews/QuestionairreShell.xaml";
        public const string HOME = "/Views/PrimarySearchView.xaml";
        public const string REPORTS = "/Views/ReportsPage.xaml";
        public const string LOGINPAGE = "/Views/LoginPageView.xaml";
    }

Actual Calling in VM:

private void OnSurveyCommandExecute()
        {
            Wait.Begin("Loading Patient List...");
            _messenger.Send<ReadmitPatientListViewModel>(this);
            _messenger.Send<Messages.NavigationRequest<SubClasses.URI.PageURI>>(GetNavRequest_QUESTIONAIRRESHELL());

        }

        private static Messages.NavigationRequest<SubClasses.URI.PageURI> GetNavRequest_QUESTIONAIRRESHELL()
        {
            Messages.NavigationRequest<SubClasses.URI.PageURI> navRequest =
                new Messages.NavigationRequest<SubClasses.URI.PageURI>(
                    new SubClasses.URI.PageURI(Helpers.PageLinks.QUESTIONAIRRESHELL, System.UriKind.Relative));
            return navRequest;
        }

MVVM Light Toolkit design approach (Navigation & view load)

1 Answers1