消息通知,是一个应用中必不可少的组成部分。Win10下提供了多种消息通知机制,Toast通知只是其中一种。这篇博文和大家分享一下,如何使用Toast通知。
上图是一个基本的Toast通知,那我们该如何使用它呢?首先大家要知道,Toast 通知是由XML构建的。在Toast通知中提供消息内容及操作(比如回复,取消等)都是在XML中定义。
<toast>
<visual>
<binding template='ToastGeneric'>
<text>Hello World!</text>
<text>This is th 3 Example!</text>
<image src='ms-appx://Assets/Images/photo.jpg' placement='appLogoOverride'/>
</binding>
</visual>
<actions>
<input id='reply' type='text' placeHolderContent='placeHolderContent'/>
<action content='reply' arguments='reply' hint-inputId='reply'/>
</actions>
<audio src='ms-winsoundevent:Notification.Default'/>
</toast>
定义完成Toast通知结构后,接着我们使用 ToastNotification 与 ToastNotificationManager 类完成弹出通知的操作。
ToastNotification notification = new ToastNotification(xml);
ToastNotificationManager.CreateToastNotifier().Show(notification);
Toast 通知使用场景
Toast通知默认支持四种场景,可通过设置 <toast>
元素下的 scenario
属性。
default
reminder
: 通知会持续显示在屏幕上alarm
: 通知会持续显示在屏幕上并且循环播放声音inComingCall
: 在Moblie下全屏显示等
属性 scenario
默认为 default
, 每一种场景在UI表现与显示模式有所不同。
使用 XML 构建自定义Toast通知
从上述的XML结构中,可以看出Toast通知结构组成:
<toast>
<visual/>
<actions/>
<audio/>
</toast>
下面我们列出一些必要的元素及其必需属性
visual 元素
作用:用于定义Toast通知上展示内容,比如文本或图片。
元素 <binding>
template
:ToastGeneric 是属性template
的唯一值。
元素 <text>
元素 <image>
src
: 数据源,支持 http:// | https:// | ms-appx:/// | ms-appdata:///local/ | file:///placement
: 图片的显示位置 inline | appLogoOverride (正文 | 替换App图标,Toast通知左上角图标)hint-crop
: 图片的剪裁 none | circle (默认 | 圆形切割)
<toast>
<visual>
<binding template='ToastGeneric'>
<text>Hello World!</text>
<text>This is th 2 Example!</text>
<image src='ms-appx:///Assets/Images/photo.jpg' placement='appLogoOverride' hint-crop='circle'/>
<image src='ms-appx:///Assets/Images/demo.jpg' placement='inline'/>
</binding>
</visual>
</toast>
actions 元素
作用:用于定义Toast通知上提供的操作,比如上图中的回复操作。
元素 <input>
id
: 元素的 idtype
: text | selection (文本框 | 选择框)
元素 <selection>
id
: 元素的 idcontent
: 选择项的内容
元素 <action>
content
argument
hint-inputId
activationType
: foreground | background | protocol | system
<toast>
<visual>
<binding template='ToastGeneric'>
<text>Hello World!</text>
<text>This is th 3 Example!</text>
<image src='ms-appx://Assets/Images/photo.jpg' placement='appLogoOverride'/>
</binding>
</visual>
<actions>
<input id='reply' type='text' placeHolderContent='placeHolderContent'/>
<action content='reply' arguments='reply' hint-inputId='reply'/>
</actions>
</toast>
<toast>
<visual>
<binding template='ToastGeneric'>
<text>Hello World!</text>
<text>This is th 4 Example!</text>
<image src='ms-appx://Assets/Images/photo.jpg' placement='appLogoOverride'/>
</binding>
</visual>
<actions>
<input id='reply' type='selection'>
<selection content='selection_1' id='s1'/>
<selection content='selection_2' id='s2'/>
</input>
<action content='reply' arguments='reply'/>
<action content='cancel' arguments='cancel'/>
</actions>
</toast>
audio 元素
作用:用于定义Toast通知弹出时所播放的声音。
src
silent
loop
使用 NotificationsExtensions 构建 Toast 通知
如果觉得使用 XML 构建Toast通知太复杂太麻烦,那 NotificationsExtensions
就是为你准备的。
先看一下,NotificationsExtensions
里包含哪些关于 Toast
通知的类。
如果看过上面使用 XML 构建Toast通知的同学,肯定非常熟悉图中的类名,多的就不说了,用一个简单的例子,与大家一起学习 NotificationsExtensions
。
ToastContent toastContent = new ToastContent();
toastContent.Scenario = ToastScenario.Reminder;
//<visual>
ToastVisual toastVisual = new ToastVisual();
//<text>
ToastText toastTitle = new ToastText();
toastTitle.Text = "Hello World .";
ToastText toastTitle2 = new ToastText();
toastTitle2.Text = "This is the 5 Example !";
//</text>
//<image>
ToastAppLogo toastAppLogo = new ToastAppLogo();
toastAppLogo.Source = new ToastImageSource("/Assets/Images/photo.jpg");
ToastImage toastImageInline = new ToastImage();
toastImageInline.Source = new ToastImageSource("/Assets/Images/demo.jpg");
//</image>
toastVisual.BodyTextLine1 = toastTitle;
toastVisual.BodyTextLine2 = toastTitle2;
toastVisual.AppLogoOverride = toastAppLogo;
toastVisual.InlineImages.Add(toastImageInline);
//</visual>
//<actions>
ToastActionsCustom toastActions = new ToastActionsCustom();
ToastTextBox toastTextBox = new ToastTextBox("replyTextBox");
toastTextBox.PlaceholderContent = "输入回复消息";
ToastButton replyButton = new ToastButton("回复","reply");
replyButton.TextBoxId = "replyTextBox";
toastActions.Inputs.Add(toastTextBox);
toastActions.Buttons.Add(replyButton);
//</actions>
//<audio>
ToastAudio toastAudio = new ToastAudio();
toastAudio.Src = new Uri("ms-winsoundevent:Notification.Default");
//</audio>
toastContent.Visual = toastVisual;
toastContent.Actions = toastActions;
toastContent.Audio = toastAudio;
ToastNotification toastNotification = new ToastNotification(toastContent.GetXml());
ToastNotificationManager.CreateToastNotifier().Show(toastNotification);
使用 NotificationsExtensions
构建 Toast
通知是不是更加的方便和直观呢。从上面代码可以看出,我们使用 ToastContent
类构建 Toast
通知,对其属性 Visual
, Actions
, Audio
赋值,完成后调用 GetXml
方法获取一个 XmlDocument
对象,之后的过程就与原来一样了。
使用工具 Notifications Visualizer
Notifications Visualizer 可以协助我们构建 Toast 通知(当然也可以构建磁贴),它类似于 Visual Studio Designer,提供实时预览的功能,是一个提高开发效率的工具,推荐给大家。
Windows Store 下载: https://www.microsoft.com/en-us/store/apps/notifications-visualizer/9nblggh5xsl1
结束
这篇博客与大家一起学习了如何快速构建 Toast
通知,当然还有一些细节,比如在 Toast
通知的 XML 结构中某些元素的属性没有提及到,如果大家想了解,请参考下面的链接。OK,如何构建大家既然明白了,下一篇博客就该谈一下 Toast
通知的交互问题了,期待吧。