wpf loading 遮罩层效果（可以用在数据加载时使用）

最新推荐文章于 2024-07-04 10:40:11 发布
最新推荐文章于 2024-07-04 10:40:11 发布
阅读量1k 收藏 1
点赞数
原文链接：http://www.cnblogs.com/lhx880619/archive/2012/01/04/2312591.html
版权
本文介绍了如何在WPF中创建一个用于数据加载时的loading遮罩层效果。通过分享一个简单的XAML动画实现，展示了基本的遮罩层效果。作者欢迎有更好效果的读者分享交流。
摘要由CSDN通过智能技术生成

一直想做个wpf的loading遮罩效果

闲来无事网上看看别人做的 拔下来一个效果 共享给大家 如果有更好的可以告诉我下

先上个效果图

基本效果就是这样 实现起来也是只有xaml的动画

代码如下

<UserControl x:Class="Test.LoadingMask"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
  IsHitTestVisible="False"
>
    <UserControl.Resources>
        <!--block style-->
        <Style x:Key="PathStyle" TargetType="Path">
            <Setter Property="Fill" Value="#FF0092FF"></Setter>
            <Setter Property="Stretch" Value="Fill"></Setter>
            <Setter Property="RenderTransformOrigin" Value="0.5,4.3"></Setter>
            <Setter Property="VerticalAlignment" Value="Top"></Setter>
            <Setter Property="Height" Value="10"></Setter>
        </Style>
        <!-- A block in the progress ring (why does this trapezoid have a dozen corners?) -->
        <Geometry x:Key="Block">
            M291.15499,85.897525
			C291.15499,85.897525
			 301.88917,85.87921
			 301.88917,85.87921
			 301.88917,85.87921
			 300.38339,94.355061
			 300.38339,94.355061
			 300.38339,94.355061
			 292.85366,94.355042
			 292.85366,94.355042
			 292.85366,94.355042
			 291.15499,85.897525
			 291.15499,85.897525
			Z
        </Geometry>

        <!-- Animations for the individual blocks of the progress ring -->
        <Storyboard x:Key="ProgressAnimation" RepeatBehavior="Forever">

            <ColorAnimationUsingKeyFrames Duration="00:00:03.6" Storyboard.TargetName="block0" Storyboard.TargetProperty="(UIElement.OpacityMask).(SolidColorBrush.Color)">
                <LinearColorKeyFrame KeyTime="00:00:00.0" Value="#FF000000"/>
                <LinearColorKeyFrame KeyTime="00:00:00.2" Value="#EF000000"/>
                <LinearColorKeyFrame KeyTime="00:00:00.4" Value="#E2000000"/>
                <LinearColorKeyFrame KeyTime="00:00:00.6" Value="#D3000000"/>
                <LinearColorKeyFrame KeyTime="00:00:00.8" Value="#C6000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.0" Value="#B7000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.2" Value="#AA000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.4" Value="#9B000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.6" Value="#8E000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.8" Value="#7F000000"/>
                <LinearColorKeyFrame KeyTime="00:00:02.0" Value="#72000000"/>
                <LinearColorKeyFrame KeyTime="00:00:02.2" Value="#63000000"/>
                <LinearColorKeyFrame KeyTime="00:00:02.4" Value="#56000000"/>
                <LinearColorKeyFrame KeyTime="00:00:02.6" Value="#3D000000"/>
                <LinearColorKeyFrame KeyTime="00:00:02.8" Value="#26000000"/>
                <LinearColorKeyFrame KeyTime="00:00:03.0" Value="#19000000"/>
                <LinearColorKeyFrame KeyTime="00:00:03.2" Value="#0C000000"/>
                <LinearColorKeyFrame KeyTime="00:00:03.4" Value="#00000000"/>
                <LinearColorKeyFrame KeyTime="00:00:03.6" Value="#FF000000"/>
            </ColorAnimationUsingKeyFrames>

            <ColorAnimationUsingKeyFrames Duration="00:00:03.6" Storyboard.TargetName="block1" Storyboard.TargetProperty="(UIElement.OpacityMask).(SolidColorBrush.Color)">
                <LinearColorKeyFrame KeyTime="00:00:00.0" Value="#00000000"/>
                <LinearColorKeyFrame KeyTime="00:00:00.2" Value="#FF000000"/>
                <LinearColorKeyFrame KeyTime="00:00:00.4" Value="#EF000000"/>
                <LinearColorKeyFrame KeyTime="00:00:00.6" Value="#E2000000"/>
                <LinearColorKeyFrame KeyTime="00:00:00.8" Value="#D3000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.0" Value="#C6000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.2" Value="#B7000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.4" Value="#AA000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.6" Value="#9B000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.8" Value="#8E000000"/>
                <LinearColorKeyFrame KeyTime="00:00:02.0" Value="#7F000000"/>
                <LinearColorKeyFrame KeyTime="00:00:02.2" Value="#72000000"/>
                <LinearColorKeyFrame KeyTime="00:00:02.4" Value="#63000000"/>
                <LinearColorKeyFrame KeyTime="00:00:02.6" Value="#56000000"/>
                <LinearColorKeyFrame KeyTime="00:00:02.8" Value="#3D000000"/>
                <LinearColorKeyFrame KeyTime="00:00:03.0" Value="#26000000"/>
                <LinearColorKeyFrame KeyTime="00:00:03.2" Value="#19000000"/>
                <LinearColorKeyFrame KeyTime="00:00:03.4" Value="#0C000000"/>
                <LinearColorKeyFrame KeyTime="00:00:03.6" Value="#00000000"/>
            </ColorAnimationUsingKeyFrames>

            <ColorAnimationUsingKeyFrames Duration="00:00:03.6" Storyboard.TargetName="block2" Storyboard.TargetProperty="(UIElement.OpacityMask).(SolidColorBrush.Color)">
                <LinearColorKeyFrame KeyTime="00:00:00.0" Value="#0C000000"/>
                <LinearColorKeyFrame KeyTime="00:00:00.2" Value="#00000000"/>
                <LinearColorKeyFrame KeyTime="00:00:00.4" Value="#FF000000"/>
                <LinearColorKeyFrame KeyTime="00:00:00.6" Value="#EF000000"/>
                <LinearColorKeyFrame KeyTime="00:00:00.8" Value="#E2000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.0" Value="#D3000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.2" Value="#C6000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.4" Value="#B7000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.6" Value="#AA000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.8" Value="#9B000000"/>
                <LinearColorKeyFrame KeyTime="00:00:02.0" Value="#91000000"/>
                <LinearColorKeyFrame KeyTime="00:00:02.2" Value="#7F000000"/>
                <LinearColorKeyFrame KeyTime="00:00:02.4" Value="#72000000"/>
                <LinearColorKeyFrame KeyTime="00:00:02.6" Value="#63000000"/>
                <LinearColorKeyFrame KeyTime="00:00:02.8" Value="#56000000"/>
                <LinearColorKeyFrame KeyTime="00:00:03.0" Value="#3D000000"/>
                <LinearColorKeyFrame KeyTime="00:00:03.2" Value="#26000000"/>
                <LinearColorKeyFrame KeyTime="00:00:03.4" Value="#19000000"/>
                <LinearColorKeyFrame KeyTime="00:00:03.6" Value="#0C000000"/>
            </ColorAnimationUsingKeyFrames>

            <ColorAnimationUsingKeyFrames Duration="00:00:03.6" Storyboard.TargetName="block3" Storyboard.TargetProperty="(UIElement.OpacityMask).(SolidColorBrush.Color)">
                <LinearColorKeyFrame KeyTime="00:00:00.0" Value="#19000000"/>
                <LinearColorKeyFrame KeyTime="00:00:00.2" Value="#0C000000"/>
                <LinearColorKeyFrame KeyTime="00:00:00.4" Value="#00000000"/>
                <LinearColorKeyFrame KeyTime="00:00:00.6" Value="#FF000000"/>
                <LinearColorKeyFrame KeyTime="00:00:00.8" Value="#EF000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.0" Value="#E2000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.2" Value="#D3000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.4" Value="#C6000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.6" Value="#B7000000"/>
                <LinearColorKeyFrame KeyTime="00:00:01.8" Value="#AA000000"/>
                <LinearColorKeyFrame KeyTime="00:00:02.0" Value="#9B000000"/>
                <LinearColorKeyFrame KeyTime="00:00:02.2" Value="#91000000"/>
最低0.47元/天 解锁文章
annle1018
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
LoadingMask（WPF加载数据loading遮罩）
09-23
在WPF应用开发中，当用户等待数据加载时，为了提供更好的用户体验，通常会使用一个...通过解压并运行该项目，你可以看到具体的操作步骤和实现方式，这对于学习和理解如何在自己的WPF项目中使用加载遮罩非常有帮助。
WPF遮罩层实现
热门推荐
David
11-07 1万+
废话不多说，直接上图： 上代码：先搞一个基类，方便子窗体复用 public partial class BaseWindow : Window { public BaseWindow() : base() { this.Closed += Window_Closed; this.WindowStartup
WPF中的动态加载页面
最新发布
weixin_43152819的博客
07-04 170
WPF的动态加载界面
iOS开发 -- 懒加载
拾光Blog
10-23 402
1.懒加载基本懒加载——也称为延迟加载，即在需要的时候才加载（效率低，占用内存小）。所谓懒加载，写的是其get方法.注意：如果是懒加载的话则一定要注意先判断是否已经有了，如果没有那么再去进行实例化2.使用懒加载的好处：（1）不必将创建对象的代码全部写在viewDidLoad方法中，代码的可读性更强 （2）每个控件的getter方法中分别负责各自的实例化处理，代码彼此之间的独立性强，松耦合
WPF中的查询(C/S)架构版
weixin_44540479的博客
06-27 375
作者：郑凯丰 开发工具：VS、SQL Server、WPF、XAML 编写日期：2019年6月26日 代码： 首先我们先去数据库里面把查询的代码编写好，然后再出来拿数据 例如： –查询员工基本信息 IF(@type='UserControl_Loaded_SelectStaff') BEGIN SELECT ROW_NUMBER () over(order by t_staff.st...
WPF开源控件【Newbeecoder.UI】遮罩层
liaohaiyin的专栏
12-06 1043
在项目中，用户设置IsEnabled为False时，控件不可用，当控件不可用可以给它增加遮罩层。用户就点不到控件。 下面来分解一下遮罩层实现原理： 定有不可用装饰类，DisabledAdorner继承Adorner装饰类。Adorner是继承FrameworkElement元素基类。 定义集合VisualCollectione用于添加Grid，定义Grid容器用于遮罩控件。 private VisualCollection _visCollec; private Grid _grid; 在构造方
WPF Loading 效果源码
12-25
在本文中，我们将深入探讨WPF（Windows Presentation Foundation）中的加载（Loading）效果，并通过一个名为"LoadingDemo"的示例项目，了解如何实现高效且可定制的加载动画。WPF是.NET Framework的一个重要组成部分...
wpf加载等待动画（loading）
03-17
在本文中，我们将深入探讨如何在WPF（Windows Presentation Foundation）应用程序中实现一个加载等待动画，也就是我们常说的“Loading”效果。WPF是.NET框架的一部分，它为开发富客户端应用提供了强大的图形用户界面...
超炫酷的WPF实现Loading控件效果
09-03
通过这种方式，我们成功地在WPF中创建了一个可自定义的Loading控件，用户可以根据需求调整颜色、速度和动画效果，实现高度定制化的加载指示器。这样的控件不仅提升了应用的用户体验，也为开发者提供了更多设计上的...
数据加载进度条/自定义半透明遮罩层
08-03
在开发Web应用或者移动应用的过程中，用户界面的交互体验至关重要，而数据加载进度条和自定义半透明遮罩层正是提升用户体验的重要元素。本篇将详细介绍这两种技术，并结合实际应用场景来探讨它们的设计与实现。 ...
WPF弹出遮罩动画效果控件
05-17
最近正在学习WPF动画，于是自己做了一个弹出遮罩动画效果自定义控件，仅供参考学习。 1.控件淡出效果 2.控件弹出效果（控件由小到大）
WPF弹出半透明遮罩
12-22
WPF弹出半透明遮罩，比较简单，适合初学者
WPF Window背景半透明 ，蒙版操作实现
^@^lemon tea^@^
10-29 2779
本章主要讲述：在WPF中，蒙版背景实现； 主要是通过改变Window的背景透明度和设置属性（AllowsTransparency）允许透明，否则不生效； XAML设计代码 &lt;Window x:Class="Gvitech.Application.WPF.UI.FunFacility.WindowEquipmentRecord" xmlns="http://...
WPF实现Loading加载文字水波纹动画效果
dnazhd的博客
06-24 1374
实现效果如下： 思路：基本原理同博文WPF实现聚光灯动画效果一致，难点在与正弦曲线的绘制和动态效果。 步骤： 1、自定义控件UserControl的封装 添加自定义Value属性： public static readonly DependencyProperty ValueProperty = DependencyProperty.Register("Value", typeof(int), typeof(MyLoadingControl), new PropertyMet
WPF实现两种Loading加载特效
dnazhd的博客
11-12 1883
实现效果如下： 思路：效果一利用路径动画，效果二利用关键帧动画。 步骤： 1、效果一环形动画类EllipseCircleAnimation.cs internal class EllipseCircleAnimation : Grid { private int ellipseCount = 5; private Color[] ellipseColors = { (Color)ColorConverter.ConvertFromString("
WPF 添加半透明的遮罩层AdornerLayer，微信搜索效
DoitPlayer的专栏
05-08 6612
在一个page页面上添加一个半透明的遮罩层，遮罩层里显示一个用户控件。 效果就是微信的winows版的搜索功能。 这里要借助AdornerLayer。 首先自定义一个用户控件。这里就不描述了。 然后定义一个类继承Adorner。 代码如下： using System; using System.Collections.Generic; using System.Linq; using S
WPF 类似jquery blockUI的遮罩Loading加载效果
zythy的专栏
09-23 632
最近一个小项目想用WPF重写一下，需要一个类似Jquery 的blockUI的遮罩层，在后台执行任务的过程中显示Loading... 网上找了一圈，很难找到一个可以现成使用的。最终在基于网上资料的基础上，稍微改造了一下。下面附上代码： （此方案基于网络搜索获得，感谢提供对应方案的网友们） 1）新建一个BaseWindow.cs类文件 using System.Windows; using System.Windows.Controls; using System.Windows.Media; ..
DataGridComboBoxColumn可以在 WPF 中使用，使用示例并绑定数据源？
04-24
当然可以。以下是一个 DataGridComboBoxColumn 在 WPF 中使用的示例，并绑定到数据源的代码： 1. 首先，你需要在 XAML 中定义一个 DataGrid 控件，并在其中添加模板列，以包含 DataGridComboBoxColumn： ```xml <DataGrid AutoGenerateColumns="False"> <DataGrid.Columns> <!-- other columns... --> <DataGridTemplateColumn Header="MyComboBox"> <DataGridTemplateColumn.CellTemplate> <DataTemplate> <ComboBox ItemsSource="{Binding ItemsSource}" DisplayMemberPath="DisplayMember" SelectedValuePath="SelectedValue" SelectedValue="{Binding SelectedItem, Mode=TwoWay}" /> </DataTemplate> </DataGridTemplateColumn.CellTemplate> </DataGridTemplateColumn> </DataGrid.Columns> </DataGrid> ``` 2. 接下来，你需要在代码中获取 DataGridComboBoxColumn，并将其绑定到数据源： ```csharp private void SetupDataGrid() { // get the DataGridComboBoxColumn var comboBoxColumn = dataGrid.Columns.First(c => c.Header.Equals("MyComboBox")) as DataGridComboBoxColumn; // setup the ItemsSource binding var binding = new Binding("MyItemsSource") { Source = this }; comboBoxColumn.ItemsSourceBinding = binding; // setup the DisplayMemberPath binding binding = new Binding("MyDisplayMemberPath") { Source = this }; comboBoxColumn.DisplayMemberPathBinding = binding; // setup the SelectedValuePath binding binding = new Binding("MySelectedValuePath") { Source = this }; comboBoxColumn.SelectedValuePathBinding = binding; // setup the SelectedValue binding binding = new Binding("MySelectedValue") { Source = this, Mode = BindingMode.TwoWay }; comboBoxColumn.SelectedValueBinding = binding; } // in your ViewModel or code-behind, define the following properties for each of the bindings: public IEnumerable MyItemsSource { get; set; } public string MyDisplayMemberPath { get; set; } public string MySelectedValuePath { get; set; } public object MySelectedValue { get; set; } ``` 这样就可以在 WPF 中使用 DataGridComboBoxColumn 并绑定数据源了。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值