[WinUI 3][ContentDialog] ダイアログメッセージを表示する

スポンサーリンク

この記事では、ContentDialog を使用してメッセージを表示する方法について説明します。

環境

開発環境 Microsoft Visual Studio Professional 2019 Preview
Version 16.11.0 Preview 3.0
Framework Microsoft .NET Framework Version 4.8.04084
その他 Microsoft.Project Reunion 0.8.0-preview
Microsoft.ProjectReunion.Foundation 0.8.0-preview
Microsoft.ProjectReunion.WinUI 0.8.0-preview
Microsoft.UI.Xaml 2.6.1

ダイアログボックスを作成する

WinUI でダイログボックスを作成するには、ContentDialog を使用します。

基本構文は以下の通りです。

ContentDialog contentDialog = new ContentDialog
{
    Title = "ダイアログタイトル",
    Content = "コンテンツ(メッセージ内容)",
    CloseButtonText = "ボタンに表示するテキスト"
};

ContentDialogResult result = await contentDialog.ShowAsync();

Title にはダイアログタイトルを、Content には表示するメッセージを、CloseButtoText にはダイアログを閉じるためのボタンテキストを設定します。

作成したダイアログを表示するには、ShowAsync メソッドを使用します。

CloseButton を使用する例

ダイアログを閉じるときのボタンが1つの場合は CloseButtonText を使用します。

CloseButton が押された場合は ContentDialogResult.None が返されます。

private async void myButton_Click(object sender, RoutedEventArgs e)
{
    ContentDialog myDialog = new ContentDialog
    {
        Title = "ダイアログタイトル",
        Content = "ここにメッセージを表示",
        CloseButtonText = "OK"
    };

    myDialog.XamlRoot = this.Content.XamlRoot;
    ContentDialogResult result = await myDialog.ShowAsync();

    if (result == ContentDialogResult.None)
    {
        // ここに CloseButton が押されたときの処理を記述
    }
}
CloseButton のみのダイアログ表示

CloseButton のみのダイアログ表示

PrimaryButton と CloseButton の2つのボタンを使用する例

「はい」「いいえ」や「OK」「NG」のように、2択のボタンを表示する場合は PrimaryButtonText と CloseButtonText を使用します。

PrimaryButton が押された場合 ContentDialogResult.Primary が返されます。

private async void myButton_Click(object sender, RoutedEventArgs e)
{
    ContentDialog myDialog = new ContentDialog
    {
        Title = "ダイアログタイトル",
        Content = "ここにメッセージを表示",
        PrimaryButtonText = "はい",
        CloseButtonText = "いいえ"
    };

    myDialog.XamlRoot = this.Content.XamlRoot;
    ContentDialogResult result = await myDialog.ShowAsync();

    if (result == ContentDialogResult.Primary)
    {
        // ここに PrimaryButton が押されたときの処理を記述
    }
    else
    {
        // ここに CloseButton が押されたときの処理を記述
    }
}
PrimaryButton と CloseButton の2つのボタンを使用する例

PrimaryButton と CloseButton の2つのボタンを使用する例

PrimaryButton, SecondaryButton, CloseButton の3つのボタンを使用する例

ContentDialog は3つのボタンを表示することができ、PrimaryButtonText, SecondaryButtonText, CloseButtonText の3つにテキストを設定します。PrimaryButton が一番左側、SecondaryButton が中央、CloseButton が一番右側に表示されます。

PrimaryButton が押された場合 ContentDialogResult.Primary が、SecondaryButton が押された場合 ContentDialogResult.Secondary が返されます。

private async void myButton_Click(object sender, RoutedEventArgs e)
{
    ContentDialog myDialog = new ContentDialog
    {
        Title = "ダイアログタイトル",
        Content = "ここにメッセージを表示",
        PrimaryButtonText = "左",
        SecondaryButtonText = "中",
        CloseButtonText = "右"
    };

    myDialog.XamlRoot = this.Content.XamlRoot;
    ContentDialogResult result = await myDialog.ShowAsync();

    if (result == ContentDialogResult.Primary)
    {
        // ここに PrimaryButton が押されたときの処理を記述
    }
    else if (result == ContentDialogResult.Secondary)
    {
        // ここに SecondaryButton が押されたときの処理を記述
    }
    else
    {
        // ここに CloseButton が押されたときの処理を記述
    }
}
PrimaryButton, SecondaryButton, CloseButton の3つのボタンを使用する例

PrimaryButton, SecondaryButton, CloseButton の3つのボタンを使用する例

デフォルトボタンを設定する

コンテンツダイアログに複数のボタンを表示する場合は、ContentDialog.DefaultButton プロパティを使用して既定のボタンを設定することができます。

以下は、SecondaryButton を既定のボタンに設定します。

private async void myButton_Click(object sender, RoutedEventArgs e)
{
    ContentDialog myDialog = new ContentDialog
    {
        Title = "ダイアログタイトル",
        Content = "ここにメッセージを表示",
        PrimaryButtonText = "左",
        SecondaryButtonText = "中",
        CloseButtonText = "右",
        DefaultButton = ContentDialogButton.Secondary  // 既定のボタンを Secondary に設定
    };

    myDialog.XamlRoot = this.Content.XamlRoot;
    ContentDialogResult result = await myDialog.ShowAsync();
}
既定ボタンの設定

既定ボタンの設定

WinUI 3 Tips一覧

WinUI 3 のTips 一覧はこちら

Please follow and like us:

コメント

タイトルとURLをコピーしました