トーストのコンテンツToast content

アダプティブ トースト通知と対話型トースト通知を使うと、テキスト、画像、ボタンと入力を含む柔軟性のある通知を作成できます。Adaptive and interactive toast notifications let you create flexible notifications with text, images, and buttons/inputs.

重要な API:UWP Community Toolkit Notifications NuGet パッケージImportant APIs: UWP Community Toolkit Notifications nuget package

注意

Windows 8.1 および Windows Phone 8.1 から従来のテンプレートを表示するには、次を参照してください。、レガシ トースト テンプレート カタログします。To see the legacy templates from Windows 8.1 and Windows Phone 8.1, see the legacy toast template catalog.

概要Getting started

通知ライブラリをインストールします。Install Notifications library. XML の代わりに C# を使って通知を生成する場合は、Microsoft.Toolkit.Uwp.Notifications という名前の NuGet パッケージをインストールします (「notifications uwp」を検索してください)。If you'd like to use C# instead of XML to generate notifications, install the NuGet package named Microsoft.Toolkit.Uwp.Notifications (search for "notifications uwp"). この記事で示している C# のサンプルでは、NuGet パッケージの Version 1.0.0 を使っています。The C# samples provided in this article use version 1.0.0 of the NuGet package.

通知のビジュアライザーをインストールします。Install Notifications Visualizer. この無料の UWP アプリは、Visual Studio の XAML エディター/デザイン ビューと同様、トーストの編集時に視覚的なプレビューが即座に表示されるため、対話型トースト通知のデザインに便利です。This free UWP app helps you design interactive toast notifications by providing an instant visual preview of your toast as you edit it, similar to Visual Studio's XAML editor/design view. 詳しくは、「Notifications Visualizer」をご覧になるか、Notifications Visualizer を Microsoft Store からダウンロードしてください。See Notifications Visualizer for more information, or download Notifications Visualizer from the Store.

トースト通知の送信Sending a toast notification

通知を送信する方法については、「ローカル トースト通知の送信」をご覧ください。To learn how to send a notification, see Send local toast. このドキュメントでは、トースト コンテンツの作成についてのみ説明します。This documentation only covers creating the toast content.

トースト通知の構造体Toast notification structure

トースト通知は、Tag や Group (通知を識別できます) などのいくつかのデータ プロパティとトースト コンテンツを組み合わせたものです。Toast notifications are a combination of some data properties like Tag/Group (which let you identify the notification) and the toast content.

トースト通知のコンテンツのコア コンポーネントは次のとおりです。The core components of toast content are...

  • 起動:これは、ユーザーが、トーストをディープ リンクを適切なコンテンツ、トーストの表示にできるにそのどのような引数がアプリケーションに渡されるを定義します。launch: This defines what arguments will be passed back to your app when the user clicks your toast, allowing you to deep link into the correct content that the toast was displaying. 詳しくは、「ローカル トースト通知の送信」をご覧ください。To learn more, see Send local toast.
  • visual:ビジュアルのトーストの部分では、バインディング、ジェネリックを含む、テキストとイメージが含まれます。visual: The visual portion of the toast, including the generic binding that contains text and images.
  • アクション:入力とアクションを含め、トーストの対話型の部分。actions: The interactive portion of the toast, including inputs and actions.
  • オーディオ:コントロール、オーディオは、トーストがユーザーに表示されるときに再生されます。audio: Controls the audio played when the toast is shown to the user.

トースト コンテンツは生の XML で定義されますが、トースト コンテンツを作成するために、NuGet ライブラリを使って C# (または C++) オブジェクト モデルを取得することができます。The toast content is defined in raw XML, but you can use our NuGet library to get a C# (or C++) object model for constructing the toast content. この記事では、トースト コンテンツ内に含まれるすべてのものについて説明します。This article documents everything that goes within the toast content.

ToastContent content = new ToastContent()
{
    Launch = "app-defined-string",
 
    Visual = new ToastVisual()
    {
        BindingGeneric = new ToastBindingGeneric() { ... }
    },
 
    Actions = new ToastActionsCustom() { ... },
 
    Audio = new ToastAudio() { ... }
};
<toast launch="app-defined-string">

  <visual>
    <binding template="ToastGeneric">
      ...
    </binding>
  </visual>

  <actions>
    ...
  </actions>

  <audio src="ms-winsoundevent:Notification.Reminder"/>

</toast>

トースト コンテンツの視覚的な表示は、次のようになります。Here is a visual representation of the toast's content:

トースト通知の構造体

VisualVisual

各トーストでは visual を指定し、その中に汎用トースト バインディングを設定する必要があります。この汎用トースト バインディングには、テキストや画像などを含めることができます。Each toast must specify a visual, where you must provide a generic toast binding, which can contain text, images, and more. これらの要素は、デスクトップ、電話、タブレット、Xbox など、さまざまな Windows デバイスでレンダリングされます。These elements will be rendered on various Windows devices, including desktop, phones, tablets, and Xbox.

visual セクションとその子要素でサポートされているすべての属性については、スキーマのドキュメントをご覧ください。For all attributes supported in the visual section and its child elements, see the schema documentation.

トースト通知ではアプリの識別情報は、アプリ アイコンによって表示されます。Your app's identity on the toast notification is conveyed via your app icon. ただし、アプリ ロゴの上書きを使った場合は、テキスト行の下にアプリ名が表示されます。However, if you use the app logo override, we will display your app name beneath your lines of text.

標準のトーストでのアプリの識別情報App identity for normal toast appLogoOverride 使用時のアプリの識別情報App identity with appLogoOverride
notification without appLogoOverride notification with appLogoOverride

テキスト要素Text elements

各トーストには少なくとも 1 つのテキスト要素が必須であり、それ以外に 2 つのテキスト要素 (いずれも AdaptiveText 型) を追加することができます。Each toast must have at least one text element, and can contain two additional text elements, all of type AdaptiveText.

Toast with title and description

Windows 10 Anniversary Update 以降は、そのテキストに対して HintMaxLines プロパティを使うことで、表示されるテキストの行数を制御できます。Since the Windows 10 Anniversary Update, you can control how many lines of text are displayed by using the HintMaxLines property on the text. 既定値 (最大値) は、タイトルのテキストが最大 2 行であり、それに加えて、2 つの説明要素 (2 番目と 3 番目の AdaptiveText) を合計で最大 4 行まで含めることができます。The default (and maximum) is up to 2 lines of text for the title, and up to 4 lines (combined) for the two additional description elements (the second and third AdaptiveText).

new ToastBindingGeneric()
{
    Children =
    {
        new AdaptiveText()
        {
            Text = "Adaptive Tiles Meeting",
            HintMaxLines = 1
        },

        new AdaptiveText()
        {
            Text = "Conf Room 2001 / Building 135"
        },

        new AdaptiveText()
        {
            Text = "10:00 AM - 10:30 AM"
        }
    }
}
<binding template="ToastGeneric">
    <text hint-maxLines="1">Adaptive Tiles Meeting</text>
    <text>Conf Room 2001 / Building 135</text>
    <text>10:00 AM - 10:30 AM</text>
</binding>

アプリ ロゴの上書きApp logo override

既定では、トーストにはアプリ ロゴが表示されます。By default, your toast will display your app's logo. ただし、このロゴは独自の ToastGenericAppLogo 画像で上書きできます。However, you can override this logo with your own ToastGenericAppLogo image. たとえば、これがある人からの通知である場合、その人の写真でアプリ ロゴを上書きすることをお勧めします。For example, if this is a notification from a person, we recommend overriding the app logo with a picture of that person.

Toast with app logo override

HintCrop プロパティを使って、画像のトリミングを変更できます。You can use the HintCrop property to change the cropping of the image. たとえば、Circle を使うと、画像が丸くトリミングされます。For example, Circle results in a circle-cropped image. その他の場合、画像は正方形です。Otherwise, the image is square. 画像サイズは 100% のスケーリングで 48x48 ピクセルです。Image dimensions are 48x48 pixels at 100% scaling.

new ToastBindingGeneric()
{
    ...

    AppLogoOverride = new ToastGenericAppLogo()
    {
        Source = "https://picsum.photos/48?image=883",
        HintCrop = ToastGenericAppLogoCrop.Circle
    }
}
<binding template="ToastGeneric">
    ...
    <image placement="appLogoOverride" hint-crop="circle" src="https://picsum.photos/48?image=883"/>
</binding>

ヒーロー イメージHero image

Anniversary Update で新しい:トースト通知は、おすすめ、ヒーローのイメージを表示できる ToastGenericHeroImage 目立つように表示トースト バナー内およびアクション センターの内部でします。New in Anniversary Update: Toasts can display a hero image, which is a featured ToastGenericHeroImage displayed prominently within the toast banner and while inside Action Center. 画像サイズは 100% のスケーリングで 364x180 ピクセルです。Image dimensions are 364x180 pixels at 100% scaling.

Toast with hero image
new ToastBindingGeneric()
{
    ...

    HeroImage = new ToastGenericHeroImage()
    {
        Source = "https://picsum.photos/364/180?image=1043"
    }
}
<binding template="ToastGeneric">
    ...
    <image placement="hero" src="https://picsum.photos/364/180?image=1043"/>
</binding>

インライン画像Inline image

トーストを展開したときに表示される全幅のインライン画像を指定できます。You can provide a full-width inline-image that appears when you expand the toast.

Toast with additional image
new ToastBindingGeneric()
{
    Children =
    {
        ...

        new AdaptiveImage()
        {
            Source = "https://picsum.photos/360/202?image=1043"
        }
    }
}
<binding template="ToastGeneric">
    ...
    <image src="https://picsum.photos/360/202?image=1043" />
</binding>

画像サイズの制限Image size restrictions

トースト通知で使用する画像は、以下の場所から取得できます。The images you use in your toast notification can be sourced from...

  • http://http://
  • ms-appx:///ms-appx:///
  • ms-appdata:///ms-appdata:///

http および https のリモート Web 画像では、各画像のファイル サイズに制限があります。For http and https remote web images, there are limits on the file size of each individual image. Fall Creators Update (16299) では、この制限が通常の接続で 3 MB、従量制課金接続で 1 MB に拡大しました。In the Fall Creators Update (16299), we increased the limit to be 3 MB on normal connections and 1 MB on metered connections. それより前のバージョンでは、いずれの場合も画像サイズの上限は 200 KB です。Before that, images were always limited to 200 KB.

通常の接続Normal connection 従量制課金接続Metered connection Fall Creators Update より前のバージョンBefore Fall Creators Update
3 MB3 MB 1 MB1 MB 200 KB200 KB

画像がこのファイル サイズを超えている場合、画像がダウンロードできない場合、またはタイム アウトした場合は、画像が表示されず、通知の残りの部分のみが表示されます。If an image exceeds the file size, or fails to download, or times out, the image will be dropped and the rest of the notification will be displayed.

属性テキストAttribution text

Anniversary Update で新しい:コンテンツのソースを参照する必要がある場合は、属性のテキストを使用できます。New in Anniversary Update: If you need to reference the source of your content, you can use attribution text. このテキストは常に、アプリの ID または通知のタイムスタンプと共に通知の下部に表示されます。This text is always displayed at the bottom of your notification, along with your app's identity or the notification's timestamp.

属性テキストをサポートしていない以前のバージョンの Windows では、テキストは単に別のテキスト要素として表示されます (3 つのテキスト要素を最大限に含めていない場合)。On older versions of Windows that don't support attribution text, the text will simply be displayed as another text element (assuming you don't already have the maximum of three text elements).

Toast with attribution text
new ToastBindingGeneric()
{
    ...

    Attribution = new ToastGenericAttributionText()
    {
        Text = "Via SMS"
    }
}
<binding template="ToastGeneric">
    ...
    <text placement="attribution">Via SMS</text>
</binding>

カスタム タイムスタンプCustom timestamp

Creators Update で新しい:今すぐ、メッセージ、情報、コンテンツが生成されたときを正確に表すタイムスタンプが、独自のシステム指定のタイムスタンプをオーバーライドできます。New in Creators Update: You can now override the system-provided timestamp with your own timestamp that accurately represents when the message/information/content was generated. このタイムスタンプはアクション センターに表示されます。This timestamp is visible within Action Center.

Toast with custom timestamp

カスタム タイムスタンプの使用について詳しくは、「トーストに表示されるカスタム タイムスタンプ」をご覧ください。To learn more about using a custom timestamp, please see custom timestamps on toasts.

ToastContent toastContent = new ToastContent()
{
    DisplayTimestamp = new DateTime(2017, 04, 15, 19, 45, 00, DateTimeKind.Utc),
    ...
};
<toast displayTimestamp="2017-04-15T19:45:00Z">
  ...
</toast>

進行状況バーProgress bar

Creators Update で新しい:ユーザーへのダウンロードなどの操作の進行状況の通知を保持する、トースト通知の進行状況バーを行うことができます。New in Creators Update: You can provide a progress bar on your toast notification to keep the user informed of the progress of operations, like downloads and more.

Toast with progress bar

進行状況バーの使用について詳しくは、「トーストの進行状況バー」をご覧ください。To learn more about using a progress bar, please see Toast progress bar.

ヘッダーHeaders

Creators Update で新しい:アクション センター内でヘッダーの下の通知をグループ化することができます。New in Creators Update: You can group notifications under headers within Action Center. たとえば、グループ チャットのグループ メッセージをヘッダーの下でグループ化したり、共通のテーマのグループ通知をヘッダーの下でグループ化したりすることができます。For example, you can group messages from a group chat under a header, or group notifications of a common theme under a header, or more.

Toasts with header

ヘッダーの使用について詳しくは、「トーストのヘッダー」をご覧ください。To learn more about using headers, please see Toast headers.

アダプティブ コンテンツAdaptive content

Anniversary Update で新しい:上記で指定したコンテンツだけでなく、トーストが展開されている場合に表示されているその他のアダプティブ コンテンツを表示することもします。New in Anniversary Update: In addition to the content specified above, you can also display additional adaptive content that is visible when the toast is expanded.

この追加コンテンツは Adaptive を使って指定されます。詳しくは、アダプティブ タイルのドキュメントをご覧ください。This additional content is specified using Adaptive, which you can learn more about by reading the Adaptive Tiles documentation.

すべてのアダプティブ コンテンツは AdaptiveGroup 内に含める必要があることに注意してください。Note that any adaptive content must be contained within an AdaptiveGroup. それ以外の場合、Adaptive を使ってレンダリングされません。Otherwise it will not be rendered using adaptive.

列とテキスト要素Columns and text elements

列といくつかの詳細なアダプティブ テキスト要素が使われている例を次に示します。Here's an example where columns and some advanced adaptive text elements are used. テキスト要素は AdaptiveGroup 内にあるため、すべてのリッチ アダプティブ スタイル指定プロパティをサポートします。Since the text elements are within an AdaptiveGroup, they support all the rich adaptive styling properties.

Toast with additional text
new ToastBindingGeneric()
{
    Children =
    {
        ...

        new AdaptiveGroup()
        {
            Children =
            {
                new AdaptiveSubgroup()
                {
                    Children =
                    {
                        new AdaptiveText()
                        {
                            Text = "52 attendees",
                            HintStyle = AdaptiveTextStyle.Base
                        },
                        new AdaptiveText()
                        {
                            Text = "23 minute drive",
                            HintStyle = AdaptiveTextStyle.CaptionSubtle
                        }
                    }
                },
                new AdaptiveSubgroup()
                {
                    Children =
                    {
                        new AdaptiveText()
                        {
                            Text = "1 Microsoft Way",
                            HintStyle = AdaptiveTextStyle.CaptionSubtle,
                            HintAlign = AdaptiveTextAlign.Right
                        },
                        new AdaptiveText()
                        {
                            Text = "Bellevue, WA 98008",
                            HintStyle = AdaptiveTextStyle.CaptionSubtle,
                            HintAlign = AdaptiveTextAlign.Right
                        }
                    }
                }
            }
        }
    }
}
<binding template="ToastGeneric">
    ...
    <group>
        <subgroup>
            <text hint-style="base">52 attendees</text>
            <text hint-style="captionSubtle">23 minute drive</text>
        </subgroup>
        <subgroup>
            <text hint-style="captionSubtle" hint-align="right">1 Microsoft Way</text>
            <text hint-style="captionSubtle" hint-align="right">Bellevue, WA 98008</text>
        </subgroup>
    </group>
</binding>

ボタンButtons

ボタンを使うとトーストを対話的にすることができ、ユーザーはトースト通知に対してクイック アクションを実行できます。その際、現在のワークフローは中断されません。Buttons make your toast interactive, letting the user take quick actions on your toast notification without interrupting their current workflow. たとえば、ユーザーはトースト内からメッセージに直接返信したり、メール アプリを開かずにメールを削除したりすることができます。For example, users can reply to a message directly from within a toast, or delete an email without even opening the email app. ボタンは、通知の展開した部分に表示されます。Buttons appear in the expanded portion of your notification.

ボタンのエンドツーエンドの実装について詳しくは、「ローカル トースト通知の送信」をご覧ください。To learn more about implementing buttons end-to-end, see Send local toast.

Buttons は次のようなさまざまな操作を実行できます。Buttons can perform the following different actions...

  • 特定のページやコンテキストへの移動に使うことができる引数を指定して、アプリをフォアグラウンドでアクティブ化します。Activating the app in the foreground, with an argument that can be used to navigate to a specific page/context.
  • クイック返信や同様のシナリオで、アプリのバックグラウンド タスクをアクティブ化します。Activating the app's background task, for a quick-reply or similar scenario.
  • プロトコル起動を利用して別のアプリをアクティブ化します。Activating another app via protocol launch.
  • 再通知や通知を閉じるなどのシステム操作を実行します。Performing a system action, like snoozing or dismissing the notification.

注意

設定できるボタン (後述のコンキスト メニュー項目を含む) の数は最大 5 つです。You can only have up to 5 buttons (including context menu items which we discuss later).

notification with actions, example 1
ToastContent content = new ToastContent()
{
    ...
 
    Actions = new ToastActionsCustom()
    {
        Buttons =
        {
            new ToastButton("See more details", "action=viewdetails&contentId=351")
            {
                ActivationType = ToastActivationType.Foreground
            },

            new ToastButton("Remind me later", "action=remindlater&contentId=351")
            {
                ActivationType = ToastActivationType.Background
            }
        }
    }
};
<toast launch="app-defined-string">

    ...

    <actions>

        <action
            content="See more details"
            arguments="action=viewdetails&amp;contentId=351"
            activationType="foreground"/>

        <action
            content="Remind me later"
            arguments="action=remindlater&amp;contentId=351"
            activationType="background"/>

    </actions>

</toast>

アイコンの付いたボタンButtons with icons

ボタンにはアイコンを追加することができます。You can add icons to your buttons. これらのアイコンは、100% のスケーリングで 16 x 16 ピクセルの白い透明な画像であり、画像自体にパディングを含めることはできません。These icons are white transparent 16x16 pixel images at 100% scaling, and should have no padding included in the image itself. トースト通知にアイコンを表示する場合、ボタンのスタイルがアイコン ボタンに変更されるため、通知内のすべてのボタンに対してアイコンを表示する必要があります。If you choose to provide icons on a toast notification, you must provide icons for ALL of your buttons in the notification, as it transforms the style of your buttons into icon buttons.

注意

アクセシビリティを確保するため、ユーザーが "ハイ コントラスト 白" モードをオンにしてもアイコンが見えるように、必ずコントラスト (白) バージョンのアイコン (白い背景に黒いアイコン) を指定します。For accessibility, be sure to include a contrast-white version of the icon (a black icon for white backgrounds), so that when the user turns on High Contrast White mode, your icon is visible. 詳しくは、トーストのアクセシビリティに関するページをご覧ください。Learn more on the toast accessiblity page.

Toast that has buttons with icons
new ToastButton("Dismiss", "dismiss")
{
    ActivationType = ToastActivationType.Background,
    ImageUri = "Assets/ToastButtonIcons/Dismiss.png"
}
<action
    content="Dismiss"
    imageUri="Assets/ToastButtonIcons/Dismiss.png"
    arguments="dismiss"
    activationType="background"/>

更新の保留アクティブ化機能を備えたボタンButtons with pending update activation

Fall Creators Update:後のライセンス認証を使用するバック グラウンドのアクティブ化ボタン、動作のPendingUpdateトースト通知で複数のステップの相互作用を作成します。New in Fall Creators Update: On background activation buttons, you can use an after activation behavior of PendingUpdate to create multi-step interactions in your toast notifications. ユーザーがボタンをクリックすると、バックグラウンド タスクがアクティブ化し、トーストが "更新の保留中" 状態になります。トーストは、バックグラウンド タスクによって新しいトーストに置き換えられるまで、表示されたままになります。When the user clicks your button, your background task is activated, and the toast gets placed in a "pending update" state, where it stays on screen till your background task replaces the toast with a new toast.

この機能を実装する方法については、トーストの更新の保留に関するページをご覧ください。To learn how to implement this, see Toast pending update.

更新の保留を使ったトースト

コンテキスト メニューのアクションContext menu actions

Anniversary Update で新しい:ユーザーがアクション センター内からトースト右クリックしたときに表示される既存のコンテキスト メニューには、追加のコンテキスト メニューのアクションを追加できます。New in Anniversary Update: You can add additional context menu actions to the existing context menu that appears when the user right clicks your toast from within Action Center. このメニューは、アクション センターで右クリックした場合にのみ表示されることに注意してください。Note that this menu only appears when right clicked from Action Center. トーストのポップアップ バナーを右クリックしても表示されません。It does not appear when right clicking a toast popup banner.

注意

従来のデバイスでは、これらの追加のコンテキスト メニュー アクションが、単に通常のボタンとしてトースト上に表示されます。On older devices, these additional context menu actions will simply appear as normal buttons on your toast.

追加した別のコンテキスト メニュー アクション ("場所の変更" など) は、2 つの既定のシステム エントリの上に表示されます。The additional context menu actions you add (like "Change location") appear above the two default system entries.

Toast with context menu
ToastContent content = new ToastContent()
{
    ...
 
    Actions = new ToastActionsCustom()
    {
        ContextMenuItems =
        {
            new ToastContextMenuItem("Change location", "action=changeLocation")
        }
    }
};
<toast>

    ...

    <actions>

        <action
            placement="contextMenu"
            content="Change location"
            arguments="action=changeLocation"/>

    </actions>

</toast>

注意

追加のコンテキスト メニュー項目は、トーストの合計ボタン数の上限である 5 つのボタンに含まれます。Additional context menu items contribute to the total limit of 5 buttons on a toast.

追加のコンテキスト メニュー項目のアクティブ化は、トーストのボタンと同じ手順で処理されます。Activation of additional context menu items is handled identical to toast buttons.

入力Inputs

入力はトーストのトースト領域の Actions 領域内で指定します。つまり、これらはトーストが展開されたときにのみ表示されます。Inputs are specified within the Actions region of the toast region of the toast, meaning they are only visible when the toast is expanded.

クイック返信テキスト ボックスQuick reply text box

クイック返信テキスト ボックスを有効にするには、メッセージング シナリオの場合と同様、テキスト入力とボタンを追加し、テキスト入力の ID を参照してボタンが入力の横に表示されるようにします。To enable a quick reply text box, like for a messaging scenario, add a text input and a button, and reference the text input's id so that the button is displayed adjacent to the input.

notification with text input and actions
ToastContent content = new ToastContent()
{
    ...
 
    Actions = new ToastActionsCustom()
    {
        Inputs =
        {
            new ToastTextBox("tbReply")
            {
                PlaceholderContent = "Type a reply"
            }
        },

        Buttons =
        {
            new ToastButton("Reply", "action=reply&convId=9318")
            {
                ActivationType = ToastActivationType.Background,

                // To place the button next to the text box,
                // reference the text box's Id and provide an image
                TextBoxId = "tbReply",
                ImageUri = "Assets/Reply.png"
            }
        }
    }
};
<toast launch="app-defined-string">

    ...

    <actions>

        <input id="textBox" type="text" placeHolderContent="Type a reply"/>

        <action
            content="Send"
            arguments="action=reply&amp;convId=9318"
            activationType="background"
            hint-inputId="textBox"
            imageUri="Assets/Reply.png"/>

    </actions>

</toast>

入力とボタン バーInputs with buttons bar

1 つ (または複数) の入力と、その入力の下に通常のボタンが表示されるように設定することもできます。You also can have one (or many) inputs with normal buttons displayed below the inputs.

notification with text and input actions
ToastContent content = new ToastContent()
{
    ...
 
    Actions = new ToastActionsCustom()
    {
        Inputs =
        {
            new ToastTextBox("tbReply")
            {
                PlaceholderContent = "Type a reply"
            }
        },

        Buttons =
        {
            new ToastButton("Reply", "action=reply&threadId=9218")
            {
                ActivationType = ToastActivationType.Background
            },

            new ToastButton("Video call", "action=videocall&threadId=9218")
            {
                ActivationType = ToastActivationType.Foreground
            }
        }
    }
};
<toast launch="app-defined-string">

    ...

    <actions>

        <input id="textBox" type="text" placeHolderContent="Type a reply"/>

        <action
            content="Reply"
            arguments="action=reply&amp;threadId=9218"
            activationType="background"/>

        <action
            content="Video call"
            arguments="action=videocall&amp;threadId=9218"
            activationType="foreground"/>

    </actions>

</toast>

選択入力Selection input

テキスト ボックスに加えて、選択メニューを使うこともできます。In addition to text boxes, you can also use a selection menu.

notification with selection input and actions
ToastContent content = new ToastContent()
{
    ...
 
    Actions = new ToastActionsCustom()
    {
        Inputs =
        {
            new ToastSelectionBox("time")
            {
                DefaultSelectionBoxItemId = "lunch",
                Items =
                {
                    new ToastSelectionBoxItem("breakfast", "Breakfast"),
                    new ToastSelectionBoxItem("lunch", "Lunch"),
                    new ToastSelectionBoxItem("dinner", "Dinner")
                }
            }
        },

        Buttons = { ... }
};
<toast launch="app-defined-string">

    ...

    <actions>

        <input id="time" type="selection" defaultInput="lunch">
            <selection id="breakfast" content="Breakfast" />
            <selection id="lunch" content="Lunch" />
            <selection id="dinner" content="Dinner" />
        </input>

        ...

    </actions>

</toast>

[一時停止する] と [無視]Snooze/dismiss

選択メニューと 2 つのボタンを使って、システムの再通知操作と無視操作を利用するリマインダー通知を作成できます。Using a selection menu and two buttons, we can create a reminder notification that utilizes the system snooze and dismiss actions. 通知をリマインダーのように動作するように、必ずシナリオに Reminder を設定します。Make sure to set the scenario to Reminder for the notification to behave like a reminder.

reminder notification

ここでは、トースト ボタンで SelectionBoxId プロパティを使って、[一時停止] ボタンを選択メニューの入力に関連付けています。We link the Snooze button to the selection menu input using the SelectionBoxId property on the toast button.

ToastContent content = new ToastContent()
{
    Scenario = ToastScenario.Reminder,

    ...
 
    Actions = new ToastActionsCustom()
    {
        Inputs =
        {
            new ToastSelectionBox("snoozeTime")
            {
                DefaultSelectionBoxItemId = "15",
                Items =
                {
                    new ToastSelectionBoxItem("5", "5 minutes"),
                    new ToastSelectionBoxItem("15", "15 minutes"),
                    new ToastSelectionBoxItem("60", "1 hour"),
                    new ToastSelectionBoxItem("240", "4 hours"),
                    new ToastSelectionBoxItem("1440", "1 day")
                }
            }
        },

        Buttons =
        {
            new ToastButtonSnooze()
            {
                SelectionBoxId = "snoozeTime"
            },
 
            new ToastButtonDismiss()
        }
    }
};
<toast scenario="reminder" launch="action=viewEvent&amp;eventId=1983">
   
  ...
 
  <actions>
     
    <input id="snoozeTime" type="selection" defaultInput="15">
      <selection id="1" content="1 minute"/>
      <selection id="15" content="15 minutes"/>
      <selection id="60" content="1 hour"/>
      <selection id="240" content="4 hours"/>
      <selection id="1440" content="1 day"/>
    </input>
 
    <action activationType="system" arguments="snooze" hint-inputId="snoozeTime" content="" />
 
    <action activationType="system" arguments="dismiss" content=""/>
     
  </actions>
   
</toast>

システムの再通知操作と無視操作を使うには、次の手順を実行します。To use the system snooze and dismiss actions:

  • ToastButtonSnooze または ToastButtonDismiss を指定するSpecify a ToastButtonSnooze or ToastButtonDismiss
  • 必要に応じてカスタムのコンテンツ文字列を指定するOptionally specify a custom content string:
    • 文字列を指定しない場合、"Snooze" と "Dismiss" のローカライズされた文字列が自動的に使われます。If you don't provide a string, we'll automatically use localized strings for "Snooze" and "Dismiss".
  • 必要に応じて SelectionBoxId を指定するOptionally specify the SelectionBoxId:
    • 再通知の間隔をユーザーが選ぶのではなく、システム定義の時間間隔 (OS 全体で一貫しています) に応じて 1 回だけ再通知を行う場合は、<input> を指定しないでください。If you don't want the user to select a snooze interval and instead just want your notification to snooze only once for a system-defined time interval (that is consistent across the OS), then don't construct any <input> at all.
    • 再通知の間隔に関する選択項目を指定する場合:If you want to provide snooze interval selections:
      • 再通知操作に SelectionBoxId を指定するSpecify SelectionBoxId in the snooze action
      • input の id に、再通知操作の SelectionBoxId と同じ値を指定するMatch the id of the input with the SelectionBoxId of the snooze action
      • ToastSelectionBoxItem の値を、再通知の間隔を分単位で表す nonNegativeInteger になるよう指定するSpecify ToastSelectionBoxItem's value to be a nonNegativeInteger which represents snooze interval in minutes.

オーディオAudio

カスタム オーディオは、Mobile では常にサポートされ、Desktop では Version 1511 (ビルド 10586) 以降でサポートされます。Custom audio has always been supported by Mobile, and is supported in Desktop Version 1511 (build 10586) or newer. カスタム オーディオは次のパスで参照できます。Custom audio can be referenced via the following paths:

  • ms-appx:///ms-appx:///
  • ms-appdata:///ms-appdata:///

または、ms-winsoundevent の一覧に関するページから選ぶこともできます。これらは、常に両方のプラットフォームでサポートされます。Alternatively, you can pick from the list of ms-winsoundevents, which have always been supported on both platforms.

ToastContent content = new ToastContent()
{
    ...

    Audio = new ToastAudio()
    {
        Src = new Uri("ms-appx:///Assets/NewMessage.mp3")
    }
}
<toast launch="app-defined-string">

    ...

    <audio src="ms-appx:///Assets/NewMessage.mp3"/>

</toast>

トースト通知でのオーディオについては、オーディオ スキーマに関するページをご覧ください。See the audio schema page for information on audio in toast notifications. カスタム オーディオを使うトーストの送信方法については、トーストでのカスタム オーディオの使用をご覧ください。To learn how to send a toast using custom audio, see custom audio on toasts.

アラーム、リマインダー、着信呼び出しAlarms, reminders, and incoming calls

アラーム、リマインダー、着信呼び出しの通知を作成するには、単にシナリオの値が割り当てられた標準のトースト通知を使います。To create alarms, reminders, and incoming call notifications, you simply use a normal toast notification with a scenario value assigned to it. シナリオはいくつかの動作を調整して、一貫性のある統一されたユーザー エクスペリエンスをもたらします。The scenario adusts a few behaviors to create a consistent and unified user experience.

重要

リマインダーやアラームを使用する場合、トースト通知に少なくとも 1 つのボタンを含める必要があります。When using Reminder or Alarm, you must provide at least one button on your toast notification. そうでない場合、トーストは、標準のトーストとして扱われます。Otherwise, the toast will be treated as a normal toast.

  • アラーム:ユーザーが閉じるか、アクションを実行するまで画面に通知が残ります。Reminder: The notification will stay on screen until the user dismisses it or takes action. Windows Mobile では、トーストは既に展開された状態で表示されます。On Windows Mobile, the toast will also show pre-expanded. リマインダー音が再生されます。A reminder sound will be played.
  • アラーム:リマインダーの動作だけでなくアラームはさらに既定のアラーム音でオーディオをループします。Alarm: In addition to the reminder behaviors, alarms will additionally loop audio with a default alarm sound.
  • IncomingCall:着信呼び出し通知は、Windows Mobile デバイスでは全画面で表示されます。IncomingCall: Incoming call notifications are displayed full screen on Windows Mobile devices. その他の点では、着信音オーディオを使うことと、ボタンのスタイルが異なることを除き、アラームと同じ動作が実行されます。Otherwise, they have the same behaviors as alarms except they use ringtone audio and their buttons are styled differently.
ToastContent content = new ToastContent()
{
    Scenario = ToastScenario.Reminder,

    ...
}
<toast scenario="reminder" launch="app-defined-string">

    ...

</toast>

ローカライズとアクセシビリティLocalization and accessibility

タイルやトーストには、表示言語や、表示倍率、ハイ コントラストなど、実行時のコンテキストに合わせた文字列や画像を読み込むことができます。Your tiles and toasts can load strings and images tailored for display language, display scale factor, high contrast, and other runtime contexts. 詳しくは、「言語、スケール、ハイ コントラストに合わせたタイルとトースト通知のサポート」をご覧ください。For more info, see Tile and toast notification support for language, scale, and high contrast.

アクティブ化の処理Handling activation

トーストのアクティブ化を処理する方法 (ユーザーがトーストをクリックするか、トースト上のボタンをクリックする) については、「ローカル トースト通知の送信」をご覧ください。To learn how to handle toast activations (the user clicking your toast or buttons on the toast), see Send local toast.