Переключить отображение состояний
Я переделываю набор переключателей, некоторые из которых можно активировать и деактивировать с помощью стандартного шаблона. Однако некоторые из них активированы по умолчанию из-за разрешений администратора, но не могут быть деактивированы пользователем . Текущий дисплей показывает эти переключатели более светлым зеленым цветом, но, как я уже сказал, на них нельзя нажимать. Это сбило меня с толку при анализе поведения, и я предполагаю, что пользователи могут чувствовать то же самое. Как вы думаете, есть ли способ отобразить эти переключатели, чтобы пользователь знал, что они активированы, но их состояние нельзя изменить? Приложение адаптивно и может отображаться на нескольких устройствах. Заранее спасибо!
Ответы
Материальный дизайн показывает заблокированное состояние в серой версии, например:
Но проблема здесь в доступности. Пользователи с нарушениями зрения не смогут различить этих двух.
Вместо этого вы можете добавить символ блокировки внутри переключателя вместе с меньшим цветом непрозрачности, и если пользователь пытается взаимодействовать с ним, предоставьте всплывающую подсказку с надписью «заблокировано администратором» / «включено администратором» или что-то в этом роде.
Хотя наличие «блеклого» стиля для отключенных элементов управления является довольно стандартным, проблема здесь в том, что разница слишком тонкая, чтобы пользователь мог ее четко увидеть.
Вы можете изменить цвет с зеленого на серый (например), однако это может привести к потере ясности того, что на самом деле означает «включен» (что и является основной целью зеленого цвета).
Имея это в виду, я бы посоветовал вообще избегать использования элемента управления для этой цели. Вместо этого вы можете использовать текст для отображения включенного / отключенного состояния, не путаясь при использовании элемента управления для этого. Например:
В качестве альтернативы, как предлагает jcaron, вы также можете явно указать, что настройки были установлены администратором. Это помогает объяснить пользователю, что он не может их изменить. Что-то вроде этого:
Во-первых, вы должны пояснить, должен ли ваш переключатель быть доступен только для чтения или отключен.
Вот хорошая статья об этом:https://vaadin.com/docs/v8/framework/articles/ReadOnlyVsDisabledFields.html
В моем последнем проекте я использовал эти стили, чтобы различать состояния тумблера.
Переключатели бывают «активен и выбран», «активен», «отключен» и «только для чтения».
