前言
软件开发中,用户交互体验至关重要。特别是在工业监控、金融系统或企业级应用中,消息提示作为信息反馈的重要手段,其美观性、易用性和稳定性都不可忽视。
本文将详细介绍如何使用 WPF 和 C# 实现一个类似 Windows 系统的通知提示框(Toast Notification),支持动画效果、自动关闭、多消息堆叠显示等功能,并通过代码展示完整的实现逻辑。适用于桌面应用程序的消息推送机制,具有良好的扩展性和复用性。
正文
一、效果图展示

主窗口界面简洁,仅包含一个触发按钮。点击按钮后,会在屏幕右下角依次弹出多个提示框,每个提示框带有标题、内容和关闭按钮,并具有淡入淡出的动画效果。
二、提示框界面设计(XAML)
提示框采用无边框、无标题栏的设计,设置为始终置顶窗口。核心结构如下:
xml
关键属性说明:
-
ResizeMode="NoResize":禁止调整大小。 -
WindowStyle="None":去除默认窗口样式。 -
Topmost="True":始终保持最上层。
三、主窗口后台逻辑(MainWindow.xaml.cs)
1、数据模型定义
用于传递提示框的标题和内容:
csharp
class NotifyData
{
public string Title { get; set; }
public string Content { get; set; }
}
2、主窗口类实现
csharp
public partial class MainWindow : Window
{
int i = 0;
public static List _dialogs = new List();
public MainWindow()
{
InitializeComponent();
}
private void Button_Click(object sender, RoutedEventArgs e)
{
i++;
NotifyData data = new NotifyData();
data.Title = "提示";
data.Content = "XXX余额不足,XXX余额不足,XXX余额不足,XXX余额不足" + i;
Window1 dialog = new Window1();
dialog.Closed += Dialog_Closed;
dialog.TopFrom = GetTopFrom();
dialog.DataContext = data;
dialog.Show();
_dialogs.Add(dialog);
}
private void Dialog_Closed(object sender, EventArgs e)
{
var closedDialog = sender as Window1;
_dialogs.Remove(closedDialog);
}
double GetTopFrom()
{
double topFrom = System.Windows.SystemParameters.WorkArea.Bottom - 10;
bool isContinueFind = _dialogs.Any(o => o.TopFrom == topFrom);
while (isContinueFind)
{
topFrom = topFrom - 160;
isContinueFind = _dialogs.Any(o => o.TopFrom == topFrom);
}
if (topFrom <= 0)
topFrom = System.Windows.SystemParameters.WorkArea.Bottom - 10;
return topFrom;
}
}
功能说明:
-
GetTopFrom()方法用于计算下一个提示框的位置,避免重叠。 -
_dialogs列表用于管理所有打开的提示框。 -
每个提示框关闭时会从列表中移除。
四、提示框后台逻辑(Window1.xaml.cs)
该类负责处理提示框的加载、位置动画和自动关闭功能。
csharp
public partial class Window1 : Window
{
public double TopFrom { get; set; }
public Window1()
{
InitializeComponent();
this.Loaded += NotificationWindow_Loaded;
}
private void NotificationWindow_Loaded(object sender, RoutedEventArgs e)
{
NotifyData data = this.DataContext as NotifyData;
if (data != null)
{
tbContent.Text = data.Content;
tbTitle.Text = data.Title;
}
Window1 self = sender as Window1;
if (self != null)
{
double right = SystemParameters.WorkArea.Right - 10;
self.Top = TopFrom - 160;
DoubleAnimation animation = new DoubleAnimation();
animation.Duration = new Duration(TimeSpan.FromMilliseconds(500));
animation.From = right;
animation.To = right - self.ActualWidth;
self.BeginAnimation(Window.LeftProperty, animation);
Task.Factory.StartNew(delegate
{
int seconds = 5;
System.Threading.Thread.Sleep(TimeSpan.FromSeconds(seconds));
this.Dispatcher.Invoke(delegate
{
animation = new DoubleAnimation();
animation.Duration = new Duration(TimeSpan.FromMilliseconds(500));
animation.Completed += (s, a) => { self.Close(); };
animation.From = right - self.ActualWidth;
animation.To = right;
self.BeginAnimation(Window.LeftProperty, animation);
});
});
}
}
private void Button_Click(object sender, RoutedEventArgs e)
{
double right = SystemParameters.WorkArea.Right;
DoubleAnimation animation = new DoubleAnimation();
animation.Duration = new Duration(TimeSpan.FromMilliseconds(500));
animation.Completed += (s, a) => { this.Close(); };
animation.From = right - this.ActualWidth;
animation.To = right;
this.BeginAnimation(Window.LeftProperty, animation);
}
}
功能说明:
-
提示框加载时执行滑动动画,从右侧滑入。
-
默认显示5秒后自动关闭,并执行反向滑出动画。
-
用户可点击"×"手动关闭提示框。
总结
本文详细介绍了如何使用 WPF 开发一个功能完整、视觉美观的通知提示框控件,涵盖了从界面布局、数据绑定到动画控制、自动关闭等多个关键技术点。通过实际编码展示了如何在工业级桌面应用中实现优雅的信息推送机制。
该提示框具备以下特点:
-
支持多消息堆叠显示;
-
自动计算弹窗位置,避免遮挡;
-
支持滑动动画,提升用户体验;
-
可灵活扩展内容格式和交互方式。
无论是用于业务提醒、系统通知还是异常提示,该组件都能很好地满足需求,具有良好的复用价值和工程实践意义。
关键词(顿号分隔)
WPF、通知框、Toast、弹窗、提示框、C#、WindowStyle、Topmost、DoubleAnimation、Dispatcher、Task、MVVM、UI交互、动画效果、工业级弹窗、消息推送、Windows提示风格、XAML、自定义控件、源码下载
最后
如果你觉得这篇文章对你有帮助,不妨点个赞支持一下!你的支持是我继续分享知识的动力。如果有任何疑问或需要进一步的帮助,欢迎随时留言。
也可以加入微信公众号 [DotNet技术匠] 社区,与其他热爱技术的同行一起交流心得,共同成长!
优秀是一种习惯,欢迎大家留言学习!