Your SlideShare is downloading. ×
MVVM+MEF in Silvelight - W 2010ebday
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

MVVM+MEF in Silvelight - W 2010ebday

2,831
views

Published on

MVVM+MEF session for Microsoft WebDay 2010 in Oporto. …

MVVM+MEF session for Microsoft WebDay 2010 in Oporto.
http://www.mswebday.com/

An overview on the MVVM (Model View ViewModel) pattern and MEF (Managed Extensibility Framework) in Silverlight. When and how to use them.

Published in: Technology

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
2,831
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
122
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. MVVM + MEF in Silverlight
    Ricardo Fiel
  • 2. Who’s that guy?
    xamlpt.com/blogs/rfiel/
    pontonetpt.com/blogs/rfiel/
    blogs.fullsix.pt
    labs.fullsix.pt
    Ricardo Fiel
    Senior Engineer
    Fullsix Portugal
    ricardo.fiel@fullsix.com
    @theplastictoy
  • 3. Agenda
    The “easy” way
    MVVM – Model View ViewModel
    MEF – Managed Extensibility Framework
    Scenarios for MVVM + MEF together
    Q&A
  • 4. The “easy” way
  • 5. Question
    What are some of the biggest costs in Software Development?
  • demo
    Building a Silverlight app the “easy” way
  • 8. 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, but
    USE IT WITH CAUTION!
  • 9. 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
  • 10. MVVMModel-View-ViewModel
    Ladies and gentleman, may I introduce you to:
  • 11. The MVVM triad
    View
    Display data in Controls
    UI Friendly Entities, UI State, Actions
    Entities representing data
    ViewModel
    Model
  • 12. 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
  • 13. View
    The screen, the UI, the UserControl in Silverlight
    Handles UI look and feel
    Presentation of information
    Communicates with ViewModel through bindings
  • 14. 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
    INotifyPropertyChangedand INotifyCollectionChangedtalk to the View through bindings
    Listens for changes from the View through bindings
    May invoke services to communicate outside the MVVM triad
  • 15. 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={StaticResourceTheViewModel}}">
    ...
    </Grid>
  • 16. MVVM Variations - 2
    ViewModel first
    View is injected into the ViewModel’sconstructor
    Example:
    ViewModel is created then the View is created using Dependency Injection
    public MyViewModel
    {
    public MyViewModel(IMyView view)
    {
    }
    }
  • 17. MVVM Variations - 3
    ViewModel and View are created through an intermediary, then paired together
    vm = new MyVM();
    view = new MyView();
    view.DataContext = vm;
    // With Unity
    vm = container.Resolve<IMyVM>();
    view = container.Resolve<MyView>();
    view.DataContext = vm;
  • 18. From Now On We’re Using ViewFirst
    <3
  • 19. Don’t look up!
    View only knows ViewModel
    ViewModel only knows Model
    The Model stands alone
  • 20. 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
    {
    boolCanExecute(Object parameter);
    void Execute(Object parameter);
    event EventHandlerCanExecuteChanged;
    )
  • 21. 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
  • 22. demo
    ViewFirst MVVM
  • 23. MEFManaged Extensibility Framework
  • 24. MEF Intro
    Library for building extensible applications
    Part of Silverlight 4
    Silverlight 3 support
    mef.codeplex.com
    Prism support
    mefcontrib.codeplex.com
    Open source
  • 25. MEF Basics
    An application is built of Parts
  • 26. The MEF “Motto”
    Exportit.
    Import it.
    Composeit.
  • 27. Export it
    [Export(typeof(UserControl))]
    public class Widget1 : UserControl
    {
    public string Message {
    get{return(string) Button.Content;}
    set{Button.Content=value;}
    }
    }
    Widget1
    UserControl
    Export
  • 28. Import it
    [Export(typeof(UserControl))]
    public class MainPage: UserControl
    {
    [ImportMany(typeof(UserControl))]
    public IEnumerable<UserControl> {
    get;set;
    }
    }
    Main
    Page
    UserControl
    ImportMany
  • 29. Compose it
    PartIntializer: “Compose yourself”
    public MainPage()
    {
    InitializeComponent();
    PartInitializer.SatisfyImports(this);
    }
    MainPage
    Compose
  • 30. demo
    Adding social widgets
  • 31. 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.
  • 32. Thanks!
    xamlpt.com/blogs/rfiel/
    pontonetpt.com/blogs/rfiel/
    blogs.fullsix.pt
    labs.fullsix.pt
    Ricardo Fiel
    Senior Engineer
    Fullsix Portugal
    ricardo.fiel@fullsix.com
    @theplastictoy
    Please keep in touch!