本文實(shí)例講述了WPF實(shí)現(xiàn)漸變淡入淡出的登陸窗口效果的方法。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下:
1、實(shí)現(xiàn)原理
① 利用UIElement.OpacityMask屬性,用于改變對象區(qū)域的不透明度的畫筆。可以使元素的特定區(qū)域透明或部分透明,從而實(shí)現(xiàn)比較新穎的效果。
② OpacityMask屬性接受任何畫刷,可利用LinearGradientBrush線性漸變畫刷,通過對漸變畫刷中各顏色點(diǎn)加以動(dòng)畫處理即可。
2、漸變淡入實(shí)現(xiàn)
漸變淡入效果,可通過事件觸發(fā)器觸發(fā)Loaded事件實(shí)現(xiàn),所以可以僅用前端XAML語言實(shí)現(xiàn)。
① 設(shè)置對象的OpacityMask屬性
復(fù)制代碼 代碼如下:
Grid.OpacityMask>
LinearGradientBrush StartPoint="0.5,1" EndPoint="0.5,0">
GradientStop Color="#00000000" Offset="0"/>
GradientStop Color="#00000000" Offset="1"/>
GradientStop Color="#00000000" Offset="1"/>
/LinearGradientBrush>
/Grid.OpacityMask>
② 設(shè)置對象的事件觸發(fā)器
復(fù)制代碼 代碼如下:
Grid.Triggers>
EventTrigger RoutedEvent="Loaded">
EventTrigger.Actions>
BeginStoryboard>
Storyboard>
DoubleAnimation From="1" To="0" Duration="0:0:1.5" Storyboard.TargetProperty="OpacityMask.(GradientBrush.GradientStops)[1].Offset"/>
DoubleAnimation From="1" To="0" Duration="0:0:1" BeginTime="0:0:0.5" Storyboard.TargetProperty="OpacityMask.(GradientBrush.GradientStops)[2].Offset"/>
ColorAnimation To="#FF000000" Duration="0" Storyboard.TargetProperty="OpacityMask.(GradientBrush.GradientStops)[2].Color"/>
/Storyboard>
/BeginStoryboard>
/EventTrigger.Actions>
/EventTrigger>
/Grid.Triggers>
3、漸變淡出實(shí)現(xiàn)
漸變淡出效果,由于事件觸發(fā)器事件需要路由事件觸發(fā),所以需要使用后端代碼實(shí)現(xiàn)。
① 準(zhǔn)備漸變淡出的動(dòng)畫和畫刷資源
復(fù)制代碼 代碼如下:
Window.Resources>
Storyboard x:Key="ClosedStoryboard" Storyboard.TargetName="LoginGrid">
DoubleAnimation From="1" To="0" Duration="0:0:2" Storyboard.TargetProperty="OpacityMask.(GradientBrush.GradientStops)[1].Offset"/>
DoubleAnimation From="1" To="0" Duration="0:0:1.5" BeginTime="0:0:0.5"Storyboard.TargetProperty="OpacityMask.(GradientBrush.GradientStops)[2].Offset"/>
ColorAnimation To="#00000000" Duration="0" Storyboard.TargetProperty="OpacityMask.(GradientBrush.GradientStops)[2].Color"/>
/Storyboard>
LinearGradientBrush x:Key="ClosedBrush" StartPoint="0.5,0" EndPoint="0.5,1">
GradientStop Color="#FF000000" Offset="0"/>
GradientStop Color="#FF000000" Offset="1"/>
GradientStop Color="#FF000000" Offset="1"/>
/LinearGradientBrush>
/Window.Resources>
② 后端通過綁定按鈕的Click事件實(shí)現(xiàn)
復(fù)制代碼 代碼如下:
private void btnCancel_Click(object sender, RoutedEventArgs e)
{
this.IsEnabled = false;
LoginGrid.OpacityMask = this.Resources["ClosedBrush"] as LinearGradientBrush;
Storyboard std = this.Resources["ClosedStoryboard"] as Storyboard;
std.Completed += delegate { this.Close(); };
std.Begin();
}
4、運(yùn)行效果圖如下:
希望本文所述對大家的WPF程序設(shè)計(jì)有所幫助。
您可能感興趣的文章:- WPF自定義控件和樣式之自定義按鈕(Button)
- WPF的數(shù)據(jù)綁定詳細(xì)介紹
- wpf將表中數(shù)據(jù)顯示到datagrid示例
- 在WinForm和WPF中使用GMap.Net地圖插件簡單教程
- 仿vs實(shí)現(xiàn)WPF好看的進(jìn)度條
- WPF彈出自定義窗口的方法
- WPF如何自定義TabControl控件樣式示例詳解
- C# WPF ListView控件的實(shí)例詳解
- WPF應(yīng)用啟動(dòng)慢的問題解決