這世上,沒人能一次性寫出完美無缺的框架;因為,任何一個框架都需要項目的淬煉,然後才能升華,趨近完美。 所以,框架是個反覆修改的東西,最終形成的東西。 如果你學了一點技術,覺得自己可以寫出框架了,覺得自己有架構師的能力,然而自己總是懷才不遇——那一定是你的錯覺。 因為,你框架沒有經過項目淬煉;而淬煉過 ...
這世上,沒人能一次性寫出完美無缺的框架;因為,任何一個框架都需要項目的淬煉,然後才能升華,趨近完美。
所以,框架是個反覆修改的東西,最終形成的東西。
如果你學了一點技術,覺得自己可以寫出框架了,覺得自己有架構師的能力,然而自己總是懷才不遇——那一定是你的錯覺。
因為,你框架沒有經過項目淬煉;而淬煉過框架的人都瞭解,設計的再好的框架,最終會被業務需求打的細碎,然後被開發人員攪和再一起。
所以細節決定成敗,沒有細節的框架就是扯淡。
DataControl—數據控制項
上文我們已經編寫出來了WPF的MVVM基礎框架,但為了讓他更加強壯,為了讓他多堅持一陣子再粉碎,我們要讓ViewModel更強壯,所以我們要編寫[數據控制項]。
數據控制項其實很好理解,它就是把UI控制項中存儲的數據提取出來,好讓ViewModel可以通過修改數據來控制UI變化;當然,為了更好的控制UI變化,數據控制項里還得包含一點管理UI的屬性。
因為WPF里的控制項大多繼承自Control,所以我們先創建Control的數據控制項。
public class Control<T> : INotifyPropertyChanged { public event PropertyChangedEventHandler PropertyChanged; public T _DataContent ; public T DataContent { get { return _DataContent; } set { _DataContent = value; OnPropertyChanged(); } } public Visibility _Visibility; public Visibility Visibility { get { return _Visibility; } set { _Visibility = value; OnPropertyChanged(); } } public bool _IsReadOnly; public bool IsReadOnly { get { return _IsReadOnly; } set { _IsReadOnly = value; OnPropertyChanged(); } } public bool _IsEnabled; public bool IsEnabled { get { return _IsEnabled; } set { _IsEnabled = value; OnPropertyChanged(); } } protected void OnPropertyChanged([CallerMemberName]string propertyName = "") { if (PropertyChanged != null) { PropertyChanged(this, new PropertyChangedEventArgs(propertyName)); } } }
如上代碼所示,我們創建了Control的數據控制項。
可以看到,處理存貯數據的DataContent屬性之外,還創建了一些管理UI的屬性IsEnabled、IsReadOnly、Visibility。
父類數據控制項創建完成後,我們開始創建子類的數據控制項。[如果子類要管理的UI屬性不在父類內,我們就需要額外創建一些]
TextBlock和TextBox
我們先創建最基礎的,最常用的TextBlock和TextBox。
TextBlock代碼如下:
public class TextBlock<T> : Control<T> { public T _Text; public T Text { get { return _Text; } set { _Text = value; OnPropertyChanged(); } } }
TextBox代碼如下:
public class TextBox<T> : Control<T> { public Action<T> TextChangeCallBack = null; public T _Text; public T Text { get { return _Text; } set { _Text = value; if (TextChangeCallBack != null) { TextChangeCallBack(_Text); } OnPropertyChanged(); } } }
可以看到TextBlock和TextBox都繼承了Control,而他們的區別隻是TextBox多了一個TextChangeCallBack。
有人會想到,那完全可以用TextBox替代TextBlock。
理論上,TextBlock是可以被替換,但為了程式清晰,還是區別開來更好。
控制項定義好了,我們現在看一下如何應用。
TextBox應用
xaml頁面代碼 <TextBox Text="{Binding ChangeTextBox.Text,Mode=TwoWay}" Margin="5" FontSize="12"></TextBox> ----------------------------------
ViewModel頁面代碼 public TextBox<string> ChangeTextBox { get; set; } public VM_PageTextBox() {
ChangeTextBox = new TextBox<string>(); ChangeTextBox.TextChangeCallBack = (text) => { MessageBox(text); };//聲明TextChange }
如代碼所示,我們在ViewModel中定義了ChangeTextBox屬性,然後再Xaml中綁定了ChangeTextBox屬性的Text到UI控制項TextBox的Text屬性上,這樣我們就實現了數據聯動。
並且代碼中實例化了TextChangeCallBack委托,那麼當Text數據變化時,該委托就會觸發。
註意:TextChangeCallBack委托與TextChanged事件不同,並不是每次修改文字都會觸發,而是當TextBox的Text內容真正被修改時,才會觸發;我們可以簡單的理解為TextBox失去焦點時才會觸發。
這裡只介紹TextBox應用,TextBlock應用就不介紹了,因為使用方式和TextBox一樣。
如果想瞭解更多數據控制項的應用,請去GitHub下載源碼。
ComboBox
ComboBox稍微複雜一點,因為他多了一個ItemSource屬性。
我們先看ComboBox的數據控制項代碼:
public class ComboBox<T> : Control<T> { public Action<T> SelectCallBack = null; public ComboBox() { } public ObservableCollection<T> _ItemsSource; public ObservableCollection<T> ItemsSource { get { return _ItemsSource; } set { _ItemsSource = value; if (_ItemsSource != null && _ItemsSource.Count > 0 && SelectedItem == null) { SelectedItem = _ItemsSource.First(); } OnPropertyChanged(); } } public T _SelectedItem; public T SelectedItem { get { return _SelectedItem; } set { _SelectedItem = value; if (SelectCallBack != null) { SelectCallBack(_SelectedItem); } OnPropertyChanged(); } } private ICollectionView _ItemsSourceView; public ICollectionView ItemsSourceView { get { _ItemsSourceView = CollectionViewSource.GetDefaultView(_ItemsSource); return _ItemsSourceView; } set { _ItemsSourceView = value; OnPropertyChanged(); } } public void SetItemsSource(List<T> itemSource) { ItemsSource = new ObservableCollection<T>(itemSource); } }
代碼相對簡單,SelectedItem和ItemsSource用來綁定UI控制項ComboBox的同名屬性。
ItemsSourceView:ItemsSourceView屬性可能有些難理解,這裡我們簡單介紹一下。
因為WPF的UI控制項被創建以後,要被添加到視覺樹中,所以最終會被顯示在屏幕上的是包裹著控制項的視覺樹;其中視覺樹與控制項是可以分離的;比如控制項中綁定的數據是10行,而視覺樹可以顯示3行。
為了管理視覺樹,我們創建了ItemsSourceView屬性。
因為ItemsSourceView是ICollectionView類型,所以ItemsSourceView可以處理排序、篩選和分組。[有興趣的同學可以自行瞭解下ICollectionView類型]
感覺這樣描述還是很難理解,讓我們一起在應用中慢慢理解吧。
ObservableCollection:我們可以看到ItemsSource是類型是ObservableCollection,而不是List。為什麼要用ObservableCollection呢?
很簡單,因為ObservableCollection繼承了INotifyCollectionChanged,即,數據控制項進行[行]的增刪,也會讓UI進行[行]的增刪。
ComboBox應用
在應用之前,我們先在Proxy建立一個獲取數據是代理。
創建獲取數據的方法如下:
public List<User> GetComboBoxData() { List<User> userList = new List<User>(); User user1 = new User() { Id = 1, Name = "張三", Age = 11 }; userList.Add(user1); return userList;
}
Xaml頁面代碼如下:
<ComboBox Margin="5" Width="200" FontSize="12" ItemsSource="{Binding TestComboBox.ItemsSource}" DisplayMemberPath="Name" SelectedValuePath="Id" SelectedItem="{Binding TestComboBox.SelectedItem}" ></ComboBox>
ViewModel代碼如下:
public ComboBox<User> TestComboBox { get; set; } TestDataProxy proxy = new TestDataProxy(); public VM_PageComboBox() { TestComboBox = new ComboBox<User>(); TestComboBox.SetItemsSource(proxy.GetComboBoxData()); TestComboBox.SelectCallBack = (user) => { MessageBox(user.Name); }; }
如上所示,我們已經實行了在ViewModel中管理ComboBox。
----------------------------------------------------------------------------------------------------
本篇文章就先講到這了,下一篇文章我們將一起為框架編寫DataGrid數據控制項。
因為DataGrid數據控制項是所有數據控制項中最複雜的,而且代碼量特別多;所以,我決定,單拿出一篇來介紹DataGrid。
框架代碼已經傳到Github上了,並且會持續更新。
相關文章:
To be continued——DataGrid
Github地址:https://github.com/kiba518/KibaFramework
----------------------------------------------------------------------------------------------------
註:此文章為原創,歡迎轉載,請在文章頁面明顯位置給出此文鏈接!
若您覺得這篇文章還不錯,請點擊下右下角的【推薦】,非常感謝!