Home > .NET > Getting started with Silverlight and MEF, Import and Export

Getting started with Silverlight and MEF, Import and Export

December 18, 2009 Leave a comment Go to comments

For this example, I am using Silverlight 3 and the appropriate version of MEF. The example works in Silverlight 4 as well.

The first thing to do is create a new Silverlight application project. I called mine MEFDemo and didnt select the option to create a new website. I then added two new Silverlight controls, Control1 and Control2.

I also modified the MainPage control, here is the xaml.

<UserControl x:Class="MEFDemo.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"> <Grid x:Name="LayoutRoot"> <StackPanel Orientation="Vertical"> <StackPanel Name="Top"> </StackPanel> <StackPanel Name="Main"> </StackPanel> </StackPanel> </Grid> </UserControl>

I defined StackPanels called Top and Main, these represent areas that we can add controls into later on.

I then added a reference to System.ComponentModel.Composition and System.ComponentModel.Compisition.Initialization.

I then added a new item called Location.cs with the following code.

namespace MEFDemo { public enum Location { Top, Main } }

This is going to be used so that we can configure our controls to appear in a place holder. We are going to use this by defining meta data on our control. We need to define an interface for this meta data, so that MEF can dynamically generate a proxy for us. The interface I have looks like so.

namespace MEFDemo { public interface IMefMetaData { Location Location { get; } } }

The next thing to do is change our MainPage control to get a collection of controls using the [ImportMany] attribute. The code for MainPage looks like so.

using System; using System.ComponentModel.Composition; using System.Windows.Controls; namespace MEFDemo { public partial class MainPage : UserControl { [ImportMany] public Lazy<UserControl, IMefMetaData>[] Controls { get; set; } public MainPage() { InitializeComponent(); PartInitializer.SatisfyImports(this); foreach (var control in Controls) { if(control.Metadata.Location == Location.Top) Top.Children.Add(control.Value); if (control.Metadata.Location == Location.Main) Main.Children.Add(control.Value); } } } }

Here we get a list of Controls, call the SatisfyImports method on the PartInitializer and then use our meta data to decide where to add the control.

In order to configure our 2 controls to get picked up by the [ImportMany] attribute we need change their code a little, the example for each is below.


using System.ComponentModel.Composition; using System.Windows.Controls; namespace MEFDemo { [Export(typeof(UserControl))] [ExportMetadata("Location", Location.Top)] public partial class Control1 : UserControl { public Control1() { InitializeComponent(); } } }


using System.ComponentModel.Composition; using System.Windows.Controls; namespace MEFDemo { [Export(typeof(UserControl))] [ExportMetadata("Location", Location.Main)] public partial class Control2 : UserControl { public Control2() { InitializeComponent(); } } }

In control 1 we configure the Location property on the meta data to Top, and in control 2 we configure it to Main. If we run this, control 1 will load above control 2. If it doesnt, then my explanation was rubbish and you should go download the code.

Obviously you can be clever with this, you could use Linq on the list of Controls, and filter them based on User Roles or preferences.

kick it on DotNetKicks.com

About these ads
  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s


Get every new post delivered to your Inbox.

%d bloggers like this: