Verfasst von: bletra | 13. Mai 2011

WPF: Von Spaghetticode zu MVVM – Teil 8 von 9

In dieser Artikelserie möchte ich eine einfache Applikation, in eine testbare Applikation nach dem MVVM-Pattern umwandeln:

  1. Beispielapplikation mit Spaghetticode
  2. Refactoring 1: Model
  3. MVC, MVP, Presentation Model
  4. MVVM
  5. ICommand
  6. Binding
  7. Refactoring 2: ViewModel
  8. Refactoring 3: View
  9. Zusammenfassung

View

In der View muss der DataContext, wie in Teil 6 beschrieben, auf eine Instanz des ViewModels gesetzt werden. Die View kann nun die Commands und Properties des ViewModels wie folgt nutzen:

<DockPanel Cursor="{Binding Path=Cursor, Mode=OneWay}">
    <Label DockPanel.Dock="Top" Content="New feed address" Height="28" Name="lblFeed"  />
    <TextBox DockPanel.Dock="Top" Name="txtFeedAddress" Text="{Binding Path=Address, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"  />
    <Button DockPanel.Dock="Top" Content="Add feed" Name="btnAddFeed" Command="{Binding Path=AddCmd}" />
    <StatusBar Height="40" DockPanel.Dock="Bottom">
      <Label Name="lblMsg" Content="{Binding Path=Msg, Mode=OneWay}" />
    </StatusBar>
    <Button DockPanel.Dock="Bottom" Content="save feed list" Name="btnSave" Command="{Binding Path=SaveCmd}" />
    <ListBox Name="lbFeeds" ItemsSource="{Binding Path=Feeds, Mode=OneWay}" />
</DockPanel>

Die View bekommt alle Änderungen des ViewModels mit. Im nächsten und letzten Artikel dieser Serie fasse ich das Vorgehen und die vorgestellten Techniken kurz zusammen.

Advertisements

Responses

  1. […] Refactoring 3: View […]

  2. […] Refactoring 3: View […]

  3. […] Refactoring 3: View […]

  4. […] Refactoring 3: View […]

  5. […] Schlagwörter: ICommand, ViewModel « WPF: Von Spaghetticode zu MVVM – Teil 6 von 9 WPF: Von Spaghetticode zu MVVM – Teil 8 von 9 […]

  6. […] Refactoring 3: View […]

  7. […] Refactoring 3: View […]

  8. […] Refactoring 3: View […]


Kommentar verfassen

Trage deine Daten unten ein oder klicke ein Icon um dich einzuloggen:

WordPress.com-Logo

Du kommentierst mit Deinem WordPress.com-Konto. Abmelden / Ändern )

Twitter-Bild

Du kommentierst mit Deinem Twitter-Konto. Abmelden / Ändern )

Facebook-Foto

Du kommentierst mit Deinem Facebook-Konto. Abmelden / Ändern )

Google+ Foto

Du kommentierst mit Deinem Google+-Konto. Abmelden / Ändern )

Verbinde mit %s

Kategorien

%d Bloggern gefällt das: