? ? ?這篇文章還是在之前用Caliburn.Micro搭建好的框架上繼續(xù)做的開(kāi)發(fā)，今天主要是增加了一個(gè)用戶窗體ImageProcessView，然后通過(guò)Treeview切換選擇項(xiàng)之后在界面顯示不同效果的圖片。

01

—

重要的知識(shí)點(diǎn)

本篇內(nèi)容基于CM框架編寫(xiě)，涉及以下知識(shí)點(diǎn)：

①實(shí)現(xiàn)?INotifyPropertyChanged：在mvvm開(kāi)發(fā)模式中，為了前臺(tái)和后臺(tái)更好的解耦合，前臺(tái)界面一般通過(guò)綁定屬性的方式獲取屬性值，而后臺(tái)屬性值變更后我們需要通知給前臺(tái)視圖，這時(shí)候我們的屬性值就需要實(shí)現(xiàn)INotifyPropertyChanged這個(gè)接口。

由于StartViewModel繼承了Caliburn.Micro.Screen，Caliburn.Micro.Screen實(shí)現(xiàn)了INotifyPropertyChanged，所以StartViewModel這個(gè)類本身是擁有屬性變更通知界面的功能的。但是我們添加的窗體ImageProcessViewModel除了它的構(gòu)造函數(shù)是在StartViewModel中實(shí)例化（擁有了INotifyPropertyChanged），其它想要實(shí)現(xiàn)這個(gè)接口有兩種方式：

-. 繼承Caliburn.Micro.Screen，即：

public class ImageProcessViewModel : Caliburn.Micro.Screen

-. 在nuget中引用PropertyChanged.Fody

并在類之前添加：

[AddINotifyPropertyChangedInterface]

這樣我們的這個(gè)類中所有的屬性變更后就會(huì)主動(dòng)通知界面更新了！

②TreeView用法實(shí)例：

主要包括TreeView樹(shù)列表構(gòu)建以及事件附件

<TreeView Grid.Row="0" Grid.Column="0" Grid.RowSpan="1"><TreeViewItem Header="TreeView"><TreeViewItem Header="TranslateTransform"/><TreeViewItem Header="RotateTransform"/><TreeViewItem Header="ScaleTransform"/><TreeViewItem Header="SkewTransform"/><TreeViewItem Header="TransformGroup"/><TreeViewItem Header="MatrixTransform"/></TreeViewItem><TreeView.ItemContainerStyle><Style TargetType="{x:Type TreeViewItem}" ><Setter Property="cal:Message.Attach" Value="[Event Selected] = [Action item_SelectedItemChanged($source,$eventArgs)]"/> </Style></TreeView.ItemContainerStyle></TreeView>

后臺(tái)代碼，重點(diǎn)是如何獲取當(dāng)前選擇的Item：

public void item_SelectedItemChanged(object sender, RoutedEventArgs e){TreeViewItem tvi = e.OriginalSource as TreeViewItem;var selectedItem = tvi.Header.ToString();switch (selectedItem){case "TranslateTransform":MessageBox.Show("這是一個(gè)圖片平移效果"); Image1Show = Visibility.Visible; break;case "RotateTransform":MessageBox.Show("這是一個(gè)圖片旋轉(zhuǎn)效果"); Image2Show = Visibility.Visible; break;case "ScaleTransform":MessageBox.Show("這是一個(gè)圖片縮放效果"); Image3Show = Visibility.Visible; break;case "SkewTransform":MessageBox.Show("這是一個(gè)圖片扭轉(zhuǎn)效果"); Image4Show = Visibility.Visible; break;case "TransformGroup":MessageBox.Show("這是一個(gè)圖片組合效果"); Image5Show = Visibility.Visible; break;case "MatrixTransform":MessageBox.Show("這是一個(gè)圖片矩陣效果"); Image6Show = Visibility.Visible; break;default: break;}}

③圖片顯示效果，需要了解RenderTransform類，主要實(shí)現(xiàn)以下6中效果：

一. RenderTransform類的成員：

1.TranslateTransform 　　平移效果

2.RotateTransform 　　　 旋轉(zhuǎn)效果

3.ScaleTransform 　　????? 縮放效果

4.SkewTransform 　　???? 扭轉(zhuǎn)效果

5.TransformGroup　　　　組合效果

6.MatrixTransform　　　　是其他幾個(gè)變形類的基類，矩陣方式實(shí)現(xiàn)效果

這里的代碼較長(zhǎng)，可以下載項(xiàng)目源碼查看.

二.?Visibility屬性：

WPF的Visibility屬性是個(gè)枚舉變量，有三種值：Collapsed、Hidden、Visible。

Collapsed與Hidden區(qū)別：Hidden僅僅是屬性設(shè)為不可視，但是屬性在畫(huà)面上依然占有空間。然而使用Collapsed的話，在不可視的基礎(chǔ)上，它還能將屬性在畫(huà)面上的占位符清除，屬性將徹底不影響畫(huà)面

namespace System.Windows {public enum Visibility : byte{Visible = 0,Hidden = 1,Collapsed = 2} }

后臺(tái)定義，切記給屬性添加get; set;權(quán)限，不然界面不會(huì)更新

public Visibility Image6Show { get; set; } = Visibility.Hidden;

在前臺(tái)綁定就好：

Visibility="{Binding Image6Show}"

三.?Image Stretch屬性值詳解：

namespace System.Windows.Media {public enum Stretch{None = 0,Fill = 1,Uniform = 2,UniformToFill = 3} }

None ：保持原始尺寸，圖片會(huì)按原始大小顯示

Fill：?縮放到目標(biāo)尺寸，寬高比不會(huì)保留，?圖片會(huì)按原始大小顯示

Uniform：縮放到目標(biāo)尺寸之內(nèi)，并保持原始寬高比。圖片會(huì)按照設(shè)置的Width和Height顯示，比例會(huì)失調(diào)

UniformToFill：保持原始寬高比進(jìn)行縮放，以填充。如果兩者的寬高比不同，源會(huì)被剪切掉多余的部分。

---------------------------------------------------------------------

其它的知識(shí)點(diǎn)已經(jīng)在之前講解過(guò)，不懂得話參考以下鏈接閱讀：

C# WPF MVVM項(xiàng)目實(shí)戰(zhàn)(進(jìn)階①)

C# WPF框架Caliburn.Micro入門實(shí)例1

C# 項(xiàng)目實(shí)戰(zhàn)(經(jīng)典)

02

—

操作演示

03

—

結(jié)尾

項(xiàng)目源碼網(wǎng)盤下載地址

鏈接：https://pan.baidu.com/s/1uP1Lw96Br1csLaF4B7ZKpw

提取碼:? 右下角點(diǎn)擊再看或者轉(zhuǎn)發(fā)，超過(guò)20個(gè)以后我會(huì)在留言區(qū)公布！

技術(shù)群：添加小編微信zls20210502，備注進(jìn)群！

總結(jié)

以上是生活随笔為你收集整理的C# WPF MVVM项目实战(进阶②)的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。