ポップアップの表示

アラートの表示、ユーザーに選択の依頼、またはプロンプトの表示は、一般的な UI タスクです。 .NET マルチプラットフォーム アプリ UI (.NET MAUI) には、ポップアップを介してユーザーと対話するための Page クラスに、 DisplayAlertAsync、 DisplayActionSheetAsync、 DisplayPromptAsyncの 3 つのメソッドがあります。 ポップアップは、各プラットフォーム上のネイティブ コントロールでレンダリングされます。

これらのメソッドは非同期であり、UI の応答性を維持するために待機する必要があります。 UI スレッド コンテキスト (ページ イベント ハンドラーなど) から呼び出します。

アラートを表示する

.NET MAUI でサポートされているすべてのプラットフォームには、ユーザーに警告したり、簡単な質問をしたりするためのポップアップが表示されます。 アラートを表示するには、任意のDisplayAlertAsyncで Page メソッドを使用します。 次の例は、ユーザーへの単純なメッセージを示しています。

await DisplayAlertAsync("Alert", "You have been alerted", "OK");

アラートが無視されると、ユーザーはアプリとの対話を続行します。

注

Android では、アラートの外側にあるページをタップすると、アラートを無視できます。 デスクトップ プラットフォームでは、エスケープ キーを使用してアラートを無視できます。

DisplayAlertAsync メソッドを使用して、2 つのボタンを表示し、boolを返すことで、ユーザーの応答をキャプチャすることもできます。 アラートから応答を取得するには、ボタンとメソッド await の両方のテキストを指定します。

bool answer = await DisplayAlertAsync("Question?", "Would you like to play a game", "Yes", "No");
Debug.WriteLine("Answer: " + answer);

ユーザーがオプションのいずれかを選択すると、応答は boolとして返されます。

DisplayAlertAsync メソッドには、アラート内で UI 要素が流れる方向を指定するFlowDirection引数を受け入れるオーバーロードもあります。 フローの方向の詳細については、「 右から左へのローカリゼーション」を参照してください。

Warnung

Windows では、既定では、アラートが表示されるときに、アラートの背後にあるページで定義されているアクセス キーをアクティブ化できます。 詳細については、「 Windows の VisualElement アクセス キー」を参照してください。

タスクをユーザーに案内する

アクション シートには、タスクを続行する方法に関する一連の代替手段がユーザーに表示されます。 アクション シートを表示するには、任意のDisplayActionSheetAsyncで Page メソッドを使用し、メッセージラベルとボタン ラベルを文字列として渡します。

string action = await DisplayActionSheetAsync("ActionSheet: Send to?", "Cancel", null, "Email", "Twitter", "Facebook");
Debug.WriteLine("Action: " + action);

ユーザーがいずれかのボタンをタップすると、ボタン ラベルが stringとして返されます。

注

アクション シートの外側のページをタップすると、タッチ プラットフォームと Mac Catalyst でアクション シートを閉じます。 Windows では、アクション シートをエスケープ キーで閉じることができ、アクション シートの外側にあるページをクリックします。

アクション シートでは、破壊的な動作を表すボタンである破棄ボタンもサポートされています。 破棄ボタンは、 DisplayActionSheetAsync メソッドの 3 番目の文字列引数として指定することも、 nullのままにすることもできます。 次の例では、破棄ボタンを指定します。

async void OnActionSheetCancelDeleteClicked(object sender, EventArgs e)
{
  string action = await DisplayActionSheetAsync("ActionSheet: SavePhoto?", "Cancel", "Delete", "Photo Roll", "Email");
  Debug.WriteLine("Action: " + action);
}

注

iOS では、破棄ボタンはアクション シート内の他のボタンとは異なる方法でレンダリングされます。

DisplayActionSheetAsync メソッドには、UI 要素がアクション シート内を流れる方向を指定するFlowDirection引数を受け取るオーバーロードもあります。 フローの方向の詳細については、「 右から左へのローカリゼーション」を参照してください。

プロンプトを表示する

プロンプトを表示するには、任意のDisplayPromptAsyncでPageを呼び出し、タイトルとメッセージをstring引数として渡します。

string result = await DisplayPromptAsync("Question 1", "What's your name?");

[OK] ボタンをタップすると、入力した応答が stringとして返されます。 [キャンセル] ボタンをタップすると、 null が返されます。

注

Android では、アラートの外側にあるページをタップすることで、プロンプトを無視できます。 デスクトップ プラットフォームでは、エスケープ キーを使用してプロンプトを無視できます。

DisplayPromptAsync メソッドの完全な引数リストは次のとおりです。

• titleは、 string型で、プロンプトに表示するタイトルです。
• messageは、 string型で、プロンプトに表示するメッセージです。
• acceptは、 string型で、accept ボタンのテキストです。 これは省略可能な引数で、既定値は OK です。
• cancelは、 string型で、キャンセル ボタンのテキストです。 これは省略可能な引数で、既定値は Cancel です。
• placeholderは、 string型で、プロンプトに表示するプレースホルダー テキストです。 これは省略可能な引数で、既定値は null。
• maxLengthは、 int型で、ユーザー応答の最大長です。 これは省略可能な引数で、既定値は -1 です。
• keyboardは、 Keyboardの種類で、ユーザーの応答に使用するキーボードの種類です。 これは省略可能な引数で、既定値は Keyboard.Default。
• initialValueは、 string型で、表示され、編集できる定義済みの応答です。 これは省略可能な引数で、既定値は空の stringです。

次の例は、省略可能な引数の一部を設定する方法を示しています。

string result = await DisplayPromptAsync("Question 2", "What's 5 + 5?", initialValue: "10", maxLength: 2, keyboard: Keyboard.Numeric);

このコードは、定義済みの応答 10 を表示し、入力できる文字数を 2 に制限し、ユーザー入力用の数値キーボードを表示します。

Warnung

Windows では、既定では、プロンプトが表示されるときに、プロンプトの背後にあるページで定義されているアクセス キーをアクティブ化できます。 詳細については、「 Windows の VisualElement アクセス キー」を参照してください。

ページをポップアップとして表示する

.NET MAUI では、モーダル ページ ナビゲーションがサポートされています。 モーダル ページを使用すると、タスクが完了または取り消されるまで移動できない自己完結型タスクを完了することがユーザーに推奨されます。 たとえば、ユーザーが複数のデータを入力する必要があるポップアップとしてフォームを表示するには、フォームの UI を含む ContentPage を作成し、モーダル ページとしてナビゲーション スタックにプッシュします。 詳細については、「 モーダル ナビゲーションの実行」を参照してください。