Заголовок діалогового вікна є основною інструкцією та є необов'язковим.
- Використовуйте коротку назву, щоб пояснити, що робити з діалогом.
- Якщо ви використовуєте діалогове вікно для доставки простого повідомлення, помилки або питання, ви можете також опустити заголовок. Спирайтеся на текст вмісту, щоб доставити ці основні відомості.
- Переконайтеся, що заголовок безпосередньо стосується вибору кнопки.
- Як можна простіше уявити повідомлення, помилку чи блокувати питання.
- Якщо використовується назва діалогового вікна, використовуйте область вмісту, щоб отримати додаткові відомості або термінологію. Не повторюйте назву з іншим словом.
- Переконайтеся, що діалогове вікно має принаймні одну кнопку, яка відповідає безпечній оборотній дії, наприклад "Зрозуміло", "Закрити" або "Скасувати". Використовуйте API CloseButton, щоб додати цю кнопку.
- Як текст кнопки використовуйте конкретні варіанти відповіді на основну інструкцію або вміст.Прикладом є "Дозволити програмі Ім'я для доступу до вашого розташування?", а потім кнопки "Дозволити" та "Блокувати". Конкретні відповіді можна зрозуміти швидше, що призводить до ефективного прийняття рішень.
- Переконайтеся, що текст кнопки дії короткий. Короткі рядки дозволяють користувачеві зробити вибір швидко та впевнено.
- Крім безпечної оборотної дії, можна за необхідності представити користувачеві одну або дві кнопки дії, пов'язані з основною інструкцією. Ці кнопки дії "виконати" підтверджують головну мету діалогового вікна. Використовуйте API SecondaryButton та PrimaryButton для додавання цих дій "виконати".
- Кнопки дій "виконати" повинні відображатись як крайні ліві кнопки. Безпечна оборотна дія повинна бути представлена правою кнопкою.
- При необхідності можна виділити одну з трьох кнопок як діалогове вікно за замовчуванням. Використовуйте API DefaultButton, щоб виділити одну з кнопок.
UWP та WinUI 2
Відомості та приклади цієї статті оптимізовані для програм, які використовують пакет SDK для програм Windows і WinUI 3, але зазвичай застосовуються до програм UWP, що використовують WinUI 2. Див. довідник API UWP для конкретних відомостей і прикладів платформи.
У цьому розділі містяться відомості, необхідні для використання елемента керування у програмі UWP або WinUI 2.
API для цього елемента керування існують у просторі імен Windows.UI.Xaml.Controls.
- API UWP:клас ContentDialog
- Відкрийте програму колекції WinUI 2 і перегляньте ContentDialog у дії. Програми з колекції WinUI 2 включають інтерактивні приклади більшості елементів керування, можливостей та функцій WinUI 2. Отримайте програму з Microsoft Store або отримайте вихідний код у GitHub.
Ми рекомендуємо використовувати останню версію WinUI 2 , щоб отримати найактуальніші стилі та шаблони для всіх елементів керування.WinUI 2.2 або пізнішої версії містить новий шаблон для цього елемента керування, що використовує заокруглені кути. Для отримання додаткових відомостей див. у розділі про радіус кута.
Створення діалогового вікна
Додаток колекції WinUI 3 включає інтерактивні приклади більшості елементів керування, функцій та функцій WinUI 3. Отримання програми з Microsoft Store або отримання вихідного коду на GitHub
Щоб створити діалогове вікно, використовуйте клас ContentDialog. Діалогове вікно можна створити у коді або розмітці. Хоча зазвичай простіше визначати елементи інтерфейсу користувача в XAML, у разі простого діалогу простіше просто використовувати код. У цьому прикладі створюється діалогове вікно для сповіщення користувача про відсутність підключення WiFi, а потім використовується метод ShowAsync для відображення.
private async void DisplayNoWifiDialog() < ContentDialog noWifiDialog = новий ContentDialog < Title = "Не підключення до мережі", Content = "Check your connection and try again.", CloseButtonText = "OK" >; ContentDialogResult result = await noWifiDialog.ShowAsync(); >
Коли користувач натискає кнопку діалогового вікна, ShowAsync метод повертає ContentDialogResult, щоб дізнатися, яка кнопка натискає користувача.
У цьому прикладі діалогове вікно задає питання і використовує повернутий ContentDialogResult для визначення відповіді користувача.
private async void DisplayDeleteFileDialog() < ContentDialog deleteFileDialog = new ContentDialog < Title = "Delete file permanently?", Content = "Якщо виконати цей файл, ви не можете відновити його. PrimaryButtonText = "Delete", CloseButtonText = "Cancel" >; ContentDialogResult result = await deleteFileDialog.ShowAsync(); // Delete the file if the user clicked the primary button. /// Otherwise, do nothing. if (result == ContentDialogResult.Primary) < // Delete the file. >else < // За допомогою кнопки CloseButton, натиснуто ESC, Gamepad B, або система back button.// Do nothing. >>
Надання безпечної дії
Так як діалогові вікна блокують взаємодію з користувачем, а кнопки - це основний механізм, що дозволяє користувачам закрити діалогове вікно, переконайтеся, що діалогове вікно містить принаймні одну кнопку безпечної та оборотної дії, наприклад "Закрити" або "Зрозуміло". Усі діалогові вікна повинні містити принаймні одну кнопку безпечної дії, яка дозволяє закрити діалогове вікно. Це гарантує, що користувач зможе спокійно закрити діалогове вікно без будь-якої дії.
private async void DisplayNoWifiDialog() < ContentDialog noWifiDialog = новий ContentDialog < Title = "Не підключення до мережі", Content = "Check your connection and try again.", CloseButtonText = "OK" >; ContentDialogResult result = await noWifiDialog.ShowAsync(); >
Коли діалогові вікна використовуються для відображення питання, що блокує, діалогове вікно повинно містити кнопки дій, пов'язані з цим питанням. Кнопка "безпечної" та оборотної дії може супроводжуватися однією або двома кнопками дії "виконати". Пропонуючи користувачу кілька варіантів на вибір, переконайтеся, що кнопки точно відповідають діям "виконати" та безпечним діям "не виконувати", пов'язаним із запропонованим питанням.
private async void DisplayLocationPromptDialog() < ContentDialog locationPromptDialog = новий ContentDialog < Title = "Додатковий AppName для доступу до вашої місцевості?" "Block", PrimaryButtonText = "Allow" >; ContentDialogResult result = await locationPromptDialog.ShowAsync(); >
Діалогові вікна з трьома кнопками використовуються, коли ви пропонуєте користувачеві дві дії "виконати" та одну дію "не виконувати". Діалогові вікна із трьома кнопками слід використовувати не надто часто.Вони повинні чітко відрізнятися додаткову дію і безпечне дію (закриття).
private async void DisplaySubscribeDialog() < ContentDialog subscribeDialog = новий ContentDialog < Title = "Subscribe to App Service?", Content = "Listen, watch, and play in high definition for only $9.99/month. Free to try, cancel anytime." CloseButtonText = "Not Now", PrimaryButtonText = "Subscribe", SecondaryButtonText = "Try it" >; ContentDialogResult result = await subscribeDialog.ShowAsync(); >
Три кнопки у діалоговому вікні
ContentDialog підтримує три типи кнопок, які можна використовувати для створення діалогових вікон.
- CloseButton (обов'язковий) представляє безпечну, оборотну дію, яка дозволяє користувачеві закрити діалогове вікно. Відображається у вигляді правої кнопки.
- PrimaryButton (необов'язковий) представляє першу дію "виконати". Відображається у вигляді лівої кнопки.
- SecondaryButton (необов'язковий) представляє другу дію "виконати". Відображається у вигляді середньої кнопки.
Використання вбудованих кнопок дозволяє їх правильно розмістити у вікні, а також гарантує, що вони правильно реагуватимуть на події клавіатури, що область команд залишиться видимою, навіть коли відображена екранна клавіатура, і що діалогове вікно виглядатиме узгоджено з іншими діалоговими вікнами.
CloseButton
Кожне діалогове вікно має містити кнопку безпечної та оборотної дії, яка дозволяє користувачам спокійно закрити діалогове вікно.
Використовуйте API ContentDialog.CloseButton для створення цієї кнопки. Це дозволить забезпечити правильну взаємодію з користувачем для всіх методів введення, включаючи мишу, клавіатуру, сенсорне введення та ігровий контролер. Ця взаємодія відбуватиметься у таких випадках:
- Користувач клацає або натискає кнопку CloseButton.
- Користувач натискає кнопку "Назад системи".
- Користувач натискає кнопку ESC на клавіатурі.
- Користувач натискає на Gamepad B.
Коли користувач натискає кнопку діалогового вікна, ShowAsync метод повертає ContentDialogResult, щоб дізнатися, яка кнопка натискає користувача. При натисканні кнопки CloseButton повертається ContentDialogResult.None.
PrimaryButton та SecondaryButton
Крім CloseButton, можна також надати користувачеві одну або дві кнопки дії, пов'язані з основною інструкцією. Використовуйте PrimaryButton для першої дії "виконати" та SecondaryButton - для другої дії "виконати". У діалогових вікнах з трьома кнопками PrimaryButton зазвичай представляє підтверджуючу дію "виконати", а SecondaryButton зазвичай представляє нейтральну або допоміжну дію "виконати". Наприклад, програма може запропонувати користувачеві підписатися на службу. PrimaryButton як підтверджуюча дія "виконати" міститиме текст "Підписатися", а SecondaryButton як нейтральна дія "виконати" міститиме текст "Спробувати". CloseButton дозволить користувачеві скасувати операцію без виконання будь-якої дії.
Коли користувач натискає кнопку PrimaryButton, метод ShowAsync повертає ContentDialogResult.Primary. Коли користувач натискає кнопку SecondaryButton, метод ShowAsync повертає ContentDialogResult.Secondary.
DefaultButton
При необхідності можна виділити одну з трьох кнопок як стандартну кнопку. Якщо задати кнопку за замовчуванням, відбувається наступне.
- Кнопка оформляється як кнопка підтвердження дії.
- Кнопка автоматично відповість на клавішу ВВЕДЕННЯ
- Коли користувач натискає клавішу "ВВЕДЕННЯ" на клавіатурі, активується обробник натискання, пов'язаний з кнопкою, і ContentDialogResult поверне значення, пов'язане з кнопкою за промовчанням.
- Якщо користувач помістив фокус клавіатури на елемент керування, який обробляє кнопку "ВВЕДЕННЯ", то кнопка за замовчуванням не буде реагувати на натискання клавіші "ВВЕДЕННЯ".
Використовуйте ContentDialog.DefaultButton, щоб вказати кнопку за замовчуванням. За замовчуванням кнопка за замовчуванням не вказана.
private async void DisplaySubscribeDialog() < ContentDialog subscribeDialog = новий ContentDialog < Title = "Subscribe to App Service?", Content = "Listen, watch, and play in high definition for only $9.99/month. Free to try, cancel anytime." CloseButtonText = "Not Now", PrimaryButtonText = "Subscribe", SecondaryButtonText = "Try it", DefaultButton = ContentDialogButton.Primary >; ContentDialogResult result = await subscribeDialog.ShowAsync(); >
Діалогові вікна підтвердження (ОК або скасування)
Діалогове вікно підтвердження дозволяє користувачам підтвердити, що вони хочуть виконати дію. Вони можуть підтвердити дію або скасувати. Звичайне діалогове вікно підтвердження має дві кнопки: кнопку підтвердження ("ОК") та кнопку скасування.
- Як правило, кнопка підтвердження повинна знаходитись ліворуч (основна кнопка), а кнопка скасування (вторинна кнопка) повинна знаходитись праворуч.
- Як зазначено в розділі загальних рекомендацій, використовуйте кнопки з текстом, який визначає конкретні відповіді на основну інструкцію або вміст.
Деякі платформи поміщають кнопку підтвердження праворуч замість лівого. То чому ми рекомендуємо покласти його зліва? Якщо припустити, що більшість користувачів правою рукою, і вони тримають свій телефон з цією рукою, це дійсно зручніше натиснути кнопку підтвердження, коли вона знаходиться зліва, тому що кнопка, швидше за все, буде знаходитися всередині великої дуги користувача. Кнопки у правій частині екрана вимагають, щоб користувач витягнув палець у менш зручне положення.
ContentDialog в об'єктах AppWindow або XAML Island
ПРИМІТКА. Цей розділ застосовується лише до програм, призначених для Windows 10 версії 1903 або пізнішої. Об'єкти AppWindow та XAML Island недоступні у попередніх версіях. Для отримання додаткових відомостей про керування версіями див. у статті Програми з адаптивним до версії кодом.
За замовчуванням діалогові вікна вмісту модально пов'язані з кореневим об'єктом ApplicationView. При використанні ContentDialog в об'єкті AppWindow або XAML Island необхідно вручну встановити XamlRoot для діалогового вікна, вказавши корінь вузла XAML.
Для цього задайте для властивості XamlRoot елемента ContentDialog те саме значення XamlRoot, що й у елемента, вже заданого в AppWindow або XAML Island, як показано нижче.
private async void DisplayNoWifiDialog() < ContentDialog noWifiDialog = новий ContentDialog < Title = "Не підключення до мережі", Content = "Check your connection and try again.", CloseButtonText = "OK" >; // За допомогою цього коду до пристосування dialog до відповідного AppWindow під час встановлення // dialog XamlRoot до самого XamlRoot як елемент that is already present in the AppWindow. if (ApiInformation.IsApiContractPresent("Windows.Foundation.UniversalApiContract", 8)) < noWifiDialog.XamlRoot = elementAlreadyInMyAppWindow.XamlRoot; >ContentDialogResult result = await noWifiDialog.ShowAsync(); >
У потоці може існувати лише один елемент ContentDialog одночасно. Спроба відкрити два елементи ContentDialogs породить виняток, навіть якщо вони намагаються відкрити окремі об'єкти AppWindow.
Отримання коду прикладу
- Приклад колекції WinUI. Перегляньте всі елементи керування XAML в інтерактивному форматі.
Пов'язані статті
Як закрити діалогове вікно
На вашому екрані є діалогове вікно, яке не хоче зникати, і вам хотілося б його позбутися? Є кілька способів, які ви можете зробити, щоб прибрати його.
Дії
1. Зрозумійте, що діалогові вікна відображаються, коли може виникнути проблема з комп'ютером
Автор програми хоче переконатися, що користувач усвідомлює наслідки того, що може зробити дію, і що ви знаєте, що процес скасовує зміну (якщо вони випадково завершені).
2. Дайте відповідь на діалогове вікно
Натисніть кнопку «ОК» або «Скасувати/Закрити» у діалоговому вікні. Традиційно, закриваючи їх, можна клацнути одну із ящиків.
3. Закрийте діалогове вікно за допомогою альтернативних кнопок
Натисніть кнопку x у верхньому правому куті діалогового вікна, яке ви хочете закрити. Натискання цієї кнопки має закрити вікно та змусити його зникнути. Однак іноді це може призвести до того, що натомість відкриються альтернативні інші вікна.
4. Використовуйте завдання context-Close зі списку панелі завдань для діалогового вікна, що з'явилося.
Клацніть правою кнопкою миші піктограму, яка посилається на діалогове вікно на панелі завдань Windows, і натисніть кнопку «Закрити». Знову ж таки, ви можете опинитися разом з іншими, зробивши це, але це діалогове вікно зникне.
5. Використовуйте Менеджер завдань у Windows
(якщо ви використовуєте їх на ПК з Windows). Відкрийте Менеджер завдань у Windows (з вкладки «Програми»), виділіть рядок у діалоговому вікні та натисніть «Завершити завдання». Якщо діалогове вікно є впертим, вам може знадобитися зробити це кілька разів (без натискання «Завершити завдання», щоб це діалогове вікно повністю зникло).
6. Закрийте всю програму та будь-які інші відкриті програми
Зробіть це, якщо інші ідеї не вдасться закрити проблемне діалогове вікно.
7.Збережіть свою роботу
(якщо програма, як і раніше, дозволяє вам, оскільки деякі програми працюють у фоновому режимі далеко від діалогового вікна) і перезапустіть всю систему з нуля. Утримуйте кнопку живлення протягом 30 секунд. .
Поради
- iOS (iPhone, iPod touch та iPads) рідко відображаються діалогові вікна.
Попередження
- Якщо ви коли-небудь отримаєте діалогове вікно, в якому говориться, що на вашому комп'ютері виникають проблеми зі шкідливим програмним забезпеченням з програми, яку ви не дізнаєтеся, вам доведеться закрити її.
- Однак, ніколи не натискайте жодної з кнопок. Ідіть прямо в диспетчер завдань і завершіть завдання цієї кнопки безпосередньо перед виконанням будь-яких інших завдань на вашому комп'ютері.
