Windows Phone 8.1中常用的四种消息通知方式

在一个APP中,消息通知是很基础的的一点。不同的通知,在不同的时机应该要有不同的提示,而不应该都是一种提醒方式。在这里根据邹欣大大的文章,自己扩充了一种消息提醒的方式,也算是现在能用到的几种方式吧。

First:调用系统接口,在屏幕上面弹出对话框

这一种方法也许是最简单的一种方法,即调用系统中自带的MessageDialog方法,在应用的上方弹出一灰色对话框,需要用户自己点击之后才能进行下一步操作,这种方式的消息提醒在早期WP8中用的很多,在某些消息弹出后的确需要用户进行选择的时候也的确需要这一种消息提醒,如:用户选择是否下载文件,用户是否确认进行不可回滚等操作。这一种的消息提醒也有两种方法。

直接使用系统自带方法,样式单一 :
1
2
3
4
5
public static async Task ShowMessage(string message)
{

var msgbox = new Windows.UI.Popups.MessageDialog(message);
var result = await msgbox.ShowAsync();
}
使用Flyout弹出此对话框,可自定义弹出框中的内容:
1
2
3
4
5
6
<Page.Resources>
<Flyout x:Key="NotificationFlyout" x:Name="NotificationFlyout">
<Grid Height="auto" Background="{ThemeResource ButtonPressedBackgroundThemeBrush}">
</Grid>
</Flyout>
</Page.Resources>

然后可以在其他的事件中调用这个这一个Flyout,举个例子,比如我用button的click时间来触发:

1
<Button ...... FlyoutBase.AttachedFlyout="{StaticResource NotificationFlyout}" Click="ShowMessage" />

之后在这个click事件中将此Flyout呼出:

1
Windows.UI.Xaml.Controls.Primitives.FlyoutBase.ShowAttachedFlyout((FrameworkElement)sender);

Second:调用系统接口,在屏幕的StatuBar显示文字

这种方法的代码量也很少,不过它适用于的场景还是不少的:

比如一些需要让用户知道,但是用户不会刻意去点击去知道的信息都可以在这里显示出来。在我印象中,腾讯QQ的登录Loading就在这个地方进行的消息通知。当然,这里的消息通知包含了一个ProgressIndicator,因此可以实现一些正在加载或者其他效果。这种方法同样很简单,将其封装成一个方法,使用时直接调用ChangeStatuBar(str,double)即可。

PS:在调用结束之后,别忘了将statusBar的文字切换回来。

1
2
3
4
5
6
7
8
9
10
private async void ChangeStatuBar(string str, double process)
{

Windows.UI.ViewManagement.StatusBar statusBar = Windows.UI.ViewManagement.StatusBar.GetForCurrentView();
statusBar.BackgroundColor = (Resources["ButtonPressedBackgroundThemeBrush"] as Windows.UI.Xaml.Media.SolidColorBrush).Color;
statusBar.ForegroundColor = Windows.UI.Colors.White;
statusBar.BackgroundOpacity = 1;
statusBar.ProgressIndicator.Text = str;
statusBar.ProgressIndicator.ProgressValue = process;
await statusBar.ProgressIndicator.ShowAsync();
}

Third:调用系统接口,显示出与系统推送通知类似的横幅通知

在WP8的时候,coding4fun有一个toast的元素非常好用,几乎能模拟出原生的横幅。但是到了8.1之后也就没有了对其的支持,还好应用可以调用应用的通知了,因此可以应用于系统内部。

下面的第一段代码非常详细,加上备注之后,使用难度应该会大大降低。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
private void ShowToastNotification(String message)
{

ToastTemplateType toastTemplate = ToastTemplateType.ToastImageAndText01;
XmlDocument toastXml = ToastNotificationManager.GetTemplateContent(toastTemplate);

// Set Text
XmlNodeList toastTextElements = toastXml.GetElementsByTagName("text");
toastTextElements[0].AppendChild(toastXml.CreateTextNode(message));

// Set image
// Images must be less than 200 KB in size and smaller than 1024 x 1024 pixels.
XmlNodeList toastImageAttributes = toastXml.GetElementsByTagName("image");
((XmlElement)toastImageAttributes[0]).SetAttribute("src", "ms-appx:///Images/logo-80px-80px.png");
((XmlElement)toastImageAttributes[0]).SetAttribute("alt", "logo");

// toast duration
IXmlNode toastNode = toastXml.SelectSingleNode("/toast");
((XmlElement)toastNode).SetAttribute("duration", "short");

// toast navigation
var toastNavigationUriString = "#/MainPage.xaml?param1=12345";
var toastElement = ((XmlElement)toastXml.SelectSingleNode("/toast"));
toastElement.SetAttribute("launch", toastNavigationUriString);

// Create the toast notification based on the XML content you've specified.
ToastNotification toast = new ToastNotification(toastXml);

// Send your toast notification.
ToastNotificationManager.CreateToastNotifier().Show(toast);
}

当然我自己用的最多的方法是下面这种:

1
2
3
4
5
6
7
8
9
10
private async void Change_StatuBar(string str,int process)
{

StatusBar statusBar = StatusBar.GetForCurrentView();
statusBar.BackgroundColor = Windows.UI.Colors.Green;
statusBar.ForegroundColor = Windows.UI.Colors.White;
statusBar.BackgroundOpacity = 1;
statusBar.ProgressIndicator.Text = str;
statusBar.ProgressIndicator.ProgressValue = process;
await statusBar.ProgressIndicator.ShowAsync();
}

Fourth:自定义控件,实现类似于系统横幅的通知

系统自定义的横幅虽然好,但是每一次呼出都会有声音,无法连续输出可用信息,在使用软件进行推送之后,也会在统治中心中存在留余。因为,虽然自定义控件的代码多(相对来说),但是比起来其他三种通知的方式,自由度就大了很多,比如位置,时间,退出方式等等。

接下来分享由邹欣大大博客里的这份UserControl.

在generic.xaml中的样式代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
<Grid x:Name="mainGrid" 
Width="1920" Height="60"
VerticalAlignment="Top" HorizontalAlignment="Center" Background="{ThemeResource CNBlogsSummaryColor}" Visibility="Collapsed">

<Grid.RenderTransform>
<TranslateTransform
x:Name="GridTrans" Y="-60">

</TranslateTransform>
</Grid.RenderTransform>

<TextBlock
HorizontalAlignment="Center" VerticalAlignment="Center" Style="{ThemeResource NotificationBarFont}" x:Name="tb_Notify">

</TextBlock>
</Grid>

弹出动画代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<Grid.Resources>

<Storyboard x:Name="tb_Notify_in">
<ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="mainGrid" Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="00:00:00">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
<DiscreteObjectKeyFrame KeyTime="00:03:00">
<DiscreteObjectKeyFrame.Value>
<Visibility>Collapsed</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames Storyboard.TargetName="GridTrans" Storyboard.TargetProperty="Y" BeginTime="0:0:0">
<SplineDoubleKeyFrame KeyTime="00:00:00.00" Value="-60" />
<SplineDoubleKeyFrame KeyTime="00:00:00.10" Value="-38" />
<SplineDoubleKeyFrame KeyTime="00:00:00.20" Value="-22" />
<SplineDoubleKeyFrame KeyTime="00:00:00.30" Value="-10" />
<SplineDoubleKeyFrame KeyTime="00:00:00.40" Value="-3" />
<SplineDoubleKeyFrame KeyTime="00:00:00.50" Value="0" />
<SplineDoubleKeyFrame KeyTime="00:00:02.50" Value="0" />
<SplineDoubleKeyFrame KeyTime="00:00:02.60" Value="-3" />
<SplineDoubleKeyFrame KeyTime="00:00:02.70" Value="-10" />
<SplineDoubleKeyFrame KeyTime="00:00:02.80" Value="-22" />
<SplineDoubleKeyFrame KeyTime="00:00:02.90" Value="-38" />
<SplineDoubleKeyFrame KeyTime="00:00:03.00" Value="-60" />
</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames Storyboard.TargetName="mainGrid" Storyboard.TargetProperty="Opacity" BeginTime="0:0:0">
<SplineDoubleKeyFrame KeyTime="00:00:00.00" Value="0" />
<SplineDoubleKeyFrame KeyTime="00:00:00.50" Value="0.9" />
<SplineDoubleKeyFrame KeyTime="00:00:02.50" Value="0.9" />
<SplineDoubleKeyFrame KeyTime="00:00:03.00" Value="0" />
</DoubleAnimationUsingKeyFrames>
</Storyboard>

</Grid.Resources>

在后台使用此控件:

1
xxxx.ShowMessage("网络连接情况不理想 >O<");

结语

以上就是我已知和我一直在用的四种消息通知的方式,希望大家合理使用消息通知,为完善WP生态环境做出自己的一份力量。

其中部分代码可以在邹老师团队的博客中找到:博客园客户端UAP开发随笔 – 狡兔三窟:App内的三种通知消息的实现