Here is a shameless (and less functional) copy of the great little JavaScript project by Hans Fjällemark and John Papa https://github.com/KnockedUp/toastR.
The UIMessage control also works in WPF.
Demo (please click the submit button)
Other Message Types
How to use UIMessage
<UserControl x:Class="UIMessageDemo_SL5.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:UIMessageDemo_SL5"
Width="400"
Height="150">
<Grid x:Name="LayoutRoot" Background="White">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="150" />
<ColumnDefinition Width="200" />
</Grid.ColumnDefinitions>
<Button x:Name="btnShowMessage"
Grid.Column="0"
Width="80"
Height="50"
Click="btnShowMessage_Click"
Content="Submit" />
<local:UIMessage x:Name="Message"
Grid.Column="1"
MessageType="Success"
Text="Success" />
</Grid>
</UserControl>
How to open UIMessage
using System.Windows;
namespace UIMessageDemo_SL5
{
public partial class MainPage
{
public MainPage()
{
InitializeComponent();
}
private void btnShowMessage_Click(object sender, RoutedEventArgs e)
{
Message.Show();
}
}
}
UIMessage.xaml
<UserControl x:Class="UIMessageDemo_SL5.UIMessage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
x:Name="UIMessageControl"
d:DesignHeight="300"
d:DesignWidth="400"
mc:Ignorable="d">
<UserControl.Resources>
<SolidColorBrush x:Key="ErrorBrush" Color="#D5BD3630" />
<SolidColorBrush x:Key="InfoBrush" Color="#D759ABC3" />
<SolidColorBrush x:Key="SuccessBrush" Color="#E151A351" />
<SolidColorBrush x:Key="QuestionBrush" Color="#DCF9A938" />
<BitmapImage x:Key="ErrorImage" UriSource="images/error.png" />
<BitmapImage x:Key="InfoImage" UriSource="images/info.png" />
<BitmapImage x:Key="SuccessImage" UriSource="images/success.png" />
<BitmapImage x:Key="QuestionImage" UriSource="images/question.png" />
<Storyboard x:Key="FadeIn">
<DoubleAnimation BeginTime="0"
Duration="00:00:02"
From="0"
Storyboard.TargetName="Display"
Storyboard.TargetProperty="Opacity"
To="1" />
</Storyboard>
<Storyboard x:Key="FadeOut">
<DoubleAnimation BeginTime="00:00:01"
Duration="00:00:02"
From="1"
Storyboard.TargetName="Display"
Storyboard.TargetProperty="Opacity"
To="0" />
</Storyboard>
</UserControl.Resources>
<Grid x:Name="LayoutRoot" Background="White">
<Border x:Name="Display"
Width="150"
Height="70"
Background="Pink"
CornerRadius="5"
Opacity="0">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="60" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image x:Name="Icon"
Grid.Row="0"
Grid.Column="0"
Width="30"
Height="30"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Stretch="Uniform" />
<TextBlock Grid.Column="1"
VerticalAlignment="Center"
Foreground="White"
Text="{Binding Path=Text,
ElementName=UIMessageControl,
UpdateSourceTrigger=PropertyChanged}" />
</Grid>
</Border>
</Grid>
</UserControl>
UIMessage.xaml.cs
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Media.Imaging;
namespace UIMessageDemo_SL5
{
public enum MessageType
{
NotSet = 0,
Error,
Info,
Success,
Question
}
public partial class UIMessage : UserControl
{
#region Fields
private SolidColorBrush _errorBrush;
private SolidColorBrush _infoBrush;
private SolidColorBrush _successBrush;
private SolidColorBrush _questionBrush;
private BitmapImage _errorImage;
private BitmapImage _infoImage;
private BitmapImage _successImage;
private BitmapImage _questionImage;
private Storyboard _fadeInStoryboard;
private Storyboard _fadeOutStoryboard;
#endregion
#region Constructor
public UIMessage()
{
InitializeComponent();
CheckResourcesAreAvailable();
_fadeInStoryboard.Completed += (sender, args) => _fadeOutStoryboard.Begin();
}
#endregion
#region Dependency Properties: MessageType, Text
public static readonly DependencyProperty TypeProperty =
DependencyProperty.Register("MessageType",
typeof(MessageType),
typeof(UIMessage),
new PropertyMetadata(MessageType.NotSet, TypePropertyChanged));
private static void TypePropertyChanged(DependencyObject dependencyObject, DependencyPropertyChangedEventArgs dependencyPropertyChangedEventArgs)
{
var uiMessage = (UIMessage)dependencyObject;
uiMessage.Display.SetValue(Border.BackgroundProperty, uiMessage.GetBrush(uiMessage.MessageType));
uiMessage.Icon.SetValue(Image.SourceProperty, uiMessage.GetImage(uiMessage.MessageType));
}
public MessageType MessageType
{
get { return (MessageType)GetValue(TypeProperty); }
set { SetValue(TypeProperty, value); }
}
public static readonly DependencyProperty TextProperty =
DependencyProperty.Register("Text",
typeof(string),
typeof(UIMessage),
new PropertyMetadata(default(string)));
public string Text
{
get { return (string)GetValue(TextProperty); }
set { SetValue(TextProperty, value); }
}
#endregion
#region Methods
private void CheckResourcesAreAvailable()
{
_errorBrush = (SolidColorBrush)this.Resources["ErrorBrush"];
_infoBrush = (SolidColorBrush)this.Resources["InfoBrush"];
_successBrush = (SolidColorBrush)this.Resources["SuccessBrush"];
_questionBrush = (SolidColorBrush)this.Resources["QuestionBrush"];
_errorImage = (BitmapImage)this.Resources["ErrorImage"];
_infoImage = (BitmapImage)this.Resources["InfoImage"];
_successImage = (BitmapImage)this.Resources["SuccessImage"];
_questionImage = (BitmapImage)this.Resources["QuestionImage"];
_fadeInStoryboard = (Storyboard)this.Resources["FadeIn"];
_fadeOutStoryboard = (Storyboard)this.Resources["FadeOut"];
if (_errorBrush == null) throw new Exception("Missing ErrorBrush resource");
if (_infoBrush == null) throw new Exception("Missing InfoBrush resource");
if (_successBrush == null) throw new Exception("Missing SuccessBrush resource");
if (_questionBrush == null) throw new Exception("Missing QuestionBrush resource");
if (_errorImage == null) throw new Exception("Missing BitmapImage ErrorImage resource");
if (_infoImage == null) throw new Exception("Missing BitmapImage InfoImage resource");
if (_successImage == null) throw new Exception("Missing BitmapImage SuccessImage resource");
if (_questionImage == null) throw new Exception("Missing BitmapImage QuestionImage resource");
if (_fadeInStoryboard == null) throw new Exception("Missing Storyboard FadeIn resource");
if (_fadeOutStoryboard == null) throw new Exception("Missing Storyboard FadeOut resource");
}
private SolidColorBrush GetBrush(MessageType type)
{
SolidColorBrush brush = null;
switch (type)
{
case MessageType.Info:
brush = _infoBrush;
break;
case MessageType.Error:
brush = _errorBrush;
break;
case MessageType.Success:
brush = _successBrush;
break;
case MessageType.Question:
brush = _questionBrush;
break;
}
return brush;
}
private BitmapImage GetImage(MessageType type)
{
BitmapImage image = null;
switch (type)
{
case MessageType.Info:
image = _infoImage;
break;
case MessageType.Error:
image = _errorImage;
break;
case MessageType.Success:
image = _successImage;
break;
case MessageType.Question:
image = _questionImage;
break;
}
return image;
}
public void Show()
{
_fadeInStoryboard.Begin();
}
#endregion
}
}
Source
http://stevenhollidge.com/blog-source-code/UIMessageDemo_SL5.ziphttp://stevenhollidge.com/blog-source-code/UIMessageDemo_WPF.zip
![image_thumb1[1]](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFRiP6InotoRFCCVN1PJfhLmIG6MUMiNy-Qe4YvPc_OVG7UTtmvKe4NevykBY3TyVzjUc6q5Oq82QEGd0tuS5_RDTyQ03govuc2NZR4VQyEd0ODTYv5XpCE_oIJ_D5gB3mz2gc1zlY4Fg/s1600-h/image_thumb1%25255B1%25255D%25255B3%25255D.png "image_thumb1[1]")
![image_thumb[1]](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg36hYaKugeUivA1-LsYDzxcdOyULj9okzxIE34R3a9aZmvLclDagK62RnK0sEdeElc7XWx0zsuJQX5Fkow8VXt7HH__6iBCdgYvOIZ3Sj0lWt010_3OS1j1D3W4oFrm-AU6kZz86hgrkM/s1600-h/image_thumb%25255B1%25255D%25255B3%25255D.png "image_thumb[1]")