Windows 7 раскрывающихся списков & Поля со списком

Примечание

Это руководство по проектированию было создано для Windows 7 и не было обновлено для более новых версий Windows. Большая часть рекомендаций по-прежнему применяется в принципе, но презентация и примеры не отражают наше текущее руководство по проектированию.

С помощью раскрывающегося списка или поля со списком пользователи делают выбор между списком взаимоисключающих значений. Пользователи могут выбрать один и только один вариант. В стандартном раскрывающемся списке пользователи ограничены вариантами в списке, но с полем со списком они могут ввести выбор, который отсутствует в списке.

Типичная поле со списком.

При чтении этой статьи важно понимать следующие термины:

• Стандартное поле списка — это поле, содержащее список нескольких элементов с видимыми несколькими элементами.
• Раскрывающийся список — это список, в котором выбранный элемент всегда отображается, а остальные отображаются по запросу, нажав кнопку раскрывающегося списка.
• Поле со списком — это сочетание стандартного списка или раскрывающегося списка и редактируемого текстового поля, что позволяет пользователям вводить значение, которое отсутствует в списке.
  • Редактируемый раскрывающийся список — это сочетание раскрывающегося списка и редактируемого текстового поля.
  • Редактируемый список — это сочетание стандартного списка и редактируемого текстового поля.

Примечание

Рекомендации, связанные с макетом , представлены в отдельной статье.

Выбор правильного элемента управления

Чтобы определиться, ответьте на вопросы:

• Используется ли элемент управления для выбора одного варианта из списка взаимоисключающих значений? Если нет — используйте другой элемент управления. Чтобы выбрать несколько параметров, используйте стандартный список с множественным выбором, список флажок, построитель списков или добавить или удалить список.
• Являются ли команды параметров? Если да, используйте вместо этого кнопку меню или разделите кнопку. Используйте раскрывающиеся списки и поля со списком для объектов (существительных) или атрибутов (прилагательные), но не команды (команды).
• Содержит ли список данные, а не параметры программы? В любом случае раскрывающийся список или поле со списком подходит для выбора. Напротив, переключатели подходят только для небольшого количества вариантов программы.

Раскрывающиеся списки

• Рекомендуется ли по умолчанию для большинства пользователей в большинстве случаев? Видит ли выбранный параметр гораздо важнее, чем просмотр альтернативных вариантов? Рассмотрите возможность использования раскрывающегося списка, если вы не хотите поощрять пользователей вносить изменения, скрывая альтернативные варианты. Если нет, рассмотрите возможность выбора переключателей, списка с одним выбором или редактируемого списка, что делает больший акцент на альтернативные варианты.

  

  В этом примере наивысшее качество цвета является лучшим выбором для большинства пользователей, поэтому раскрывающийся список — это хороший выбор, чтобы преуменьшить альтернативные варианты.

• Вы хотите привлечь внимание к варианту? Если это так, рассмотрите переключатели, список с одним выбором или редактируемый список, который, как правило, привлекает больше внимания, принимая больше места на экране. Так как раскрывающиеся списки компактны, они хороши для вариантов, которые нужно недооценивать.

• Есть ли экранное пространство на уровне "Премиум"? В этом случае используйте раскрывающийся список, так как используемое пространство экрана фиксировано и независимо от количества вариантов.

• Есть ли в окне другие раскрывающийся список? В этом случае рассмотрите возможность использования раскрывающегося списка для обеспечения согласованности.

Редактируемые раскрывающиеся списки

Помимо принципов, которые только что были предоставлены для раскрывающихся списков, также применяются следующие элементы:

• Ограничены ли возможные варианты? В этом случае используйте обычный раскрывающийся список. Поля со списком предназначены для неограниченного ввода, в котором пользователям может потребоваться ввести значение, которое в настоящее время отсутствует в списке. Поскольку входные данные не ограничены, если пользователи вводят недопустимый текст, необходимо обработать ошибку с сообщением об ошибке.

• Можно ли заранее перечислить наиболее вероятные варианты? В противном случае используйте текстовое поле.

• Используется ли раскрывающийся список для перечисления предыдущих входных данных пользователя? Если пользователям не нужно просматривать полный список предыдущих входных данных, используйте текстовое поле с параметром автозавершение.

  

  В этом примере пользователям может потребоваться просмотреть предыдущие входные данные, поэтому редактируемый раскрывающийся список является хорошим выбором.

  

  В этом примере текстовое поле с автозавершением является хорошим выбором.

• Нужна ли помощь пользователям при выборе допустимых значений? В этом случае используйте текстовое поле с кнопкой "Обзор ".

  

  В этом примере пользователи могут нажать кнопку "To", чтобы помочь им выбрать допустимые значения.

• Важно ли поощрять пользователей просматривать альтернативные варианты или приглашать изменения? В этом случае рекомендуется использовать редактируемое поле списка. В редактируемом раскрывающемся списке пользователи не будут знать об альтернативных вариантах, пока список не будет удален.

• Нужно ли пользователям быстро находить элемент в большом списке? (только Win32) В этом случае используйте поле со списком, так как пользователи могут выбрать элемент, введя его полное имя. Напротив, раскрывающийся список Win32 выбирает элементы, основанные только на последнем типизированном символе (поэтому ввод "Jun" в список месяцев будет соответствовать ноябрь, а не июнь). В этом случае используйте поле со списком, даже если возможные варианты ограничены.

Редактируемые списки

• Ограничены ли возможные варианты? Если да, используйте вместо этого одиночный или обычный раскрывающийся список. Поля со списком предназначены для неограниченного ввода, где пользователям может потребоваться ввести значение, которое в настоящее время отсутствует в списке. Поскольку входные данные не ограничены, если пользователи вводят недопустимый текст, необходимо обработать ошибку с сообщением об ошибке.
• Можно ли заранее перечислить наиболее вероятные варианты? В противном случае используйте текстовое поле.
• Важно ли поощрять пользователей просматривать альтернативные варианты или приглашать изменения? В противном случае рассмотрите редактируемый раскрывающийся список.
• Вы хотите привлечь внимание к варианту? В противном случае рассмотрите редактируемый раскрывающийся список. Так как раскрывающиеся списки компактны, они хороши для вариантов, которые нужно недооценивать.
• Есть ли экранное пространство на уровне "Премиум"? В этом случае используйте редактируемый раскрывающийся список, так как используемое пространство экрана фиксировано и не зависит от количества вариантов.

Для раскрывающихся списков количество элементов в списке не является фактором выбора элемента управления , так как они масштабируются от тысяч элементов вплоть до одного. Редактируемые раскрывающиеся списки масштабируются от тысяч элементов до ни одного, так как пользователи могут ввести значение, которое отсутствует в списке. Так как раскрывающийся список можно использовать для данных, количество элементов может быть неизвестно заранее и, возможно, не может быть гарантировано. Всегда включать по крайней мере три элемента в редактируемые списки, чтобы оправдать дополнительное пространство экрана.

Варианты использования

Раскрывающийся список и поля со списком имеют несколько шаблонов использования:

Использование	Пример
Раскрывающийся список стандартного раскрывающегося списка с фиксированным набором предопределенных значений.	При закрытии отображается только выбранный элемент. Когда пользователи нажимают кнопку раскрывающегося списка, все параметры становятся видимыми. Чтобы изменить значение, пользователи могут открыть список и щелкнуть другое значение. В этом примере список находится в обычном состоянии. В этом примере список удален.
Раскрывающийся список предварительных версий содержит раскрывающийся список, который просматривает результаты выбора, чтобы помочь пользователям выбирать.	В этих примерах раскрывающийся список выводит результаты выбора.
Редактируемый раскрывающийся список содержит раскрывающееся поле со списком, которое позволяет пользователям вводить значение, которое отсутствует в раскрывающемся списке.	Примеры редактируемого раскрывающегося списка в режимах редактирования и удаления. Используйте этот элемент управления, если вы хотите предоставить гибкость текстового поля, но хотите помочь пользователям, предоставив удобный список вероятных вариантов.
Редактируемые списки обычное поле со списком, которое позволяет пользователям вводить значение, которое не всегда отображается в списке.	В этих примерах всегда отображаются редактируемые списки. Этот элемент управления лучше, чем редактируемый раскрывающийся список, когда важно поощрять пользователей просматривать альтернативные варианты или приглашать изменения.

Рекомендации

Общие сведения

• Не используйте изменение раскрывающегося списка или поля со списком на:
  • Выполнение команд.
  • Отображение других окон, таких как диалоговое окно для сбора дополнительных входных данных.
  • Динамически отображать другие элементы управления, связанные с выбранным элементом управления (средства чтения с экрана не могут обнаруживать такие события).

Уровень представления

• Сортировка элементов списка в логическом порядке, например группирование параметров с высоким уровнем связи, размещение наиболее распространенных параметров в первую очередь или использование алфавитного порядка. Сортировка имен в алфавитном порядке, числах в числовом порядке и датах в хронологическом порядке. Списки с 12 или более элементами должны быть отсортированы в алфавитном порядке, чтобы упростить поиск элементов.

  Правильно:

  В этом примере элементы списка сортируются по их пространственной связи.

  Неправильный:

  В этом примере существует так много элементов списка, которые необходимо отсортировать в алфавитном порядке.

  Правильно:

  В этом примере элементы списка сортируются в алфавитном порядке, за исключением параметра, представляющего все элементы.

• Поместите параметры, представляющие все или нет в начале списка, независимо от порядка сортировки остальных элементов.

• Заключите мета-параметры в круглые скобки.

  

  В этом примере "(None)" является мета-параметром, так как он не является допустимым значением для выбора, а описывает, что сам параметр не используется.

• При отключении раскрывающегося списка или поля со списком также отключите все связанные метки и кнопки команд.

Раскрывающиеся списки

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

• Вместо этогоне используются пустые элементы списка. Пользователи не знают, как интерпретировать пустые элементы, тогда как значение мета-параметров явно.

  Правильно:

  Неправильный:

  В неправильном примере значение пустого параметра неясно.

Предварительный просмотр раскрывающихся списков

• Используйте предварительные версии в элементах списка, если лучше отображать изображения, чем описывать только текст.

  

  В этом примере предварительная версия объясняет параметры гораздо лучше, чем только текст.

• Не используйте ненужные ненужные ненужные значки в предварительном просмотре.

  Неправильный:

  В этом примере значки предварительного просмотра являются ненужными, так как они не передают никаких сведений.

Поля со списком

• По возможности ограничьте длину входного текста. Например, если допустимый вход является числом от 0 до 999, используйте поле со списком, которое ограничено тремя символами.

• Если существует множество возможных вариантов, сосредоточьтесь на содержимом списка наиболее вероятных вариантов. Так как пользователи могут вводить значения, которые отсутствуют в списке, поля со списком не должны перечислять все варианты, только вероятные варианты или пример представителя.

  

  В этом примере многие допустимые варианты не перечислены, например 15 или полуразмерные шрифты, например 9,5.

Значения по умолчанию

• Выберите самый безопасный (чтобы предотвратить потерю данных или системного доступа) и наиболее безопасный вариант по умолчанию. Если безопасность и безопасность не являются факторами, выберите наиболее вероятный или удобный вариант.
  • Исключение: Отображение пустого значения по умолчанию, если элемент управления представляет свойство в смешанном состоянии, что происходит при отображении свойства для нескольких объектов, которые не имеют одного и того же параметра.

Запросы

Запрос — это метка или короткая инструкция, помещенная в редактируемый раскрывающийся список в качестве значения по умолчанию. В отличие от статического текста, запросы исчезают с экрана, когда пользователи вводят что-то в поле со списком или получают фокус ввода.

Типичный запрос.

Используйте запрос, когда:

• Экранное пространство находится на таком уровне уровня "Премиум", что использование метки или инструкции нежелательно, например на панели инструментов.
• Запрос в первую очередь предназначен для определения цели списка компактным способом. Это не должно быть важной информацией, которую пользователи должны видеть при использовании поля со списком.

Не используйте запросы, чтобы направить пользователей, чтобы выбрать что-то из списка или нажать кнопки. Например, запросы, например "Выбрать параметр" или "Ввести имя файла", а затем нажмите кнопку "Отправить", являются ненужными.

При использовании запросов:

• Нарисуйте текст запроса курсивным серым и реальным текстом в обычном черном цвете. Текст запроса не следует путать с реальным текстом.
• Сохраните краткий текст запроса. Вместо полных предложений можно использовать фрагменты.
• Используйте прописную букву в стиле предложений.
• Не используйте конечные знаки препинания или многоточия.
• Текст запроса не должен быть редактируемым, и он должен исчезнуть после нажатия или вкладки в текстовое поле.
  • Исключение: Отображается запрос, если текстовое поле имеет фокус ввода по умолчанию и исчезает только после того, как пользователь начнет вводить текст.
• Текст запроса восстанавливается, если текстовое поле по-прежнему пусто при потере фокуса ввода.

Неправильный:

В этом примере экранное пространство не находится на уровне "Премиум"; после заполнения редактируемого раскрывающегося списка пользователям трудно вспомнить, что это такое; и текст запроса редактируется и рисуется так же, как и реальный текст.

Рекомендуемые размеры и интервалы

Рекомендуемые размеры и интервалы для раскрывающихся списков и полей со списком.

• Выберите ширину, подходящую для самых длинных допустимых данных. Раскрывающийся список нельзя прокручивать по горизонтали, чтобы пользователи могли видеть только то, что отображается в элементе управления. (Обратите внимание, что поля со списком могут иметь включенные функции AutoScroll.)
• Добавьте дополнительные 30 процентов (до 200 процентов для более короткого текста) для любого текста (но не чисел), который будет локализован.
• Выберите длину списка, которая исключает ненужную вертикальную прокрутку. Так как раскрывающиеся списки отображаются по запросу, их списки должны отображаться до 30 элементов. Редактируемые списки (те, у которых нет кнопки раскрывающегося списка), должны отображаться от 3 до 12 элементов.

Подписи

Метки элементов управления

• Напишите метку как слово или фразу, а не как предложение, и заканчивайте его двоеточием. Исключения:

  • Редактируемые раскрывающиеся списки с запросами, расположенными в расположении места на уровне "Премиум".
  • Если раскрывающийся список или поле со списком подчинено переключателю или флажку и введено его меткой, заканчивающейся двоеточием, не поместите в элемент управления дополнительную метку.

• Назначьте уникальный ключ доступа для каждой метки. Рекомендации см. в разделе "Клавиатура".

• Используйте прописную букву в стиле предложений.

• Поместите метку слева или над элементом управления и выровняйте ее по левому краю элемента управления. Если метка находится слева, вертикально выровняйте текст метки с текстом элемента управления.

  Правильно:

  В этом примере метка правильно выравнивается с текстом элемента управления.

  Неправильный:

  В этом примере метка неправильно выравнивается с текстом элемента управления.

• Можно указать единицы (секунды, подключения и т. д.) в скобках после метки.

• Не делайте содержимое раскрывающегося списка или поля со списком (или метки его единиц) частью предложения, так как это не локализуется.

Текст параметра

• Назначьте уникальное имя каждому параметру.
• Используйте прописную букву в стиле предложений, если элемент не является правильным существительным.
• Напишите метку как слово или фразу, а не как предложение и не используйте конечные знаки препинания.
• Используйте параллельную фразу и попытайтесь сохранить длину примерно одинаковой для всех параметров.

Обучающий текст

• Если вам нужно добавить инструктивный текст о раскрывающемся списке или поле со списком, добавьте его над меткой. Используйте полные предложения с конечными знаками препинания.

• Используйте прописную букву в стиле предложений.

• Дополнительные сведения, которые полезны, но не нужны, должны быть короткими. Поместите эти сведения в круглые скобки между меткой и двоеточием или без скобок под элементом управления.

  

  В этом примере показаны дополнительные сведения, размещенные под элементом управления.

Документация

При обращении к раскрывающимся спискам:

• Используйте точный текст метки, включая прописную букву, но не включайте символ подчеркивания или двоеточия клавиши доступа; включите список или поле, в зависимости от того, что является более понятным.
• Для параметров списка используйте точный текст параметра, включая его прописную букву.
• В программировании и другой технической документации см. раскрывающийся список как раскрывающийся список. Везде в другом месте используйте список или поле, что бы ни было понятнее.
• Чтобы описать взаимодействие с пользователем, нажмите кнопку мыши.
• По возможности отформатируйте параметры метки и списка с помощью полужирного текста. В противном случае поместите метку и параметры в кавычки, только если это необходимо для предотвращения путаницы.

Пример. В списке "Размер шрифта " щелкните "Крупные шрифты".

При обращении к полям со списком:

• Используйте точный текст метки, включая прописную букву, но не включайте символ подчеркивания или двоеточия клавиши доступа; включите поле слова.
• Для параметров списка используйте точный текст параметра, включая прописную букву.
• В программировании и другой технической документации ознакомьтесь с полями со списком как поля со списком. Везде в другом месте используйте поле.
• Чтобы описать взаимодействие с пользователем, используйте ввод.
• По возможности отформатируйте параметры метки и списка с помощью полужирного текста. В противном случае поместите метку и параметры в кавычки, только если это необходимо для предотвращения путаницы.

Пример. В поле "Шрифт" введите нужный шрифт.