MVVM: multiple Views for a single ViewModel

1. Introduction to MVVM
2. MVVM: ViewModel-First approach
3. MVVM Light Toolkit overview

В примерах, которые я показывал до сих пор, всегда был один ViewModel, который связывался только с одним View. Давайте теперь посмотрим, как можно связать ViewModel с несколькими View.

Давайте в демо приложение из предыдущей статьи добавим еще одно окошко DetailsWindow, в котором будем показывать текущее число тегов. XAML для нового окна будет очень простой.

<Window x:Class="MultipleViewsDemo.DetailsWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Width="150" Height="75"
        VerticalContentAlignment="Center" HorizontalContentAlignment="Center"
        WindowStartupLocation="CenterScreen"
        Title="DetailsWindow"
        DataContext="{Binding Main, Source={StaticResource Locator}}">

    <StackPanel Orientation="Horizontal" Margin="5">
        <TextBlock Text="Number of Tags:" />
        <TextBlock Text="{Binding Tags.Count}" Margin="5 0 0 0" />
    </StackPanel>
</Window>

Ключевой момент, на который нужно обратить внимание – это привязка свойства DataContext нового окна. Она абсолютно идентична привязке DataContext’a главного окна. Т.е. оба окна привязаны к одному и тому же ViewModel.

DataContext="{Binding Main, Source={StaticResource Locator}}"

Теперь при добавлении новых тегов оба окна будут реагировать на изменения во ViewModel. Главное окно будет показывать новые теги в списке, а в DetailsWindow будет обновляться количество тегов.

Исходный код можно скачать отсюда.