Confirm dialog

Общая информация

ConfirmDialog - модальное всплывающее окно, которое содержит дополнительную информацию и используется для проверки решения пользователя или для подтверждения выполнения действий через нажатие кнопки.

Анатомия

Заголовок. Краткое описание контента или суть процесса. Опционально может содержать подпись. Допускается использовать без заголовка.
Контентная область. Содержит информацию и/или элементы управления, необходимые для выполнения задачи модального окна.
Блок кнопок (footer). Содержит основные действия, необходимые для завершения или отмены задачи окна.

Описание работы

Позиционирование

ConfirmDialog позиционируется относительно окна приложения и блокирует содержимое приложения появлением лайтбокса (затемнением основного контента страницы), пока пользователь не совершит какое-либо действие.

Приложение на платформе

Лайтбокс не перекрывает артефакты платформы - шапку и меню приложений
Выравнивание всплывающего окна - относительно окна приложения

Неплатформенное решение

Лайтбокс перекрывает основной интерфейс
Выравнивание всплывающего окна - относительно основного интерфейса
Также, относительно задачи, могут быть и другие паттерны использования

Хорошим тоном считается, если после подтверждения действия система дает пользователю обратную связь (message).

Оформление

Кнопки

Максимальное количество кнопок в блоке - 3. Старайтесь не применять большое количество стилей кнопок. Важность действия должна соответствовать оформлению кнопки.

Важно в качестве текстовой метки использовать слова, описывающие действия. Например, «Добавить», «Удалить», «Сохранить» и так далее. Не допускайте расплывчатых формулировок, таких как «Готово» или «ОК».

Блок кнопок

В ConfirmDialog схема расположения кнопок вертикальная.

Так как в ConfirmDialog не применяется кнопка закрытия (Х), используйте кнопки действия для завершения процесса. При этом старайтесь избегать общих формулировок, текст кнопки должен максимально четко отражать последствия нажатия на нее.

Оверлей

Общее

Основной фон страницы перекрывается оверлеем, полупрозрачным фоном блокирующим взаимодействие с контентной частью. Бокировка контента на экране зависит от того приложение на платформе, либо нет.