Load WPF UI into MVVM application from plug-in assembly

Question

I am working on an application that uses a plug-in architecture to expand it\'s functionality. What is the best way to load WPF UIs from a plug-in?

I will have a li

Answer 1

It sounds like what you are looking for has already been accomplished with Prism. You define regions and then modules get loaded at runtime that may or may not have views for those regions. This works if all your applications are built against the modularity concepts derived from Prism. There are others out there, but Prism has this taken care of pretty extensively.

Answer 2

I use a similar approach to Fuji. The only difference is that I export the ViewModel and the ResourceDictionary independently from each other so they are still loosely coupled.

[Export(typeof(IPlugin)]//i use metadata too
public class Viewmodel1 {}

[Export(typeof(IPlugin)]//i use metadata too
public class Viewmodel2 {}

[ResourceDictionaryExport]
public partial class MyResourceDictionary 
{
    public MyResourceDictionary ()
    {
        InitializeComponent();
    }
}

In my plugin application I add all ResourceDictionaries.

app.xaml.cs

 [ImportMany("Resourcen", typeof(ResourceDictionary))]
 private IEnumerable<ResourceDictionary> _importResourcen;

 foreach (var resourceDictionary in _importResourcen)
 {
     this.Resources.MergedDictionaries.Add(resourceDictionary);
 }

For the sake of completeness

[MetadataAttribute]
[AttributeUsage(AttributeTargets.Class, AllowMultiple = false)]
public class ResourceDictionaryExportAttribute : ExportAttribute
{
    public ResourceDictionaryExportAttribute() : base("Resourcen", typeof(ResourceDictionary))
    {

    }
}

Answer 3

I did something similar like mentioned with DataTemplates. I used MEF to load plugins and then loaded a Dictionary with a reference to the ViewModel and View at startup. The plugin isbuilt using 3 main components.

IBasePlugin.cs

This simple interface allows us to create a skeleton for the plugin. This will only contains the very basics, as this is what we will use to Import plugins to our main application using MEF.

public interface IBasePlugin
{
    WorkspaceViewModel ViewModel { get; }
    ResourceDictionary View{ get; }
}

Plugin.cs

The next part is the Plugin.cs file. It contains all the properties of our plugin, as well as all the necessary references; such as to our View & ViewModel.

[Export(typeof(IBasePlugin))]
public class Plugin : IBasePlugin
{
    [Import]
    private MyPluginViewModel _viewModel { get; set; }
    private ResourceDictionary _viewDictionary = new ResourceDictionary();

    [ImportingConstructor]
    public Plugin()
    {
        // First we need to set up the View components.
        _viewDictionary.Source =
            new Uri("/Extension.MyPlugin;component/View.xaml",
            UriKind.RelativeOrAbsolute);
    }

    ....Properties...

}

View.xaml

This is a DataTemplate containing a Reference to the plugin View and ViewModel. This is what we will use for Plugin.cs to load into the main application, so that the application and WPF will know how to bind everything together.

<DataTemplate DataType="{x:Type vm:MyPluginViewModel}">
    <vw:MyPluginView/>

We then use MEF to load all the plugins, feed them to our Workspace ViewModel responsible of handling the Plugins, and store them in an ObservableCollection that will be used to display all the available plugins.

The code we use to load plugins can look something like this.

var plugins = Plugins.OrderBy(p => p.Value.ViewModel.HeaderText);
foreach (var app in plugins)
{
    // Take the View from the Plugin and Merge it with,
    // our Applications Resource Dictionary.
    Application.Current.Resources.MergedDictionaries.Add(app.Value.View)

    // THen add the ViewModel of our plugin to our collection of ViewModels.
    var vm = app.Value.ViewModel;
    Workspaces.Add(vm);
}

Once both the Dictinoary and ViewModel has been loaded from our Plugin into our application we can display the collection using for example a TabControl.

<TabControl ItemsSource="{Binding Workspaces}"/>

I also gave a similar answer here as well with some additional details that you might find interesting.