次の方法で共有


ダイアログとポップアップ

ダイアログとポップアップは、通知、承認、またはユーザーからの追加情報を必要とする何かが発生したときに表示される一時的な UI 要素です。

ダイアログ

ダイアログの例

ダイアログは、コンテキスト アプリ情報を提供するモーダル UI オーバーレイです。 ダイアログは、明示的に閉じるまでアプリ ウィンドウとの対話をブロックします。 多くの場合、ユーザーに何らかのアクションを要求します。

フライアウト

ポップアップの例

フライアウトは、ユーザーの操作に関連する UI を表示する軽量のコンテキストメニューです。 配置とサイズ設定のロジックが含まれており、セカンダリ コントロールを表示したり、項目の詳細を表示したりするために使用できます。

ダイアログとは異なり、ポップアップをすばやく閉じるには、ポップアップの外側をタップまたはクリックするか、Esc キーまたは [戻る] ボタンを押すか、アプリ ウィンドウのサイズを変更するか、デバイスの向きを変更します。

これは適切なコントロールですか?

ダイアログとポップアップにより、ユーザーは重要な情報を認識できますが、ユーザー エクスペリエンスも中断されます。 ダイアログはモーダル (ブロック) であるため、ユーザーを中断し、ダイアログと対話するまで他の操作を行うのを防ぎます。 フライアウトは、ユーザーにとってそれほど刺激的でないエクスペリエンスを提供しますが、表示されるフライアウトが多すぎると、注意散漫となる可能性があります。

ダイアログまたはポップアップを使用することを決定したら、使用するダイアログまたはポップアップを選択する必要があります。

ダイアログは対話をブロックしますが、フライアウトはブロックしません。したがって、ダイアログはユーザーが特定の情報に集中したり質問に答えたりするために、他のすべてを中断する必要がある状況に備えて使用するべきです。 一方、ポップアップは、何かに注意を向けたい場合に使用できますが、ユーザーがそれを無視したい場合は問題ありません。

ダイアログを使用します。...

  • 続行する前にユーザーが読み取り、確認 する必要がある 重要な情報を表します。 例を次に示します。
    • ユーザーのセキュリティが侵害される可能性がある場合
    • ユーザーが貴重な資産を永続的に変更しようとしている場合
    • ユーザーが貴重な資産を削除しようとしている場合
    • アプリ内購入を確認するには
  • 接続エラーなど、アプリ全体のコンテキストに適用されるエラー メッセージ。
  • 質問。アプリがユーザーにブロックの質問をする必要がある場合 (アプリがユーザーの代わりに選択できない場合など)。 ブロックする質問は無視したり延期したりすることはできません。また、ユーザーに明確に定義された選択肢を提供する必要があります。

フライアウトを使用します。...

  • アクションを完了する前に必要な追加情報の収集。
  • 一部の時間にのみ関連する情報を表示する。 たとえば、フォト ギャラリー アプリでは、ユーザーが画像のサムネイルをクリックすると、ポップアップを使用して大きなバージョンの画像を表示できます。
  • ページ上のアイテムの詳細や長い説明など、詳細情報を表示する。

ダイアログとポップアップの使用を回避する方法

共有する情報の重要性を考慮してください。ユーザーを中断するのに十分な重要な情報ですか? また、情報を表示する必要がある頻度も考慮してください。数分ごとにダイアログまたは通知を表示する場合は、代わりにプライマリ UI でこの情報の領域を割り当てることができます。 たとえば、チャット クライアントでは、フレンドがログインするたびにポップアップを表示するのではなく、その時点でオンラインになっているフレンドの一覧を表示し、ログオン時にフレンドを強調表示することができます。

ダイアログは、実行前にアクション (ファイルの削除など) を確認するためによく使用されます。 ユーザーが特定のアクションを頻繁に実行することが予想される場合は、ユーザーが毎回アクションを確認するように強制するのではなく、ユーザーが操作を間違った場合に元に戻す方法を提供することを検討してください。

例示

  • WinUI 3 ギャラリー アプリがインストールされている場合は、ここをクリックしてアプリを開き、ContentDialog または Flyout の動作を確認します。 Microsoft Store からアプリを取得するか、GitHub でソース コードを取得します。

ダイアログを作成する方法

ダイアログの 記事を参照してください。

Flyoutを作成する方法

フライアウトの記事を参照してください。