DavideZordan.net

Note – this is a multi part post:

• First experiments using MEF, MVVM and Silverlight 4 Beta
• Part 2: Custom attributes
• Part 3: Part Creator and Creation Policy
• Part 4: Part Creator
• Part 5: Enabling Blend and the Visual Studio designer
• Part 6: Design-mode ViewModel and calling a WCF Service

In the last post I’ve updated the sample project introducing PartCreator<T>, in this one I will illustrate a method to make available sample data during the editing of the solution in Blend or in the Visual Studio designer, in order to obtain a result like this (a similar approach is used in the awesome MVVM light toolkit by Laurent Bugnion):

First of all, I’ve created a class ViewModelProvider to obtain dinamically an instance of the ViewModel and directly used in xaml to create the VM instance, in this way it’s possibile to see sample data during the design phase:

public class ViewModelProvider : IViewModelProvider
{
    public ViewModelProvider() { }

    [Import(typeof(MainPageViewModel))]
    public IViewModelBase mainPageViewModelProvider { get; set; }

    /// <summary>
    /// Get the Instance of the ViewModel
    /// </summary>
    public IViewModelBase GetVMInstance
    {
        get
        {
            //Verify if Design Mode
            if ((Application.Current == null) || (Application.Current.GetType() == typeof(Application)))
            {
                return new MainPageViewModel();
            }
            else
            {
                //If not in Design Mode uses MEF to compose the objects
                PartInitializer.SatisfyImports(this);
                return mainPageViewModelProvider;
            }
        }
    }
}

I’ve not already found a method to activate MEF compositions during design time, so an instance of the ViewModel class is explicitely created in code if we are in the tool designers, otherwise SatisfyImports() executes the MEF magic as usually.

It’s now necessary to initialize the properties values in order to display sample data at design time, this step can be done in the constructor of the MainPageViewModel:

[PartCreationPolicy(CreationPolicy.NonShared)]
[Export(typeof(MainPageViewModel))]
public class MainPageViewModel : ViewModelBase, IMainPageViewModel
{
    ///
    /// Default constructor
    ///
    public MainPageViewModel()
    {
        if ((Application.Current == null) || (Application.Current.GetType()==typeof(Application)))
        {
            //Initialize the properties with test data if design mode
            aViewModelProperty = "Value - Design Mode";
            dataItems = new SampleDataItems(); dataItems.ToList().ForEach(d=>d.Description+=" - Design Mode");
        }
    }

    ///
    /// A sample property
    ///
    [Import("aViewModelPropertyTextProvider")]
    public string aViewModelProperty { get; set; }

    ///
    /// A sample collection
    ///
    [Import(typeof(DataItems))]
    public DataItems dataItems { get; set; }

    ///
    /// A Part creator for the addDataItemCommandCreator
    ///
    [Import(typeof(ICommand))]
    public PartCreator addDataItemCommandCreator { get; set; }

    private ICommand _addDataItemCommand;
    public ICommand addDataItemCommand
    {
        get {
            if (_addDataItemCommand==null)
                _addDataItemCommand = addDataItemCommandCreator.CreatePart().ExportedValue;
            return _addDataItemCommand;
        }
    }
}

Inside Visual Studio, it’s now possibile to edit the User Interface and visualize the sample data defined in the constructor:

The source code is available for download here.

Hope this helps!