クイック スタート: メッセージ ダイアログの設計 (HTML)

[ この記事は、Windows ランタイム アプリを作成する Windows 8.x および Windows Phone 8.x 開発者を対象としています。Windows 10 向けの開発を行っている場合は、「最新のドキュメント」をご覧ください]

このクイック スタートでは、メッセージ ダイアログの設計と実装に関するガイドラインを示します。 「メッセージ ダイアログの追加」で説明したように、メッセージ ダイアログはアプリのキャンバス全体に表示され、ダイアログの内容に応じて水平方向にサイズが変更されます。ダイアログには、タイトル、メッセージ、最大 3 つのボタンを追加できます。

必要条件

• メッセージ ダイアログの追加
• メッセージ ダイアログのガイドラインとチェック リスト

手順

サンプル コードは、インターネット接続が見つからないことをユーザーに通知して、応答を求めるメッセージ ダイアログです。このクイック スタートに示すコードの大部分は、メッセージ ダイアログのサンプル ページにあります。

1. ダイアログ コンテンツを作成します。

        // Create the message dialog and set its content
        var msg = new Windows.UI.Popups.MessageDialog(
            "No internet connection has been found.");

2. ボタンを追加します。

        // Add commands and set their command handlers
        msg.commands.append(new Windows.UI.Popups.UICommand(
            "Try again", 
            commandInvokedHandler));
        msg.commands.append(
            new Windows.UI.Popups.UICommand("Close", commandInvokedHandler));

        // Set the command that will be invoked by default
        msg.defaultCommandIndex = 0;

        // Set the command to be invoked when escape is pressed
        msg.cancelCommandIndex = 1;

3. ダイアログを表示します。

        // Show the message dialog
        msg.showAsync();

4. 必要に応じて、複数のモーダル UI を処理します。

たとえばメッセージ ダイアログからファイル ピッカーを開くなど、ダイアログから別のモーダル UI を起動することがたまにあります。Windows では、元のダイアログのコマンド ハンドラー内から別のモーダル UI を起動することはできません。

代わりに、非同期操作の完了したハンドラー内からセカンダリ UI を起動します。完了したハンドラーは、ダイアログが破棄された後に実行され、非同期操作の結果が渡されるため、どのコマンドをユーザーがクリックしたかを元の UI から見分けることができます。

        var result = await msg.ShowAsync();

        if (result.Label == "Buy")
        {
            await this.YourCustomFLow(result);
        }
 
        private async Task YourCustomFlow(IUICommand command)
        {
            // Your code here.
        }

要約

このクイック スタートでは、メッセージ ダイアログの設計と実装に関するガイドラインを示しました。

関連トピック

MessageDialog

メッセージ ダイアログのサンプルのページ