Date post: | 06-May-2015 |
Category: |
Technology |
Upload: | ricardo-fiel |
View: | 2,848 times |
Download: | 0 times |
MVVM + MEF in Silverlight
Ricardo Fiel
Who’s that guy?
Ricardo FielSenior EngineerFullsix [email protected]@theplastictoy
xamlpt.com/blogs/rfiel/pontonetpt.com/blogs/rfiel/
blogs.fullsix.ptlabs.fullsix.pt
Agenda
• The “easy” way• MVVM – Model View ViewModel• MEF – Managed Extensibility Framework• Scenarios for MVVM + MEF together• Q&A
The “easy” way
Question
What are some of the biggest costs in Software Development?
• Maintenance• Bug fixing
• ?
demoBuilding a Silverlight app the “easy” way
That was the DANGEROUS way!
• Too much coupling• Very hard to test• Developer-Designer workflow issues• Maintenance will be a pain• Looks faster, but will become expensive
It’s not always the wrong way, butUSE IT WITH CAUTION!
MV* patterns• Different people reading about MVC in different places take different ideas
from it and describe these as “MVC”.
• Presentation Model is of a fully self-contained class that represents all the data and behavior of the UI, but without any of the controls used to render that UI on the screen. A view then simply projects the state of the presentation model onto the glass.
• The most annoying part of Presentation Model is the synchronization between Presentation Model and view…
• Ideally some kind of framework could handle this, which I'm hoping will happen some day with technologies like .NET's data binding.
Martin Fowler, 2004
MVVMModel-View-ViewModel
Ladies and gentleman, may I introduce you to:
The MVVM triad
• Display data in Controls
• UI Friendly Entities, UI State, Actions
• Entities representing data
ViewModel
View
Model
Model
• Represents the data• The entity• Not required to know where it gets its data
from– From a WCF service. WCF RIA Services, etc
• May contain validation
View
• The screen, the UI, the UserControl in Silverlight
• Handles UI look and feel• Presentation of information• Communicates with ViewModel through
bindings
ViewModel
• Main source of logic for the MVVM triad• Connects the Model to the View• Abstracts the View• Public properties that are bound to a View• INotifyPropertyChanged and
INotifyCollectionChanged talk to the View through bindings
• Listens for changes from the View through bindings• May invoke services to communicate outside the
MVVM triad
MVVM Variations - 1
• View First– ViewModel is created as a StaticResource in the
View’s XAML or in the View’s code-behind– Excellent for Blend (“Blendability”)
<UserControl.Resources> <data:GamesViewModel x:Key="TheViewModel" /> </UserControl.Resources> <Grid DataContext="{Binding Path=Games, Source={StaticResource TheViewModel}}"> ... </Grid>
MVVM Variations - 2
• ViewModel first– View is injected into the ViewModel’s constructor• Example:
– ViewModel is created then the View is created using Dependency Injection
public MyViewModel{ public MyViewModel(IMyView view) { }}
MVVM Variations - 3
• ViewModel and View are created through an intermediary, then paired togethervm = new MyVM();view = new MyView();view.DataContext = vm;
// With Unityvm = container.Resolve<IMyVM>();view = container.Resolve<MyView>();view.DataContext = vm;
From Now On We’re Using ViewFirst
<3
Don’t look up!
• View only knows ViewModel
• ViewModel only knows Model
• The Model stands alone
ICommand interface
• Available in Silverlight 4– ButtonBase and Hyperlink now have Command
and CommandParameter properties<Button Content="Load Products" Width="120"
Command="{Binding FindMatchingProducts}" CommandParameter="{Binding Path=Text, ElementName=CostThresholdFilter}"/>
public interface ICommand{
bool CanExecute(Object parameter);void Execute(Object parameter);event EventHandler CanExecuteChanged;
)
Tools to make it simple
• There are several tools available:– Prism
• www.codeplex.com/CompositeWPF
– Caliburn• www.codeplex.com/caliburn
– Silverlight.FX• projects.nikhilk.net/SilverlightFX
– MVVM Light Toolkit• www.codeplex.com/mvvmlight
• You can build your own MVVM framework• Comparison list at
http://www.japf.fr/silverlight/mvvm/index.html
demoViewFirst MVVM
MEFManaged Extensibility Framework
MEF Intro
• Library for building extensible applications
• Part of Silverlight 4• Silverlight 3 support– mef.codeplex.com
• Prism support– mefcontrib.codeplex.com
• Open source
MEF Basics
• An application is built of Parts
The MEF “Motto”
Export it.
Import it.
Compose it.
Export it
Widget1
[Export(typeof(UserControl))]public class Widget1 : UserControl{
public string Message { get{return(string) Button.Content;}
set{Button.Content=value;} }}
Export
UserControl
Import it
MainPage
[Export(typeof(UserControl))]public class MainPage: UserControl{
[ImportMany(typeof(UserControl))]public IEnumerable<UserControl> { get;set;}
}
ImportMany
UserControl
Compose itPartIntializer: “Compose yourself”
MainPage Compose
public MainPage() { InitializeComponent(); PartInitializer.SatisfyImports(this); }
demoAdding social widgets
Scenarios MVVM + MEF together?
I, MVVM, take you MEF, to be my wife, to have and to hold from this day forward, for better or for worse, for richer, for poorer, in sickness and in health, to love and to cherish; from this day forward until death do us part.
Thanks!
Ricardo FielSenior EngineerFullsix [email protected]@theplastictoy
xamlpt.com/blogs/rfiel/pontonetpt.com/blogs/rfiel/
blogs.fullsix.ptlabs.fullsix.pt
Please keep in touch!