背水一戰 Windows 10 (112) - 通知（Badge）: application 的 badge 通知, secondary 的 badge 通知, 輪詢服務端以更新 badge 通知

時間  2019-11-05
標籤 背水一戰 windows 通知 badge application secondary 輪詢 服務 更新 欄目 Windows 简体版
原文   原文鏈接

[源碼下載]


html

背水一戰 Windows 10 (112) - 通知（Badge）: application 的 badge 通知, secondary 的 badge 通知, 輪詢服務端以更新 badge 通知



做者：webabcd


介紹
背水一戰 Windows 10 之 通知（Badge）html5

  • application 的 badge 通知
  • secondary 的 badge 通知
  • 輪詢服務端以更新 badge 通知



示例
一、本例用於演示 application 的 badge 通知
Notification/Badge/ApplicationBadge.xamlc++

<Page
    x:Class="Windows10.Notification.Badge.ApplicationBadge"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Windows10.Notification.Badge"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="Transparent">
        <StackPanel Margin="10 0 10 10">

            <Button Name="btnUpdateBadgeWidthNumber" Content="以數字的方式更新 Application Badge" Click="btnUpdateBadgeWidthNumber_Click" Margin="5" />

            <StackPanel Orientation="Horizontal" Margin="5">
                <ComboBox Name="cmbBadgeValue">
                    <ComboBoxItem Content="activity" IsSelected="True" />
                    <ComboBoxItem Content="alarm" />
                    <ComboBoxItem Content="alert" />
                    <ComboBoxItem Content="attention" />
                    <ComboBoxItem Content="available" />
                    <ComboBoxItem Content="away" />
                    <ComboBoxItem Content="busy" />
                    <ComboBoxItem Content="error" />
                    <ComboBoxItem Content="newMessage" />
                    <ComboBoxItem Content="paused" />
                    <ComboBoxItem Content="playing" />
                    <ComboBoxItem Content="unavailable" />
                </ComboBox>
                <Button Name="btnUpdateBadgeWidthIcon" Content="以圖標的方式更新 Application Badge" Click="btnUpdateBadgeWidthIcon_Click" Margin="5 0 0 0" />
            </StackPanel>

            <Button Name="btnClearBadge" Content="清除 Application Badge" Click="btnClearBadge_Click" Margin="5" />

        </StackPanel>
    </Grid>
</Page>

Notification/Badge/ApplicationBadge.xaml.csweb

/*
 * 本例用於演示 application 的 badge 通知
 *     application 的 badge 通知會顯示在 application tile 上和 app 的任務欄的圖標上
 * 
 * BadgeNotification - Badge 通知
 *     Content - Badge 的內容，XmlDocument 類型的數據，只讀，其須要在構造函數中指定
 *     ExpirationTime - Badge 通知的過時時間，超過這個時間就會清除這個 Badge（application tile 的 badge 會被清除，而 app 的任務欄的圖標上 的 badge 不會被清除）
 *     
 * BadgeUpdateManager - Badge 更新管理器
 *     CreateBadgeUpdaterForApplication() - 建立一個 Application 的 Badge 更新器，返回 BadgeUpdater 類型的數據
 *     
 * BadgeUpdater - Badge 更新器
 *     Update() - 更新指定的 BadgeNotification
 *     Clear() - 清除 BadgeNotification
 *     
 *     
 * 注：本例是經過 xml 來構造 badge 的，另外也能夠經過 NuGet 的 Microsoft.Toolkit.Uwp.Notifications 來構造 badge（其用 c# 對 xml 作了封裝）
 */

using System;
using Windows.Data.Xml.Dom;
using Windows.UI.Notifications;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

namespace Windows10.Notification.Badge
{
    public sealed partial class ApplicationBadge : Page
    {
        public ApplicationBadge()
        {
            this.InitializeComponent();
        }

        // 以數字的方式更新 Application Badge 通知
        private void btnUpdateBadgeWidthNumber_Click(object sender, RoutedEventArgs e)
        {
            // 用於描述 badge 通知的 xml 字符串（數字在 1 - 99 之間，若是大於 99 則會顯示 99+ ，若是是 0 則會移除 badge，若是小於 0 則無效）
            string badgeXml = "<badge value='6'/>";

            // 將 xml 字符串轉換爲 Windows.Data.Xml.Dom.XmlDocument 對象
            XmlDocument badgeDoc = new XmlDocument();
            badgeDoc.LoadXml(badgeXml);
            // 獲取此 badge 的 xml
            // lblMsg.Text = badgeXml.GetXml();

            // 實例化 BadgeNotification 對象
            BadgeNotification badgeNotification = new BadgeNotification(badgeDoc);
            DateTimeOffset expirationTime = DateTimeOffset.UtcNow.AddSeconds(30);
            badgeNotification.ExpirationTime = expirationTime; // 30 秒後清除這個 badge

            // 將指定的 BadgeNotification 對象更新到 application
            BadgeUpdater badgeUpdater = BadgeUpdateManager.CreateBadgeUpdaterForApplication();
            badgeUpdater.Update(badgeNotification);
        }

        // 以圖標的方式更新 Application Badge 通知
        private void btnUpdateBadgeWidthIcon_Click(object sender, RoutedEventArgs e)
        {
            // 用於描述 badge 通知的 xml 字符串
            string badgeXml = $"<badge value='{((ComboBoxItem)cmbBadgeValue.SelectedItem).Content}'/>";

            // 將 xml 字符串轉換爲 Windows.Data.Xml.Dom.XmlDocument 對象
            XmlDocument badgeDoc = new XmlDocument();
            badgeDoc.LoadXml(badgeXml);
            // 獲取此 badge 的 xml
            // lblMsg.Text = badgeXml.GetXml();

            // 實例化 BadgeNotification 對象
            BadgeNotification badgeNotification = new BadgeNotification(badgeDoc);
            DateTimeOffset expirationTime = DateTimeOffset.UtcNow.AddSeconds(30);
            badgeNotification.ExpirationTime = expirationTime; // 30 秒後清除這個 badge

            // 將指定的 BadgeNotification 對象更新到 application
            BadgeUpdater badgeUpdater = BadgeUpdateManager.CreateBadgeUpdaterForApplication();
            badgeUpdater.Update(badgeNotification);
        }

        // 清除 Application Badge 通知
        private void btnClearBadge_Click(object sender, RoutedEventArgs e)
        {
            BadgeUpdater badgeUpdater = BadgeUpdateManager.CreateBadgeUpdaterForApplication();
            badgeUpdater.Clear();
        }
    }
}


二、本例用於演示 secondary tile 的 badge 通知
Notification/Badge/SecondaryTileBadge.xamlexpress

<Page
    x:Class="Windows10.Notification.Badge.SecondaryTileBadge"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Windows10.Notification.Badge"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="Transparent">
        <StackPanel Margin="10 0 10 10">

            <TextBlock Name="lblMsg" Margin="5" />

            <Button Name="btnUpdateBadgeWidthNumber" Content="以數字的方式更新指定的 Secondary Tile 的 Badge" Click="btnUpdateBadgeWidthNumber_Click" Margin="5" />

            <StackPanel Orientation="Horizontal" Margin="5">
                <ComboBox Name="cmbBadgeValue">
                    <ComboBoxItem Content="activity" IsSelected="True" />
                    <ComboBoxItem Content="alarm" />
                    <ComboBoxItem Content="alert" />
                    <ComboBoxItem Content="attention" />
                    <ComboBoxItem Content="available" />
                    <ComboBoxItem Content="away" />
                    <ComboBoxItem Content="busy" />
                    <ComboBoxItem Content="error" />
                    <ComboBoxItem Content="newMessage" />
                    <ComboBoxItem Content="paused" />
                    <ComboBoxItem Content="playing" />
                    <ComboBoxItem Content="unavailable" />
                </ComboBox>
                <Button Name="btnUpdateBadgeWidthIcon" Content="以圖標的方式更新指定的 Secondary Tile 的 Badge" Click="btnUpdateBadgeWidthIcon_Click" Margin="5 0 0 0" />
            </StackPanel>

            <Button Name="btnClearBadge" Content="清除指定的 Secondary Tile 的 Badge" Click="btnClearBadge_Click" Margin="5" />

        </StackPanel>
    </Grid>
</Page>

Notification/Badge/SecondaryTileBadge.xaml.csc#

/*
 * 本例用於演示 secondary tile 的 badge 通知
 *     secondary tile 的 badge 通知會顯示在 secondary tile 上和 app 的任務欄的圖標上
 * 
 * BadgeNotification - Badge 通知
 *     Content - Badge 的內容，XmlDocument 類型的數據，只讀，其須要在構造函數中指定
 *     ExpirationTime - Badge 通知的過時時間，超過這個時間就會清除這個 Badge
 *     
 * BadgeUpdateManager - Badge 更新管理器
 *     CreateBadgeUpdaterForSecondaryTile(string tileId) - 爲指定的 secondary tile 建立一個 Badge 更新器，返回 BadgeUpdater 類型的數據
 *     
 * BadgeUpdater - Badge 更新器
 *     Update() - 更新指定的 BadgeNotification
 *     Clear() - 清除 BadgeNotification
 *     
 *     
 * 注：本例是經過 xml 來構造 badge 的，另外也能夠經過 NuGet 的 Microsoft.Toolkit.Uwp.Notifications 來構造 badge（其用 c# 對 xml 作了封裝）
 */

using System;
using Windows.Data.Xml.Dom;
using Windows.UI.Notifications;
using Windows.UI.StartScreen;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Navigation;

namespace Windows10.Notification.Badge
{
    public sealed partial class SecondaryTileBadge : Page
    {
        private const string TILEID = "tile_badge";

        public SecondaryTileBadge()
        {
            this.InitializeComponent();
        }

        // 在開始屏幕固定一個 secondary tile 磁貼
        protected async override void OnNavigatedTo(NavigationEventArgs e)
        {
            base.OnNavigatedTo(e);

            Uri square150x150Logo = new Uri("ms-appx:///Assets/Square150x150Logo.png");
            Uri wide310x150Logo = new Uri("ms-appx:///Assets/Wide310x150Logo.png");
            Uri square310x310Logo = new Uri("ms-appx:///Assets/Square310x310Logo.png");
            SecondaryTile secondaryTile = new SecondaryTile(TILEID, "name", "arguments", square150x150Logo, TileSize.Wide310x150);
            secondaryTile.VisualElements.Wide310x150Logo = wide310x150Logo;
            secondaryTile.VisualElements.Square310x310Logo = square310x310Logo;

            try
            {
                bool isPinned = await secondaryTile.RequestCreateAsync();
                lblMsg.Text = isPinned ? "固定成功" : "固定失敗";
            }
            catch (Exception ex)
            {
                lblMsg.Text = "固定失敗: " + ex.ToString();
            }
        }

        // 以數字的方式更新指定的 Secondary Tile 的 Badge 通知
        private void btnUpdateBadgeWidthNumber_Click(object sender, RoutedEventArgs e)
        {
            // 用於描述 badge 通知的 xml 字符串（數字在 1 - 99 之間，若是大於 99 則會顯示 99+ ，若是是 0 則會移除 badge，若是小於 0 則無效）
            string badgeXml = "<badge value='6'/>";

            // 將 xml 字符串轉換爲 Windows.Data.Xml.Dom.XmlDocument 對象
            XmlDocument badgeDoc = new XmlDocument();
            badgeDoc.LoadXml(badgeXml);
            // 獲取此 badge 的 xml
            // lblMsg.Text = badgeXml.GetXml();

            // 實例化 BadgeNotification 對象
            BadgeNotification badgeNotification = new BadgeNotification(badgeDoc);
            DateTimeOffset expirationTime = DateTimeOffset.UtcNow.AddSeconds(30);
            badgeNotification.ExpirationTime = expirationTime; // 30 秒後清除這個 badge

            // 將指定的 BadgeNotification 對象更新到指定的 secondary tile 磁貼
            BadgeUpdater badgeUpdater = BadgeUpdateManager.CreateBadgeUpdaterForSecondaryTile(TILEID);
            badgeUpdater.Update(badgeNotification);
        }

        // 以圖標的方式更新指定的 Secondary Tile 的 Badge 通知
        private void btnUpdateBadgeWidthIcon_Click(object sender, RoutedEventArgs e)
        {
            // 用於描述 badge 通知的 xml 字符串
            string badgeXml = $"<badge value='{((ComboBoxItem)cmbBadgeValue.SelectedItem).Content}'/>";

            // 將 xml 字符串轉換爲 Windows.Data.Xml.Dom.XmlDocument 對象
            XmlDocument badgeDoc = new XmlDocument();
            badgeDoc.LoadXml(badgeXml);
            // 獲取此 badge 的 xml
            // lblMsg.Text = badgeXml.GetXml();

            // 實例化 BadgeNotification 對象
            BadgeNotification badgeNotification = new BadgeNotification(badgeDoc);
            DateTimeOffset expirationTime = DateTimeOffset.UtcNow.AddSeconds(30);
            badgeNotification.ExpirationTime = expirationTime; // 30 秒後清除這個 badge

            // 將指定的 BadgeNotification 對象更新到指定的 secondary tile 磁貼
            BadgeUpdater badgeUpdater = BadgeUpdateManager.CreateBadgeUpdaterForSecondaryTile(TILEID);
            badgeUpdater.Update(badgeNotification);
        }

        // 清除指定的 Secondary Tile 的 Badge 通知
        private void btnClearBadge_Click(object sender, RoutedEventArgs e)
        {
            BadgeUpdater badgeUpdater = BadgeUpdateManager.CreateBadgeUpdaterForSecondaryTile(TILEID);
            badgeUpdater.Clear();
        }
    }
}


三、演示如何輪詢服務端以更新 badge 通知
Notification/Badge/Periodic.xamlwindows

<Page
    x:Class="Windows10.Notification.Badge.Periodic"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Windows10.Notification.Badge"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="Transparent">
        <StackPanel Margin="10 0 10 10">

            <TextBlock Name="lblMsg" Margin="5" />

            <Button Name="btnStartPeriodicUpdate" Content="啓動一個「輪詢服務端以更新 badge 通知」的任務" Click="btnStartPeriodicUpdate_Click" Margin="5" />

        </StackPanel>
    </Grid>
</Page>

Notification/Badge/Periodic.xaml.csapi

/*
 * 演示如何輪詢服務端以更新 badge 通知
 *     
 * BadgeUpdater - Badge 更新器
 *     StartPeriodicUpdate(Uri badgeContent, PeriodicUpdateRecurrence requestedInterval) - 啓動一個「輪詢服務端以更新 badge 通知」的任務
 *     StartPeriodicUpdate(Uri badgeContent, DateTimeOffset startTime, PeriodicUpdateRecurrence requestedInterval) - 啓動一個「輪詢服務端以更新 badge 通知」的任務
 *         badgeContent - Badge 通知的內容（xml 格式數據）的 uri 地址（指定多個則會循環顯示）
 *         startTime - 能夠指定啓動此任務的時間
 *             指定此值時的邏輯爲：首先會馬上請求服務端獲取數據，而後在到達 startTime 指定的時間點後再次獲取數據，最後再每次按 requestedInterval 指定的間隔輪詢服務端
 *         requestedInterval - 輪詢服務端的週期（PeriodicUpdateRecurrence 枚舉）
 *             HalfHour, Hour, SixHours, TwelveHours, Daily
 *     StopPeriodicUpdate() - 中止「輪詢服務端以更新 badge 通知」的任務
 *     
 *     
 * 注：服務端代碼請參見 WebApi/Controllers/BadgeContentController.cs（有指定 X-WNS-Expires 標頭和 X-WNS-Tag 標頭的示例）
 */

using System;
using Windows.UI.Notifications;
using Windows.UI.StartScreen;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Navigation;

namespace Windows10.Notification.Badge
{
    public sealed partial class Periodic : Page
    {
        private const string TILEID = "tile_badge_periodic";

        public Periodic()
        {
            this.InitializeComponent();
        }

        // 在開始屏幕固定一個 secondary tile 磁貼
        protected async override void OnNavigatedTo(NavigationEventArgs e)
        {
            base.OnNavigatedTo(e);

            Uri square150x150Logo = new Uri("ms-appx:///Assets/Square150x150Logo.png");
            Uri wide310x150Logo = new Uri("ms-appx:///Assets/Wide310x150Logo.png");
            Uri square310x310Logo = new Uri("ms-appx:///Assets/Square310x310Logo.png");
            SecondaryTile secondaryTile = new SecondaryTile(TILEID, "name", "arguments", square150x150Logo, TileSize.Wide310x150);
            secondaryTile.VisualElements.Wide310x150Logo = wide310x150Logo;
            secondaryTile.VisualElements.Square310x310Logo = square310x310Logo;

            try
            {
                bool isPinned = await secondaryTile.RequestCreateAsync();
                lblMsg.Text = isPinned ? "固定成功" : "固定失敗";
            }
            catch (Exception ex)
            {
                lblMsg.Text = "固定失敗: " + ex.ToString();
            }
        }

        // 啓動一個「輪詢服務端以更新 badge 通知」的任務
        private void btnStartPeriodicUpdate_Click(object sender, RoutedEventArgs e)
        {
            // 啓動一個循環更新 Badge 通知的任務，並指定 Badge 通知的數據源和輪詢週期
            BadgeUpdater badgeUpdater = BadgeUpdateManager.CreateBadgeUpdaterForSecondaryTile(TILEID);

            // 立刻請求服務端獲取數據，而後 45 分鐘以後再次獲取數據，最後再每半個小時獲取一次數據
            badgeUpdater.StartPeriodicUpdate(new Uri("http://localhost:44914/api/BadgeContent", UriKind.Absolute), DateTimeOffset.UtcNow.AddMinutes(45), PeriodicUpdateRecurrence.HalfHour);

            // Badge 通知的數據源示例請參見 WebApi/Controllers/BadgeContentController.cs
        }
    }
}



OK
[源碼下載]app

相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程