ViewModel從未如此清爽 - 輕量級WPF MVVM框架Stylet

Stylet是我最近發現的一個WPF MVVM框架, 在博客園上搜了一下, 相關的文章基本沒有, 因此寫了這個入門的文章推薦給你們.

Stylet是受Caliburn Micro項目的啓發, 因此借鑑了其中的不少概念, 同時精簡了一些部分, 如只支持MVVM, WPF和.NET 4.5(Silverlight和Xamarin不受支持), 因此Style自己很小巧, DLL才140KB左右.

雖然身材小,但相比知名的MVVM框架, 如MVVM Light等功能卻一點都不差,加上很完善的文檔,高覆蓋率的單元測試,我認爲它是一個頗有潛力的MVVM框架.

下面就經過一個相似Hello World的小例子, 給你們演示一下Stylet既簡潔又強大的功能.

建立工程

建立一個標準的WPF工程, 命名爲StyletStudy

安裝Style.Start包

打開包管理器命令行, 執行如下命令:

Install-Package Stylet.Start.

Stylet.Start會自動添加Stylet的引用, 並生成Stylet項目基本的文件, 安裝成功後, 項目結構以下所示:

此時,你就能夠按F5啓動項目, 看看你的第一個Stylet項目的樣子吧.

綁定屬性

固然,若是隻是這樣,那麼根本沒有展示Stylet的魅力, 下面咱們加入一些小改動, 用來揭開Stylet美麗的面紗.

1. 在ShellViewModel.cs中增長一個Name屬性
2. 在ShellView.xaml中增長一個TextBox, 綁定Name

Name屬性:

using Stylet;

namespace StyletStudy.Pages
{
    public class ShellViewModel : Screen
    {
        public string Name { get; set; } = "waku";  // C#6的語法, 聲明自動屬性並賦值
    }
}

TextBox:

<Window x:Class="StyletStudy.Pages.ShellView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:StyletStudy.Pages"
        mc:Ignorable="d"
        Title="Stylet Start Project" Height="350" Width="525"
        xmlns:s="https://github.com/canton7/Stylet"
        d:DataContext="{d:DesignInstance local:ShellViewModel}">
    <StackPanel>
        <TextBox Text="{Binding Name}"></TextBox>
    </StackPanel>
</Window>

也許你會注意到, 爲TextBox設置綁定時, Visual Studio是有智能提示的:

這是由於貼心的Stylet已經爲你將設計時的DataContext設置爲ShellViewModel, 注意XAML的第10行:

d:DataContext="{d:DesignInstance local:ShellViewModel}">

再次啓動, 能夠看到屬性的綁定已經成功了:

綁定命令

Stylet中對Command的實現方式深受Caliburn.Micro的影響,這也是Caliburn.Micro一大亮點,即經過命名約定實現Command的綁定.

1. 在ShellViewModel.cs中增長一個SayHello方法
2. 在ShellView.xaml中增長一個Button, 綁定SayHello

SayHello方法:

public string Name { get; set; } = "waku";

        public void SayHello() => Name = "Hello " + Name;    // C#6的語法, 表達式方法
}

SayHello只是簡單的在Name前加上"Hello ".

Button:

<StackPanel>
        <TextBox Text="{Binding Name}"></TextBox>
        <Button Content="Say Hello" Command="{s:Action SayHello}"></Button>
    </StackPanel>

注意Command="{s:Action SayHello}的語法,s:Action就是Stylet的魔法之一, 如此綁定後, 當點擊SayHello按鈕後,會自動調用ViewModel中的SayHello方法, 是否是很神奇?

啓動程序,若是你在SayHello中加入一個斷點,當點擊SayHello按鈕後,斷點應該就被觸發了:

可是,你會發現文本框中的內容並無被加上"Hello ",爲何呢?
若是你是一個合格的WPF程序員,你應該發現了其中的問題: Name屬性沒有引起PropertyChanged通知

實現PropertyChanged通知

MVVM框架通常經過繼承一個實現了INotifyPropertyChanged的基類, 而後在屬性的set方法中, 引起PropertyChanged通知.
不一樣的MVVM框架,可能用一些輔助方法來簡化這一過程, 以下面是MVVM Light實現Name屬性的方法:

private string _name;

        public string Name
        {
            get { return _name; }

            set
            {
                if (Set(ref _name, value))
                {
                }
            }
        }

Stylet也能夠用相似的方法來引起PropertyChanged, 可是若是隻是那樣我文章的標題就須要更名了:)
爲了清爽的ViewModel, Stylet內置了對PropertyChanged.Fody的支持.
PropertyChanged.Fody是一個很是神奇的包, 它會在編譯時爲你的屬性注入IL代碼, 來引起PropertyChanged通知,是否是聽上去就很是牛X?

固然PropertyChanged.Fody不是Stylet專用的,你也能夠在你本身的WPF項目中使用該包.
爲Stylet啓用PropertyChanged.Fody只須要一條命令安裝便可:

Install-Package PropertyChanged.Fody

安裝後,代碼無需任何修改,直接按F5運行.
再點擊SayHello按鈕,看看是否是Hello了?

防禦屬性(Guard Properties)

我想當TextBox爲空時, 自動禁用SayHello按鈕, 這樣的需求在開發中很常見.
Stylet爲你考慮到了這一點,你只須要實現一個防禦屬性便可.
對於SayHello方法, 實現一個CanSayHello屬性, 返回一個bool型結果,標識SayHello是否可被執行.代碼以下:

public void SayHello() => Name = "Hello " + Name;    // C#6的語法, 表達式方法

        public bool CanSayHello => !string.IsNullOrEmpty(Name);  // 同上

xaml中也須要爲TextBox的綁定作一些修改:

<TextBox Text="{Binding Name, UpdateSourceTrigger=PropertyChanged}"></TextBox>
        <Button Content="Say Hello" Command="{s:Action SayHello}"></Button>

爲綁定加上UpdateSourceTrigger=PropertyChanged, 這樣只要Name有任何修改,會當即評估CanSayHello屬性.

再次啓動項目,看看效果:

結語

至此,咱們Stylet的入門演示項目就開發完了,
能夠看到ViewModel中咱們本身寫的代碼只有3行,就完成了屬性綁定,命令綁定,防禦屬性功能. 是否是夠清爽?

固然,Stylet還有不少使人激動的特性,解決了長久以來WPF開發中的痛點,如彈出窗體消息框(經過WindowManager), 表單驗證(經過ValidatingModelBase),甚至Stylet中還內置了一個性能很是棒的IoC容器.
強烈建議感興趣的朋友看看Stylet的WIKI,裏面有不少值得學習和參考的東西.

最後,祝你們工做生活愉快!