最好用的WPF加载动画功能
作者：小码编匠
前言
当开发应用程序时，提供良好的用户体验（UX）是至关重要的。尤其是在处理大量数据或执行复杂操作期间，确保用户有一个流畅的加载体验不仅可以提高用户的满意度，还能有效减少等待过程中的焦虑感。
加载动画作为一种有效的沟通工具，它不仅能告知用户系统正在工作，还能够通过视觉上的吸引力来增强整体用户体验。
需求分析
在实现加载动画时，开发者通常会遇到两种主要方法，但它们都存在一定的局限性：
直接添加遮罩层：此方法涉及在控件之上叠加一个半透明的遮罩层，并在此层上展示加载动画。尽管这种方法能满足基本需求，但它要求为每次使用单独编写和管理显示/隐藏逻辑，这不仅增加了代码量，也容易导致代码库膨胀和维护困难。
封装成独立控件：另一种常见的做法是创建一个专门用于显示遮罩效果的控件，并将其应用于页面内容周围。虽然这种方式提高了二.基本用法
以下为示例代码，当ViewModel中的IsLoading属性值为True时，就会触发Loading动画。
View代码
<Window
x:Class="LoadingDemo.Views.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:extensions="clr-namespace:LoadingDemo.Extensions"
xmlns:prism="http://prismlibrary.com/"
Title="Loading测试"
Width="1366"
Height="768"
prism:ViewModelLocator.AutoWireViewModel="True"
FontSize="22"
WindowStartupLocation="CenterScreen">
<Grid extensions:FrameworkElementExtension.IsLoading="{Binding IsLoading}">
</Grid>
</Window>
ViewModel代码
namespace LoadingDemo.ViewModels
{
public class MainWindowViewModel : BindableBase
{
private bool _isLoading = false;
public bool IsLoading
{
get { return _isLoading; }
set { this.SetProperty(ref _isLoading, value); }
}
}
}
运行效果
高级用法
1、FrameworkElementExtension.IsLoading只能在Grid上使用吗？
答：No，几乎所有控件都可以使用，Window、Page、UserControl、Panel、Button、Rectangle、Path、TextBox等等，都没问题，只需要将IsLoading设置为True，就会出现Loading效果。
2、我觉得加载动画不好看，有没有办法换成其它的？
答：当然可以，除了默认加载效果以外，还可以添加任意你喜欢的效果，不管它是文字、动画、视频、gif图片还是其它的东西，通通都可以，并且操作非常简单，一共有两种方式。
方式一：统一添加的方式
只需在Resources中添加一个名为MaskContent的资源，在触发加载遮罩显示的时候就会自动读取该资源作为动画元素，如果放在App.Resources中，整个项目所有加载效果都使用该资源，如果放在Window.Resources中，Window中的所有加载效果都使用该资源，以此类推。
以下都是合法的代码。
添加自定义动画效果（用户控件）
<Window.Resources>
<controls:CustomLoading x:Key="MaskContent" Width="35" Height="35" />
</Window.Resources>
添加文字
<Window.Resources>
<TextBlock x:Key="MaskContent" Text="加载中..." HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="22" FontWeight="Bold" Foreground="White" />
</Window.Resources>
添加进度条控件
<Window.Resources>
<ProgressBar x:Key="MaskContent" Width="150" Height="15" HorizontalAlignment="Center" VerticalAlignment="Center" IsIndeterminate="True" />
</Window.Resources>
方式二：单独添加的方式
<Grid extensions:FrameworkElementExtension.IsLoading="{Binding IsLoading}">
<extensions:FrameworkElementExtension.MaskContent>
<TextBlock Text="加载中..." HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="22" FontWeight="Bold" Foreground="White"/>
</extensions:FrameworkElementExtension.MaskContent>
</Grid>
综合案例
代码复用性和易用性，但仍然需要在每个使用点重复引用该控件，未能完全解决代码冗余的问题。
总结
鉴于上述方法的不足之处，本文将介绍一种更为高效、侵入性小且具有高度可扩展性的解决方案——基于装饰器模式的加载动画实现。
这种模式允许我们以最小化的方式修改现有代码结构，同时提供灵活的扩展能力，使得加载动画功能可以在整个应用中轻松部署和维护。
最后
到此这篇关于最好用的WPF加载动画功能的文章就介绍到这了,更多相关WPF加载动画功能内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！