大家可能很纠结在异步query数据的时候想在wpf程序中显示一个loading的遮罩吧
今天就为大家介绍下遮罩的制作
源码下载 点击此处
先上张效果图看看 如果不如您的法眼 可以移步了 或者有更好的效果 可以留言给我
废话不多说 直接贴代码 一个usercontrol
<UserControl x:Class="LoadingMask_Demo.LoadingWait"xmlns="/winfx//xaml/presentation"xmlns:x="/winfx//xaml"xmlns:mc="/markup-compatibility/" IsVisibleChanged="HandleVisibleChanged"><UserControl.Background><SolidColorBrush Color="Black" Opacity="0.2" /></UserControl.Background><UserControl.Resources><SolidColorBrush Color="#FF007BE5" x:Key="CirclesColor" /><!--<SolidColorBrush Color="Black" x:Key="BackgroundColor" Opacity=".20" />--></UserControl.Resources><Viewbox Width="100" Height="100" HorizontalAlignment="Center" VerticalAlignment="Center"><Grid x:Name="LayoutRoot" Background="Transparent" ToolTip="Please wait...." HorizontalAlignment="Center" VerticalAlignment="Center"><TextBlock Text="Loading..." HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="14" Foreground="#FFE3953D" FontWeight="Bold" /><Canvas RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Center" VerticalAlignment="Center" Width="120" Height="120" Loaded="HandleLoaded" Unloaded="HandleUnloaded" ><Ellipse x:Name="C0" Width="20" Height="20" Canvas.Left="0" Canvas.Top="0" Stretch="Fill" Fill="{StaticResource CirclesColor}" Opacity="1.0"/><Ellipse x:Name="C1" Width="20" Height="20" Canvas.Left="0" Canvas.Top="0" Stretch="Fill" Fill="{StaticResource CirclesColor}" Opacity="0.9"/><Ellipse x:Name="C2" Width="20" Height="20" Canvas.Left="0" Canvas.Top="0" Stretch="Fill" Fill="{StaticResource CirclesColor}" Opacity="0.8"/><Ellipse x:Name="C3" Width="20" Height="20" Canvas.Left="0" Canvas.Top="0" Stretch="Fill" Fill="{StaticResource CirclesColor}" Opacity="0.7"/><Ellipse x:Name="C4" Width="20" Height="20" Canvas.Left="0" Canvas.Top="0" Stretch="Fill" Fill="{StaticResource CirclesColor}" Opacity="0.6"/><Ellipse x:Name="C5" Width="20" Height="20" Canvas.Left="0" Canvas.Top="0" Stretch="Fill" Fill="{StaticResource CirclesColor}" Opacity="0.5"/><Ellipse x:Name="C6" Width="20" Height="20" Canvas.Left="0" Canvas.Top="0" Stretch="Fill" Fill="{StaticResource CirclesColor}" Opacity="0.4"/><Ellipse x:Name="C7" Width="20" Height="20" Canvas.Left="0" Canvas.Top="0" Stretch="Fill" Fill="{StaticResource CirclesColor}" Opacity="0.3"/><Ellipse x:Name="C8" Width="20" Height="20" Canvas.Left="0" Canvas.Top="0" Stretch="Fill" Fill="{StaticResource CirclesColor}" Opacity="0.2"/><Canvas.RenderTransform><RotateTransform x:Name="SpinnerRotate" Angle="0" /></Canvas.RenderTransform></Canvas></Grid></Viewbox></UserControl>后台代码：using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Windows;using System.Windows.Controls;using System.Windows.Data;using System.Windows.Documents;using System.Windows.Input;using System.Windows.Media;using System.Windows.Media.Imaging;using System.Windows.Navigation;using System.Windows.Shapes;using System.Windows.Threading;namespace LoadingMask_Demo{/// <summary>/// Interaction logic for LoadingWait.xaml/// </summary>public partial class LoadingWait : UserControl{#region Dataprivate readonly DispatcherTimer animationTimer;#endregion#region Constructorpublic LoadingWait(){InitializeComponent();animationTimer = new DispatcherTimer(DispatcherPriority.ContextIdle, Dispatcher);animationTimer.Interval = new TimeSpan(0, 0, 0, 0, 90);}#endregion#region Private Methodsprivate void Start(){animationTimer.Tick += HandleAnimationTick;animationTimer.Start();}private void Stop(){animationTimer.Stop();animationTimer.Tick -= HandleAnimationTick;}private void HandleAnimationTick(object sender, EventArgs e){SpinnerRotate.Angle = (SpinnerRotate.Angle + 36) % 360;}private void HandleLoaded(object sender, RoutedEventArgs e){const double offset = Math.PI;const double step = Math.PI * 2 / 10.0;SetPosition(C0, offset, 0.0, step);SetPosition(C1, offset, 1.0, step);SetPosition(C2, offset, 2.0, step);SetPosition(C3, offset, 3.0, step);SetPosition(C4, offset, 4.0, step);SetPosition(C5, offset, 5.0, step);SetPosition(C6, offset, 6.0, step);SetPosition(C7, offset, 7.0, step);SetPosition(C8, offset, 8.0, step);}private void SetPosition(Ellipse ellipse, double offset,double posOffSet, double step){ellipse.SetValue(Canvas.LeftProperty, 50.0+ Math.Sin(offset + posOffSet * step) * 50.0);ellipse.SetValue(Canvas.TopProperty, 50+ Math.Cos(offset + posOffSet * step) * 50.0);}private void HandleUnloaded(object sender, RoutedEventArgs e){Stop();}private void HandleVisibleChanged(object sender,DependencyPropertyChangedEventArgs e){bool isVisible = (bool)e.NewValue;if (isVisible)Start();elseStop();}#endregion }}
调用的代码也贴出来吧
<Window x:Class="LoadingMask_Demo.MainWindow"xmlns="/winfx//xaml/presentation"xmlns:x="/winfx//xaml"Title="MainWindow" Height="350" Width="525"xmlns:local="clr-namespace:LoadingMask_Demo"><DockPanel><StackPanel Orientation="Horizontal" DockPanel.Dock="Top"><Button Content="show" Width="70" Height="30" Click="ShowButton_Click" /><Button Content="hide" Width="70" Height="30" Click="HideButton_Click"/></StackPanel><Grid Background="#FF484848" DockPanel.Dock="Bottom"><TextBlock Text="asdfasdfasdf" Foreground="White"/><local:LoadingWait x:Name="_loading" Visibility="Collapsed"/></Grid></DockPanel></Window>后台代码using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Windows;using System.Windows.Controls;using System.Windows.Data;using System.Windows.Documents;using System.Windows.Input;using System.Windows.Media;using System.Windows.Media.Imaging;using System.Windows.Navigation;using System.Windows.Shapes;namespace LoadingMask_Demo{/// <summary>/// Interaction logic for MainWindow.xaml/// </summary>public partial class MainWindow : Window{public MainWindow(){InitializeComponent();}private void ShowButton_Click(object sender, RoutedEventArgs e){this._loading.Visibility = Visibility.Visible;}private void HideButton_Click(object sender, RoutedEventArgs e){this._loading.Visibility = Visibility.Collapsed;}}}
