Windows10-development-live-tiles

提供:Dev Guides
移動先:案内検索

Windows 10開発-ライブタイル

この章では、タイルを介したユーザーとの対話について説明します。 Windows 10の象徴的な部分です。 タイルは、*スタート画面*および*スタートメニュー*に表示されます。 つまり、これはアプリケーションアイコンアセットであり、Windows 10オペレーティングシステム全体でさまざまな形式で表示されます。 これらは、ユニバーサルWindowsプラットフォーム(UWP)アプリのコーリングカードです。

タイルの解剖学

タイルには3つの状態があります。

  • 基本状態-スタートタイルの基本コンポーネントは、バックプレート、アイコン、アプリタイトルで構成されます。

基本状態

  • 準ライブ状態-番号であるバッジが0〜99の番号を表示できるという違いのみがありますが、基本タイルと同じです。

準ライブ状態

  • ライブ状態-このタイルには、セミライブ状態のタイルのすべての要素が含まれており、写真、テキストなど、必要なものを置くことができる追加のコンテンツプレートも表示されます。

タイルの更新

タイルを更新するには4つの方法があります。

  • Scheduled - ScheduledTileNotification でテンプレートと時間を設定できます。
  • 定期的-情報がURIから取得され、30分、1時間、6時間など、その期間後に情報をプルする時間を指定できる場合。 etc.
  • ローカル-アプリケーションからローカルのものを更新できます。フォアグラウンドまたはバックグラウンドアプリから。
  • プッシュ-サーバーから情報をプッシュすることにより、サーバーから更新されます。

タイルを作成するには、指定されたコードに従います。

var tileXml =
   TileUpdateManager.GetTemplateContent(TileTemplateType.TileSquare150x150Text01);

var tileAttributes = tileXml.GetElementsByTagName("text");
tileAttributes[0].AppendChild(tileXml.CreateTextNode("Hello"));

var tileNotification = new TileNotification(tileXml);
TileUpdateManager.CreateTileUpdaterForApplication().Update(tileNotification);
  • バッジの更新*は、単なる数字であり、バッジの値を以下に示すように設定できるため、非常に簡単です。
var type = BadgeTemplateType.BadgeNumber;
var xml = BadgeUpdateManager.GetTemplateContent(type);

var elements = xml.GetElementsByTagName("badge");
var element = elements[0] as Windows.Data.Xml.Dom.XmlElement;
element.SetAttribute("value", "7");

var updator = BadgeUpdateManager.CreateBadgeUpdaterForApplication();
var notification = new BadgeNotification(xml);
updator.Update(notification);

Visual Studioで新しいUWPプロジェクトを作成しましょう。

  • Solution ExplorerAssets フォルダーの下にさまざまなpngファイルが表示されます。

資産フォルダー

  • パッケージマニフェストで既定のタイルとその画像を定義しましょう。
  • package.appxmanifest をダブルクリックします。 これにより、マニフェストエディターウィンドウが開きます。
  • [ Visual Assets ]タブを選択します。

ビジュアルアセット

 *指定したサイズのアプリケーションタイルの画像とアイコンを選択できます。* Tile Images and Logos *では、次のようなすべてのロゴにデフォルトの画像が提供されます。
* スクエア71x71ロゴ
* スクエア150×150ロゴ
* スクエア310x310ロゴ
* 店舗ロゴ
* アプリケーションを実行して開始画面に移動すると、アプリケーションのタイルが表示されます。

アプリケーションの実行