MEF atau yang merupakan singkatan Managed Extensibility Framework adalah sebuah library baru yang ada di dalam .NET 4.0. Sebenarnya library ini telah ada sejak lama di codeplex, namun di rilis .NET yang ke 4.0 Microsoft memutuskan untuk memaketkan ke dalam .NET Framework. Sesuai dengan namanya framework ini dapat kita gunakan untuk membangun sebuah aplikasi yang fungsionalitasnya dapat ditambahkan oleh pihak ketiga atau bahasa kerennya “Plug-in”. Contoh mudahnya adalah Microsoft Office yang dapat dikembangkan fiturnya melalui plug-in.
Mungkin untuk di dunia desktop hal seperti ini adalah biasa, namun yang menarik adalah sekarang kita dapat juga menggunakan MEF di aplikasi silverlight kita. Sebagai contoh saya membayangkan adanya sebuah aplikasi silverlight yang fungsionalitasnya dapat ditambahkan hanya dengan menunjuk ke DLL lain yang ada di website lain. Sebagai contoh aplikasi penampilan grafik yang tampilannya dapat diganti-ganti sesuai dengan DLL yang digunakan oleh aplikasi tersebut, jadi semisal kita ingin mengampilkan data dalam bentuk pie chart kita dapat menggunakan DLL yang disediakan oleh website A dan jika kita ingin menampilkan data dalam bentuk bar chart kita dapat menggunakan DLL dari website B. Tentunya akan menjadi sebuah kolaborasi yang menarik.
Dalam blog post ini saya ingin menunjukkan sedikit bagaimana kita dapat menggunakan MEF dalam Silverlight 4.0 untuk membuat sebuah aplikasi editor tulisan sederhana yang fungsi editingnya dapat dikembangkan. Baiklah mari kita buka visual studio 2010 beta 2 dan buat 1 buah Project SilverlightApplication. Kemudian tambahkan 2 buah project bertipe Silverlight Class Library bernama Contract dan Implementation ke dalam Solusi tersebut. Sehingga solusi anda menjadi seperti ini :
Lalu karena kita akan menggunakan MEF maka dalam setiap project Silverlight (MEFExample,Implementation, Contract )yang ada tambahkan referensi ke 2 buah assembly yang dapat anda temukan di folder (C:\Program Files\Microsoft SDKs\Silverlight\v4.0\Libraries\Client). Kedua assembly tersebut yaitu :
- System.ComponentModel.Composition.dll
- System.ComponentModel.Composition.Initialization.dll
Mungkin sekarang sebagaian dari rekan pembaca bertanya kenapa perlu ada 2 proyek tambahan yaitu Contract dan Implementation. Contract adalah proyek yang berisikan Interface yang perlu diimplementasikan oleh pihak lain yang akan mengembangkan plugin. Sedangkan Implementation adalah implementasi dari Interface tersebut. Baiklah sekarang kita akan mengembangkan interface untuk plug-in. Silahkan buka proyek Implementation dan tambahkan sebuah Interface bernama IEditor. Kemudian tambahkan 1 fungsi seperti kode dibawah ini :
public interface IEditor
{
string Transform(string input);
}
Baiklah setelah interfacenya ada mari kita gunakan interface tersebut dalam proyek utama kita. Silahkan buka proyek Silverlight utama kita (MEFExample) kemudian lakukan langkah-langkah berikut :
1. Tambahkan referensi ke proyek Contract yang telah kita buat tadi.
2. Buka MainPage.xaml
3. Tambahkan 1 buah Textbox dan 1 buah Button kedalam silverlight anda.
<TextBox Height="99" HorizontalAlignment="Left"
Margin="32,17,0,0"
Name="textBlock1"
VerticalAlignment="Top"
Width="120"
AcceptsReturn="True" />
<Button Content="Edit"
Height="23"
HorizontalAlignment="Left"
Margin="52,122,0,0"
Name="button1"
VerticalAlignment="Top"
Width="75"
Click="buttonGanti_Click" />
4. Tambahkan sebuah event handler Click kedalam button yang anda buat kemudian buka MainPage.xaml.cs untuk menuliskan kode kita.
private void buttonGanti_Click(object sender, RoutedEventArgs e)
{
textBlock1.Text = Editor.Transform(textBlock1.Text);
}
5. Tambahkan properti berikut kedalam kelas MainPage (Jangan lupa untuk menambahkan atribut Import, karena atribut ini akan memberi tahu kepada framework MEF bahwa properti ini akan secara otomatis diinisialisasi nilainya oleh MEF ketika MEF menemukan kelas yang sesuai tipenya)
[Import]
public IEditor Editor { get; set; }
6. Kemudian implementasikan event handler klik tersebut
private void buttonGanti_Click(object sender, RoutedEventArgs e)
{
textBlock1.Text = Editor.Transform(textBlock1.Text);
}
Sekarang mungkin sebagian dari anda akan bertanya-tanya, kapan properti Editor dalam kelas MainPage diinisialisasi. Namun sebelum itu dijawab mari kita membangun implementasi dari plug-innya terlebih dahulu. Silahkan buka project Implementation yang telah kita buat sebelumnya dan lakukan langkah dibawah ini :
1. Tambahkan referensi ke proyek Contract yang telah kita buat sebelumnya.
2. Buat sebuah kelas baru beri nama AllUpperyang mengimplementasikan IEditor, seperti contoh kode dibawah ini:
public string Transform(string input)
{
return input.ToUpper();
}
3. Tambahan metadata berikut pada diatas kelas AllUpper, sehingga kode untuk kelas tersebut menjadi seperti ini
[Export(typeof(IEditor))]
public class AllUpperPluggin : IEditor
4. Edit properti dari proyek ini agar hasil build dari kelas ini disimpan ke dalam folder dari project MEFExample. Caranya mudah silahkan klik kanan di depan nama project Implementation kemudian pilih Properties.
5. Lalu pindah kebagian Build dan ganti bagian output agar menunjuk ke directory dari project MEFExample.Web.
Baiklah sekarang kita kembali ke proyek MEFExample karena sekarang kita akan menambahkan plugin kedalam aplikasi silverlight kita. Silahkan ikuti langkah berikut :
1. Buat fungsi bernama DownloadAssembly , fungsi ini akan mendownload assembly yang telah kita buat pada proyek Implementation (catatan: ganti port 8008 sesuai dengan spesifikasi jalannya web di visual studio anda).
private void DownloadTheAssembly()
{
WebClient wc = new WebClient();
wc.OpenReadCompleted +=
new OpenReadCompletedEventHandler(wc_OpenReadCompleted);
wc.OpenReadAsync(
new Uri("http://localhost:8008/Implementation.dll", UriKind.Absolute));
}
2. Buat fungsi bernama wc_OpenReadCompleted, fungi ini merupakan fungsi yang akan dipanggil setelah assembly tersebut didownload. Apa yang dilakukan oleh fungsi ini adalah pertama-tama meload stream yang didownload untuk menjadi assembly, kemudian menambahkan assembly tersebut kedalam katalog. Katalog ini akan digunakan sebagai tempat dari MEF mencari kelas yang dibutuhkan.
private void wc_OpenReadCompleted(
object sender, OpenReadCompletedEventArgs e)
{
if((e.Error == null) && (e.Cancelled == false))
{
AssemblyPart assemblyPart = newAssemblyPart();
Assembly assembly = assemblyPart.Load(e.Result);
AssemblyCatalog catalog = newAssemblyCatalog(assembly);
CompositionContainer container = newCompositionContainer(catalog);
CompositionHost.InitializeContainer(container);
PartInitializer.SatisfyImports(this);
}
}
3. Panggil fungsi DownloadTheAssembly pada definisi konstruktor
public MainPage()
{
InitializeComponent();
DownloadTheAssembly();
}
Tekan F5 dan Selamat sekarang anda telah berhasil membuat sebuah aplikasi Silverlight sederhana yang dapat diperluas fungsionalitasnya.
PS:Kode dari blog post ini dapat anda download disini.