【UWP通用应用开发】使用Toast通知与动态磁贴

前端之家收集整理的这篇文章主要介绍了【UWP通用应用开发】使用Toast通知与动态磁贴前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

使用Toast通知示例

前面我们使用了MessageDialog来作为弹窗,这里来介绍一个更加高大上的Toast通知

Toast通知本质上动力是由XML来提供的,一开始我还不相信不知道XML原来有这么大的威力。现在就来看看和Toast相关的知识。

1)实例化ToastNotification类。

  1. ToastNotification toast1 = new ToastNotification(xdoc);

2)使用ToastNotificationManager来管理Toast通知包括添加、展示、移除、获取通知等等。

  1. ToastNotificationManager.CreateToastNotifier().Show(toast1);

3)在第一步中的xdoc就是一段XML数据,它从何而来呢?

  1. XmlDocument xdoc = new XmlDocument();

4)上一步代码实例化了一个XML,但是它没有数据呀,数据从哪来呢?

  1. xdoc.LoadXml(txtXML.Text);

5)这段代码就将一段Text导入了XML中。而Text数据有很多种获取方式。在下文中自然会提到。

Toast的XML模板有许多,我们可以直接来获取它们。用枚举和强大的var即可。

  1. var items = Enum.GetNames(typeof(ToastTemplateType));

那么就正式开工了,因为重复的属性太多了我就大概设置了2个Style资源。

  1. <Page.Resources>
  2. <Style TargetType="TextBlock" x:Key="StyleHeaderTextBlock">
  3. <Setter Property="FontSize" Value="40"/>
  4. <Setter Property="FontFamily" Value="华文琥珀"/>
  5. <Setter Property="Foreground" Value="HotPink"/>
  6. <Setter Property="Margin" Value="12"/>
  7. </Style>
  8.  
  9. <Style TargetType="Button" x:Key="StyleToastButton">
  10. <Setter Property="Width" Value="180"/>
  11. <Setter Property="Height" Value="50"/>
  12. <Setter Property="Background" Value="Aqua"/>
  13. <Setter Property="FontSize" Value="21"/>
  14. <Setter Property="Margin" Value="12"/>
  15. <Setter Property="Content" Value="显示Toast通知" />
  16. </Style>
  17. </Page.Resources>

下面是第一部分用于生成Toast通知

  1. <StackPanel Orientation="Vertical" Grid.Column="0" Margin="12">
  2. <TextBlock Text="生成Toast通知" Style="{StaticResource StyleHeaderTextBlock}"/>
  3. <StackPanel Orientation="Horizontal" HorizontalAlignment="Left">
  4. <TextBlock FontSize="24" Foreground="Wheat" Text="请选择一个模板:" VerticalAlignment="Center"/>
  5. <ComboBox Name="comboBoxToast" Foreground="Green" Width="275"
  6. SelectionChanged="comboBoxToast_SelectionChanged"/>
  7. </StackPanel>
  8. <TextBox Foreground="Green" x:Name="txtXML" HorizontalAlignment="Left" Width="500" Height="400" Header="模板XML:" TextWrapping="Wrap" FontSize="24"/>
  9. <Button Name="btnShowToast1" Click="btnShowToast1_Click" Style="{StaticResource StyleToastButton}"/>
  10. </StackPanel>

后台代码也蛮容易的,利用上面讲的就好了。

  1. public MainPage()
  2. {
  3. this.InitializeComponent();
  4. var items = Enum.GetNames(typeof(ToastTemplateType));
  5. this.comboBoxToast.ItemsSource = items;
  6. }
  7.  
  8. private void comboBoxToast_SelectionChanged(object sender,SelectionChangedEventArgs e)
  9. {
  10. string tempt = ((ComboBox)sender).SelectedItem as string;
  11. if (!string.IsNullOrEmpty(tempt))
  12. {
  13. ToastTemplateType template = (ToastTemplateType)Enum.Parse(typeof(ToastTemplateType),tempt);
  14. XmlDocument xdoc = ToastNotificationManager.GetTemplateContent(template);
  15. txtXML.Text = xdoc.GetXml();
  16. }
  17. }
  18.  
  19. private void btnShowToast1_Click(object sender,RoutedEventArgs e)
  20. {
  21. if (txtXML.Text == "")
  22. return;
  23. XmlDocument xdoc = new XmlDocument();
  24. xdoc.LoadXml(txtXML.Text);
  25. ToastNotification toast1 = new ToastNotification(xdoc); ToastNotificationManager.CreateToastNotifier().Show(toast1);
  26. }

模板是这样用的……

在src中填入图片的路径也可以在Toast中显示图像哦,赶紧试试吧……

接下来是第二段啦,和前面的很是类似……

  1. <StackPanel Orientation="Vertical" Grid.Column="1">
  2. <TextBlock Text="更改Toast通知提示音" Style="{StaticResource StyleHeaderTextBlock}"/>
  3. <TextBlock Margin="12" Text="请输入Toast消息内容:" FontSize="24"/>
  4. <TextBox Margin="12" Height="50" x:Name="txtMesaage"/>
  5. <TextBlock Margin="12" FontSize="24" Text="请选择一种提示声音:"/>
  6. <ComboBox Margin="12" Height="50" x:Name="comboBoxAudio" Width="400" HorizontalAlignment="Left">
  7. <ComboBoxItem IsSelected="True">ms-winsoundevent:Notification.Default</ComboBoxItem>
  8. <ComboBoxItem>ms-winsoundevent:Notification.IM</ComboBoxItem>
  9. <ComboBoxItem>ms-winsoundevent:Notification.Mail</ComboBoxItem>
  10. <ComboBoxItem>ms-winsoundevent:Notification.Reminder</ComboBoxItem>
  11. <ComboBoxItem>ms-winsoundevent:Notification.Looping.Alarm</ComboBoxItem>
  12. <ComboBoxItem>ms-winsoundevent:Notification.Looping.Call</ComboBoxItem>
  13. </ComboBox>
  14. <StackPanel Orientation="Horizontal">
  15. <CheckBox x:Name="checkBoxLoop" Margin="12" Content="循环播放"/>
  16. <CheckBox x:Name="checkBoxSilent" Margin="12" Content="静音"/>
  17. </StackPanel>
  18. <Button Name="btnShowToast2" Click="btnShowToast2_Click" Style="{StaticResource StyleToastButton}"/>
  19. </StackPanel>

上面代码中的“ms-winsoundevent:Notification.Default”都是填到src中的用于设置声音,还可以在loop、silent中设置是否循环以及是否静音,那到底该怎么用呢?应该将这些属性全部都填入到XML中。

  1. xmlContent = string.Format(
  2. "<toast duration='{0}'>" +
  3. "<visual>" +
  4. "<binding template='ToastText01'>" +
  5. "<text id='1'>{1}</text>" +
  6. "</binding>" +
  7. "</visual>" +
  8. "<audio src='{2}' loop='{3}' silent='{4}'/>" +
  9. "</toast>",toastDuration,msg,audioSrc,isLoop,isSilent
  10. );

上面用的xmlContent也要先定义出来,一开始设置为Empty就好。

  1. string xmlContent = string.Empty;

isLoop和isSilent属性都可以借助于三目运算符在CheckBox获取来。

  1. string isLoop = checkBoxLoop.IsChecked == true ? "true" : "false";
  2. string audioSrc = (comboBoxAudio.SelectedItem as ComboBoxItem).Content.ToString();
  3. string toastDuration = checkBoxLoop.IsChecked == true ? "long" : "short";
  4. string isSilent = checkBoxSilent.IsChecked == true ? "true" : "false";

当然,考虑得更加周到些,用户可以在还没有输入通知内容就点了显示Toast通知按钮,对此用三目运算符也是极好的选择。

  1. string msg = txtMesaage.Text == "" ? "你还没有输入Toast通知内容呢……" : txtMesaage.Text;

这些准备工作都写好了以后呢就该设置Toast通知了,和上面的Toast1类似哦,大家试试。

可是这些通知都没有时间性可言,因为有时候我们需要定在一个时间来执行Toast通知。这自然也是可以实现的。

先作如下界面设计。

  1. <StackPanel Orientation="Vertical" Grid.Column="2">
  2. <TextBlock Text="计划时间显示Toast通知" Style="{StaticResource StyleHeaderTextBlock}"/>
  3. <StackPanel Orientation="Horizontal" Height="60">
  4. <TextBlock FontSize="28" Text="计划在" VerticalAlignment="Center"/>
  5. <TextBox Name="tBoxTime" FontSize="28" Width="60" Height="45" VerticalAlignment="Center"/>
  6. <TextBlock FontSize="28" Text="秒后显示Toast通知" VerticalAlignment="Center"/>
  7. </StackPanel>
  8. <Button Name="btnShowToast3" Click="btnShowToast3_Click" Style="{StaticResource StyleToastButton}"/>
  9. </StackPanel>

后台代码如下。

  1. private async void btnShowToast3_Click(object sender,RoutedEventArgs e)
  2. {
  3. int toastTime;
  4. try
  5. {
  6. toastTime = int.Parse(tBoxTime.Text.ToString());
  7. XmlDocument xdoc = ToastNotificationManager.GetTemplateContent(ToastTemplateType.ToastText01);
  8. var txtnodes = xdoc.GetElementsByTagName("text");
  9. txtnodes[0].InnerText = "你好,这是一条定时为"+toastTime.ToString()+ "秒的Toast消息。";
  10. ScheduledToastNotification toast3 = new ScheduledToastNotification(xdoc,DateTimeOffset.Now.AddSeconds(toastTime)); ToastNotificationManager.CreateToastNotifier().AddToSchedule(toast3);
  11. }
  12. catch (Exception ex)
  13. {
  14. Windows.UI.Popups.MessageDialog messageDialog =
  15. new Windows.UI.Popups.MessageDialog(ex.Message);
  16. await messageDialog.ShowAsync();
  17. }
  18. }

在这个小程序中因为侧重于讲解定时而非Toast的通知样式,因此就选用了比较简单的ToastText01模板。而后找出Text节点,并向该节点写入内容。最后就是创建Toast通知了。

  1. ScheduledToastNotification toast3 = new ScheduledToastNotification(xdoc,DateTimeOffset.Now.AddSeconds(toastTime));

同样为了防止用户没有在TextBox中输入时间或输入了错误格式的时间比如“5秒”而做了try、catch异常检测。当然了,在实际产品中,这里可就要做得更加完美了,时间用TextBox来输入并不是一件好事,而应用我们前面介绍的TimePicker。

给这3段程序来张全家福吧~

使用动态磁贴示例

动态磁贴是什么,相信大家用了这么久的Windows 8/8.1/10早就非常了解了吧。

像什么小磁贴、中磁贴、宽磁贴、大磁贴,还有这里的应用商店logo等,大家在下面根据不同的分辨率选择合适的图片就好啦。

下面来做一个更新磁贴页面功能,这是页面XML部分。

  1. <StackPanel Margin="12">
  2. <StackPanel Orientation="Horizontal">
  3. <TextBlock FontSize="28" Text="选择模板:" VerticalAlignment="Center"/>
  4. <ComboBox x:Name="comboBoxTile" Width="400" SelectionChanged="comboBoxTile_SelectionChanged"/>
  5. </StackPanel>
  6. <TextBox x:Name="textBoxXML" TextWrapping="Wrap" FontSize="22" Header="XML文档" Width="420" Height="320" HorizontalAlignment="Left" Margin="12"/>
  7. <Button Name="btnTile" Content="更新磁贴" Click="btnTile_Click" Style="{StaticResource StyleToastButton}"/>
  8. </StackPanel>

后台代码的Main函数中,获取TileTemplateType枚举并绑定到ComboBox上。

  1. var itemsTile = Enum.GetNames(typeof(TileTemplateType));
  2. this.comboBoxTile.ItemsSource = itemsTile;

下面的代码和前面的Toast真的非常类似,所以我才把这两节连在一起来写了。Button按钮的Click事件中,和之前一样建一个XML,然后加载到TileNotification类的实例中。最后就是TileUpdateManager类,也就是磁贴更新。

  1. private void btnTile_Click(object sender,RoutedEventArgs e)
  2. {
  3. if (this.textBoxXML.Text == "")
  4. return;
  5. XmlDocument xdoc = new XmlDocument();
  6. xdoc.LoadXml(this.textBoxXML.Text);
  7. TileNotification tileNotifi = new TileNotification(xdoc);
  8. TileUpdateManager.CreateTileUpdaterForApplication().Update(tileNotifi);
  9. }
  10.  
  11. private void comboBoxTile_SelectionChanged(object sender,SelectionChangedEventArgs e)
  12. {
  13. TileTemplateType tileTemplate = (TileTemplateType)Enum.Parse(typeof(TileTemplateType),this.comboBoxTile.SelectedItem as string);
  14. XmlDocument xdoc = TileUpdateManager.GetTemplateContent(tileTemplate);
  15. this.textBoxXML.Text = xdoc.GetXml();
  16. }

当然了,如果你的APP不满足于一个磁贴,你也可以创建第二个磁贴哟!

依旧和Toast通知的XML类似,它也有好多属性的……

Arguments:使用该字符串参数在通过次要磁贴启动应用程序时会传递给Application类的OnLaunched方法,这样一来应用程序就可以根据传入的参数来执行特定的操作。

BackgroundColor:设置磁贴的背景色。

DisplayName和ShortName:设置显示在磁贴上的文本。

logo等:设置磁贴的图标,用Uri。

ForegroundText:磁贴上文本的颜色,可用的选项有深色、浅色等。

TileID:设置磁贴的唯一标识ID,创建新磁贴前用SecondaryTile.Exists判断是否已经存在。

添加第二磁贴的Button的Click事件中:

  1. private async void btnCreateTile(object sender,RoutedEventArgs e)
  2. {
  3. if(SecondaryTile.Exists(textTileID.Text))
  4. {
  5. textBlockMsg.Text="该ID磁贴已经存在";
  6. return ;
  7. }
  8. Uri uriImg=new Uri("ms-appx:///Assests/uriImg.png");
  9. ……
  10. ……
  11. // 创建第二磁贴
  12. SecondaryTile secTile=new SecondaryTile();
  13. this.Tag=secTile;
  14. secTile.DisplayName=textBlockDisplayName.Text;
  15. secTile.TileID=textBlockID.Text;
  16. secTile.Arguments="second"; // 在后面有用到
  17. // 设置图标
  18. secTile.VisualElements.BackgroundColor=Windows.UI.Colors.Gold;
  19. ……
  20. ……
  21. bool r=await secTile.RequestCreateAsync();
  22. textBlockMsg.Text=r == true ?"磁贴创建成功啦.":"磁贴创建失败了哎."; // 返回测试结果

如果希望点击第二磁贴导航到特定的页面,就需要重写该页面的OnNavigatedTo方法

  1. preteced async override void OnNavigatedTo(NavigationEventArgs e)
  2. {
  3. if(e.Parameter is Windows.ApplicationModel.Activation.LaunchActivatedEventArgs)
  4. {
  5. var arg=e.Parameter as Windows.ApplicationModel.Activation.LaunchActivateEventArgs;
  6. ……
  7. }
  8. }
  9.  
  10. if(rootFrame.Content==null)
  11. {
  12. if(e.Arguments=="second")
  13. rootFrame.Navigate(typeof(OtherPage),e);
  14. else
  15. rootFrame.Navigate(typeof(MainPage));
  16. }

这里的参数”second”就是上面设置那个Arguments哦,它的作用就在于这里呢。

猜你在找的XML相关文章