システムに通知を送るアプリを作ろう―UWP第5回

2017.06.14

Windows 10 アプリ開発入門 ― Universal Windows Platformではじめよう

システムに通知を送るアプリを作ろう―UWP第5回

ここまで、アプリケーションがネットワークを通して取得した最新情報をユーザーインターフェースに表示してきました。今度はUniversal Windows Platform(UWP)で、アプリが起動していなくても通知を配信する仕組みを解説しましょう。

システムに通知を送るアプリを作ろう

前回までで、アプリケーションがネットワークを通して最新情報を取得し、ユーザーインターフェースにコンテンツを表示する方法を学びました。

しかしユーザーはいつでもアプリを起動してくれるとは限りません。デバイスのリソースは限られているので、できる限り必要のないアプリは終了させ、必要な時に的確に起動しなければいけません。そのためにUniversal Windows Platform(UWP)ではアプリが起動していない時でも通知を配信する仕組みを用意しています。

UWPで扱える通知の方法としてトースト通知とライブタイル通知、バッジ通知の3つがあります。

トースト通知は一時的にユーザーに通知したい場合に用いられ、通知はアプリが起動していてもしていなくても画面の右下に表示され、一時的にPCの画面領域を占有することとなるため、アラームなどユーザーにすぐに気づいてほしい通知を送るときに便利です。

一方、ライブタイル通知は画面を占有することはせず、ユーザーがスタートメニューを開いたときにアプリのアイコン(タイル)に情報が表示される情報掲示板のような機能です。ライブタイル通知はスタートメニューが表示されるたびに表示されるため、長くユーザーに伝えたい情報を表示するときに便利です。

バッジ通知は、ユーザーに数字を通知するときに便利です。例えばメールの未読数を通知するときなど、数字の大きさに通知の意味があるときに使用します。

特にWindows 10 PCやWindows 10 Mobileでは、ライブタイルはほかのスマートデバイスにない特徴的な機能であり、スタートメニューを多く使うWindows10の利用者にとってはアプリが情報を通知する非常に良い手段となっています。

今回はそのようなUWPの通知システムを利用するアプリを作ってみましょう。

1. アプリを新規作成しよう

今回もUniversal Windows Plaftform(UWP)のアプリを新規作成してみましょう。アプリプロジェクトの新規作成に関しては第1回の記事を参考にしてください。

UWPアプリのプロジェクトを新規作成できたらMain.xamlを編集してユーザーインターフェースを記述しましょう。今回は3つのボタンを配置しましょう。各コントロールのプロパティは以下のようにします。

●Toast通知を送信するButtonコントロールのプロパティ

プロパティ名	値
Name	buttonToast
Content	Toast送信

●タイル通知を送信するButtonコントロールのプロパティ

プロパティ名	値
Name	buttonTile
Content	タイル送信

●バッジ通知を送信するButtonコントロールのプロパティ

プロパティ名	値
Name	buttonBadge
Content	バッジ送信

続いてMainPage.xamlのデザイナーに表示されている、Nameプロパティが buttonToast のボタンをダブルクリックしてMainPage.xaml.csにClickイベントハンドラを生成しましょう。

同様に、Nameプロパティが buttonTitle のボタンと buttonBadge のボタンもダブルクリックし、イベントハンドラを生成します。

XAMLコントロールのプロパティ編集やイベントハンドラ生成については第2回の記事を参考にしてください。

2. 必要なライブラリをインストールしよう

今回もNugetパッケージマネージャーを利用してライブラリをインストールします。

今回インストールするライブラリは、VisualStudioのメニューバーから[ツール]>[Nugetパッケージマネージャー]>[ソリューションのNugetパッケージの管理]をクリックします。

[参照]タブをクリックし、検索ボックスに Microsoft.Toolkit.Uwp.Notifications と入力します。

検索結果に出てくる、Microsoft.Toolkit.Uwp.Notificationsのパッケージを選択し、右側のにある自分のソリューション名を選択し、[インストール]をクリックします。

3. Toast通知を送信してみよう

ではToast通知を送信するコードを書いてみましょう。まず、必要な名前空間をusingします。以下のコードをMainPage.xaml.csのusingの部分に追記します。

using Windows.UI.Notifications;

using Microsoft.Toolkit.Uwp.Notifications;

以下のコードをToast送信ボタンのイベントハンドラであるbuttonToast_Clickの中に記述します。

//通知の中身を作成
var content = new ToastContent
{
    Visual = new ToastVisual
    {
        BindingGeneric = new ToastBindingGeneric
        {
            Children = {
                new AdaptiveText
                {
                    Text = "通知"
                },
                new AdaptiveText
                {
                    Text = "これは通知です"
                }
            }
        }
    }
};
//通知を作成
var notification = new ToastNotification(content.GetXml());
//通知を送信
ToastNotificationManager.CreateToastNotifier().Show(notification);

UWPでToast通知を送信する場合、通常はXMLに通知の中身を記述しなければいけないのですが、ライブラリとしてインストールしたMicrosoft.Toolkit.Uwp.NotificationsライブラリによってC#から通知のXMLを記述することができます(new ToastContentの部分)。また、ToastNotificationManagerクラスを利用することによってシステムにToast通知を送信することができます。

では[F5]キーを押してデバッグを開始してみましょう。

アプリが立ち上がったら[Toast送信]ボタンを押してみましょう。右下にToast通知が表示されたら成功です。

動作を確認できたら、[Shift]+[F5]キーなどでデバッグを停止しましょう。

4. ライブタイル通知を送信してみよう

続いてライブタイルの通知を送信してみましょう。

以下のコードをタイル送信ボタンのイベントハンドラであるbuttonTile_Clickの中に記載します。

//通知の中身を作成
var content = new TileContent
{
    Visual = new TileVisual
    {
        TileMedium = new TileBinding
        {
            Content = new TileBindingContentAdaptive
            {
                Children =
                {
                    new AdaptiveText
                    {
                        Text = "通知"
                    },
                    new AdaptiveText
                    {
                        Text = "これは通知です"
                    }
                }
 
            }
        }
    }
};
//通知を作成
var notification = new TileNotification(content.GetXml());
//通知を送信
TileUpdateManager.CreateTileUpdaterForApplication().Update(notification);

書けたら再び、[F5]キーを押して実行してみましょう。アプリが立ち上がったら[タイル送信]ボタンを押しましょう。その後、Windowsのスタートメニューを表示し、実行しているアプリをスタートメニューにピン止めしてみましょう。

ライブタイルに指定した文字が表示されれば成功です。

動作を確認できたら、[Shift]+[F5]キーなどでデバッグを停止しましょう。

5. バッジ通知を送信してみよう

続いてバッジ通知を送信してみましょう。

以下のコードをバッジ送信ボタンのClickイベントハンドラであるbuttonBadge_Clickの中に書きましょう。バッジ通知を使うにはBadgeNumericContetクラスを使用します。Numericプロパティに表示したい数字を指定しましょう。

//通知の中身を作成
var content = new BadgeNumericContent
{
    Number = 10
};
 
//通知を作成
var notification = new BadgeNotification(content.GetXml());
//通知を送信
BadgeUpdateManager.CreateBadgeUpdaterForApplication().Update(notification);

書けたら再び、[F5]キーを押して実行してみましょう。

アプリが立ち上がったら[バッジ送信]ボタンを押しましょう。

再びWindowsのスタートメニューのアプリのタイルを見てみると、バッジの数字が表示されていることが確認できます。

今回はシステム通知を利用するUWPアプリを作成しました。

UWPはライブタイルという独特の通知システムを持っており、それらを活用することによってWindows10の機能を生かしたより良いアプリを作成できます。また、通知を適切なタイミングで発行することによって、ユーザーにより長く使ってもらえるアプリを作ることができます。

皆さんもWindows10独特の通知システムを生かしたUWPアプリを作ってみてください。

著者プロフィール

栂井良太（著者）: Microsoft MVP for Windows Development、Microsoft Student Partners
Windowsのデスクトップソフトを趣味で作成しているうちにWindowsに関連した技術に関心を持ち、Windows Phone 7、Windows 10などのアプリに関連した情報をブログ、オフラインコミュニティにて発信、現在はUniversal Windows App、Azureなどを普及すべく情報発信中。
Webサイト：http://garicchi.com