Předchozí díly:

1. MVVM #1–Úvod
2. MVVM #2–Příprava
3. MVVM #3–Shell
4. MVVM #4–Shell–Design Data

V dnešním díle si ukážeme jak vytvořit nový modul a jak ho provázat s hlavní aplikací.

Náš první modul bude obsahovat jednoduchou funkcionalitu pro práci s časem. Vytvoříme si tedy nový projekt typu Class Library ve kterém si vytvoříme podobnou strukturu jak můžete vidět na obrázku níže.

Dále nesmíme zapomenout přidat referenci na knihovnu MVVMSamle.Shared. Momentálně bude náš viewmodel velice jednoduchý. Bude obsahovat pouze jednu vlastnost DateTime, která zobrazí aktuální datum a čas.

public class AViewModel : WorkspaceViewModel
{
    private string _dateTime;
    public string DateTime
    {
        get { return _dateTime; }
        set
        {
            _dateTime = System.DateTime.Now.ToString();
            OnPropertyChanged(MethodBase.GetCurrentMethod());
        }
    }

    public AViewModel()
    {
        DisplayName = Shared.Strings.ModuleA_Action1_DisplayName;
        Initialize();
    }

    protected override void OnInitialize()
    {
        DateTime = System.DateTime.Now.ToString();
    }
}

V našem View bude pouze textblock pro zobrazení této vlastnosti

<UserControl x:Class="MVVMSample.Modules.Views.AView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <Grid>
        <TextBlock FontSize="48" Text="{Binding DateTime}"/>            
    </Grid>
</UserControl>

Pokud máme vytvořený modul, je potřeba o něm nějak říct naší hlavní Shell aplikaci. V Shell projektu upravíme třídu App. V metodě OnStartup nastavíme vlastnost GroupCommands třídy MainWindowViewModel. Zatím zde bude pouze jeden GroupCommand (Modul A). A tento GroupCommand bude mít pouze jeden Command (ViewModelA1), který po spuštění zobrazí (vytvoří novou záložku) A1View.

public partial class App : Application
{
    protected override void OnStartup(StartupEventArgs e)
    {
        MainWindowViewModel viewModel = new MainWindowViewModel();
        viewModel.GroupCommands = new List<GroupCommand>()
            {
                new GroupCommand()
                    {
                        GroupName = Shared.Strings.GroupCommand_ModuleA,
                        Commands = new List< RelayCommand >()
                        {
                            new UICommand(param => viewModel.AddWorkspace(new Modules.ViewModels.A1ViewModel()))
                            {
                                Name = Shared.Strings.Command_ViewModelA1
                            }
                        }
                    }
            };

        Shell.MainWindow mainWindow = new MainWindow();
        mainWindow.DataContext = viewModel;
        mainWindow.Show();
    

Pokud uživatel klikne na tlačítko ViewModelA1 tak se do kolekce workspaces přidá nový viewmodel A1ViewModel. Pokud by jsme aplikaci spustili, tak by se místo A1View zobrazil pouze textový popis daného viewmodelu. Proto je zapotřebí přidat do projektu nový ResourceDictionary

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:aVm="clr-namespace:MVVMSample.Modules.ViewModels;assembly=MVVMSample.Modules.ModuleA" 
                    xmlns:aVw="clr-namespace:MVVMSample.Modules.Views;assembly=MVVMSample.Modules.ModuleA">
    
    <DataTemplate DataType="{x:Type aVm:AViewModel}">
        <aVw:AView />    
    </DataTemplate>
    
</ResourceDictionary>

Ve kterém nastavíme pro daný viewmodel příslušné view. Všechno toto nastavení provedeme pomocí DataTemplate. Když spustíme aplikace a zobrazíme si A1View, budeme mít k dispozici i tlačítko pro Refresh, ktreré zavolá vždy metodu Initialize a provede aktualizaci času

Jednoduchý modul máme za sebou a příště si ukážeme jak např. komunikovat mezi moduly.