クイック スタート: ロック画面上のタイルの更新とバッジの更新の表示 (Windows ランタイム アプリ)
[ この記事は、Windows ランタイム アプリを作成する Windows 8.x および Windows Phone 8.x 開発者を対象としています。Windows 10 向けの開発を行っている場合は、「最新のドキュメント」をご覧ください]
ここでは、アプリでロック画面にバッジ通知とタイル通知を表示できるようにする方法について説明します。 ロック画面に通知を送るための特別な手順はないことに注意してください。ロック画面に表示される通知は、スタート画面に表示される通知と同じです。トースト通知は、特別な設定なしで、ロック画面に表示されます。
必要条件
このトピックを理解するための要件:
- タイルと通知に関する用語と概念についての実用的知識。詳しくは、「タイル、バッジ、通知」をご覧ください。
- タイルの XML スキーマに関する知識。詳しくは、「タイルのスキーマ」をご覧ください。
- Windows ランタイム API を使って JavaScript で基本的な Windows ストア アプリを作成できること。詳しくは、「JavaScript を使った初めての Windows ストア アプリの作成」をご覧ください。
- アプリのマニフェストに定義されている、既にあるアプリの既定のタイル。詳しくは、「クイック スタート: Microsoft Visual Studio マニフェスト エディターを使用した既定のタイルの作成」をご覧ください。
- XML と、ドキュメント オブジェクト モデル (DOM) API を使った XML の操作に関する知識。
手順
1. ロック画面でのアプリの表示の種類を宣言する
ロック画面機能は、アプリの package.appxmanifest ファイルで宣言します。Visual Studio マニフェスト エディターを使う場合は、単に [アプリケーション] タブで該当する [ロック画面通知] オプションを選びます。
次の例は、オプションを選んだことによって package.appxmanifest ファイルに挿入された XML を示しています。マニフェストの VisualElements 要素の子ノードとして、LockScreen 要素が追加されています。
ここで示す XML は、Visual Studio を使わずに、package.appxmanifest ファイルを直接作成する場合に入力する内容でもあります。詳しくは、「パッケージ マニフェストを手動で作成する方法」をご覧ください。
<VisualElements
...
<LockScreen Notification="badge" BadgeLogo="images\logo-lockscreen.png"/>
...
</VisualElements>
<VisualElements
...
<LockScreen Notification="badgeAndTileText" BadgeLogo="images\logo-lockscreen.png"/>
...
</VisualElements>
2. バッジのロゴ イメージを宣言する
次の例は、LockScreen 要素の BadgeLogo 属性の XML 宣言を示しています。この場合も、通常はこの値を手動で設定するのではなく、Visual Studio を使って設定します。画像要件については、「ロック画面に表示するアプリの概要」をご覧ください。
<VisualElements
...
<LockScreen Notification="badge" BadgeLogo="images\logo-lockscreen.png"/>
...
</VisualElements>
3. バックグラウンド タスクを宣言する
ロック画面に表示されるアプリでは、次のいずれかの種類のバックグラウンド タスクを宣言する必要があります。
- コントロール チャネル (Windows のみ)
- タイマー
- プッシュ通知
Visual Studio では、この値はマニフェスト エディターの [宣言] ページで設定します。
- ドロップダウンの一覧の [バックグラウンド タスク] を選びます。
- [追加] をクリックします。
- [プロパティ] の一覧で該当する項目を選び、その項目で必要な情報を追加します。
マニフェストの XML では、この値を BackgroundTasks 要素で宣言します。
バックグラウンド タスクについて詳しくは、バックグラウンド タスクの概要に関するホワイトペーパーをご覧ください。
4. ワイド ロゴを指定する
手順 1. で badgeAndTileText 値を選んだ場合、アプリの既定のタイルの一部として、ワイド ロゴ イメージを指定する必要があります。ユーザーがロック画面にタイルを設定し、タイルに詳しい状態を表示することを選んだ場合は、ワイド タイルが使われます。ロック画面では大サイズと普通サイズのタイルを使わないので、ワイド バインディングなしで送られたタイル通知はロック画面に表示されません。
ワイド ロゴ イメージは、Visual Studio マニフェスト エディターを使って指定することも、次に示すようにマニフェストの XML で指定することもできます。
<VisualElements
...
<DefaultTile ShortName="Tiles JS" ShowName="allLogos" WideLogo="images\tile-sdk.png"/>
...
</VisualElements>
要約と次のステップ
前の手順を完了すると、ユーザーがタイルを表示することを選んだ場合に、指定したタイルがロック画面での表示候補となります。このトピックで説明した手順を実行すると、アプリはロック画面に表示するアプリとして、デバイスの [設定] に表示されます。ロック画面に表示するアプリは最終的にユーザーが選びます。テキストを使って詳しい状態を表示するアプリは 1 つに限られます。