【我們一起寫架構】MVVM的WPF架構（五）—完結篇

前言

這篇文章是WPF架構系列的最後一篇，在這裡我想闡述一下我對架構設計的了解。

我對架構設計的了解是這樣的：

架構設計不應該局限于任何一種設計模式，我們在設計架構時，應該将設計模式揉碎，再重組；這樣設計出來的架構才具有一戰之力。

架構設計應該根據項目團隊成員水準量身定制。

我上一篇文章《

我們都知道，如何不被淘汰。

》中談到，開發人員分為程式員和代碼勞工兩種。

這兩種開發人員的技術實力差距是巨大的；如果架構設計時不考慮團隊成員的技術實力，那麼架構很難發揮出最高戰力。

比如，如果開發人員大多是代碼勞工，那麼，在設計架構時，要盡量将分工明确考慮進來，讓每個人隻負責自己子產品。最簡單的例子就是，前後端分離。

如果開發人員大多是程式員，那麼，在設計架構時，要盡量設計業務線性子產品，讓每個人可以掌控一條業務線，盡量不要前後端分離，盡量采取靈活設計模式，甚至，可以開放一部分項目經理的職權給開發人員，最大化生産力。

那麼，現在我們一起回頭看看已經編寫完的架構；我們會發現，它是一個将前背景融合，适合程式員團隊的架構。

DataGrid進階應用

在進階應用中，我們對表格增加了過濾功能。界面效果如下：

過濾的原理是利用ICollectionView的Filter屬性實作的，由于代碼比較多，這裡就隻列出一部分關鍵代碼，具體代碼大家可以去GitHub上下載下傳。

ItemsSourceView.Filter = new Predicate<object>((obj) =>
{
    bool isFilter = true; 
    foreach (FilterProperty pinfo in ComparePropertyList) //循環篩選出來需要比較的屬性
    { 
        string columnNameEn = pinfo.PropertyName;
　　　　 var filterValue = pinfo.PropertyValue;//過濾的值
　　　　 string columnType = pinfo.PropertyInfo.PropertyType.ToString().Replace("System.Nullable`1[", "").Replace("]", "").Replace("System.", "").ToLower();

        if (filterValue != null)
        {
            #region 重點内容 這裡開始執行真正的比較
            object rowValue = ToolFunction.GetPropertyValue(obj, pinfo.PropertyInfo);//資料行的值
            if (rowValue == null)
            {
                if (filterValue.ToString() == "")
                {
                    return true;
                }
                else
                {
                    return false;
                }
            }
            else
            {
                isFilter = CompareValue(columnType, rowValue, filterValue, pinfo.ConditionStr);
            }
            #endregion
        }
        if (!isFilter)
        {
            return isFilter;
        }
    }
    return isFilter;
});           

這上面簡短的代碼中，我們使用了ICollectionView類型的ItemsSourceView.Filter的方法來實作了過濾。

在代碼中可以看到，我們為Filter指派了一個匿名委托；這個委托有一個入參和一個傳回值；其中，入參是我們表格中的行的DataContext，傳回值是Bool類型，表示這行在表格中是否顯示。

接下來，我們在委托中對行的DataContext資料進行了比較處理，根據比較結果來确定，該行是否顯示。

UI控件

在這個架構裡，我們UI控件的目的提高UI與ViewModel的内聚，是以，這裡的UI控件是一定要和ViewModel打配合的。

這裡我編寫了一個DataGrid的UI控件，由于這個控件是最複雜的，如果大家能了解這個控件，相信，其他控件也可以信手捏來。

首先，我們先看下UI界面：

接下來，我們看一下Xaml界面的代碼，代碼如下：

<pv:KDataGrid  Margin="10,10,10,10" DataContext="{Binding DataGrid,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" > 
</pv:KDataGrid>             

代碼很簡潔，我們隻要綁定DataContex即可，當然綁定的資料源是我們的資料控件DatGrid。

然後，我們看下ViewModel的代碼，代碼如下：

public VM_PageUserList()
{
    Static.StaticData.DataGridConfig.Add(testDataProxy.GetDataGridConfig());
    DataGrid.DataGridName = "使用者資訊清單";
    DataGrid.SkipNumber = 3;
    DataGrid.BindSource(Load, null);
}           

在代碼中可以看到，我們首先通過testDataProxy.GetDataGridConfig()方法，從代理中擷取了表格配置。

然後将表格配置指派給了靜态變量Static.StaticData.DataGridConfig。

然後确定了目前表格的配置名DataGridName為[使用者資訊清單] 。

接下來我們正常配置，就實作了表格的展示。

其中表格配置類DataGridConfig代碼如下：

public partial class DataGridConfig
{
    [DataMember]
    public List<ColumnConfig> ColumnConfig { get; set; }
    [DataMember]
    public int DataGridId { get; set; }
    [DataMember]
    public string DataGridTemplateName { get; set; }
    [DataMember]
    public bool HasFilter { get; set; }
    [DataMember]
    public bool HasPaging { get; set; }
    [DataMember]
    public int CompanyId { get; set; }
    [DataMember]
    public int UserId { get; set; }
    [DataMember]
    public string RowForegroundConvert { get; set; } 
    [DataMember]
    public bool HasNo { get; set; } 
    [DataMember]
    public int FrozenColumnCount { get; set; }
    [DataMember]
    public bool HideControlRow { get; set; }   
}           

這裡，我們定義了列的集合，和表格的一些基礎配置，比如是否開啟過濾，是否開啟分頁等等。

由于代碼實在比較多，是以，這裡就隻列出一部分關鍵代碼了，具體代碼還請大家去GitHub上下載下傳閱讀。

其實，這裡的UI控件編寫，隻是為大家提供一個思路，畢竟現實中業務所需的控件是千奇百怪的，我們是沒辦法編寫出一個萬能控件的。

WPF架構系列文章，到此就完結了。

架構代碼已經傳到Github上了，歡迎大家下載下傳。

相關文章：

【我們一起寫架構】MVVM的WPF架構（一）—序篇

【我們一起寫架構】MVVM的WPF架構（二）—綁定

【我們一起寫架構】MVVM的WPF架構（三）—資料控件

【我們一起寫架構】MVVM的WPF架構（四）—DataGrid

Github位址：

https://github.com/kiba518/KibaFramework

注：此文章為原創，歡迎轉載，請在文章頁面明顯位置給出此文連結！

若您覺得這篇文章還不錯，請點選下右下角的【推薦】，非常感謝！