Mac OS X Human Interface Guidelines / Руководство по проектированию пользовательских интерфейсов для Мак ОС X: Chapter 8 — UI Element Guidelines: Controls

Использование элементов Интерфейса Пользователя: Элементы управления

LIAL 24.11.11 в 08:59

Элементы управления - это графические объекты интерфейса, которые служат причиной для выполняемого действия или какого-либо видимого результата, когда пользователь использует их. В Mac OS X фреймворк ApplicationKit (сокр. AppKit) обеспечивает стандартными элементами стиля Aqua, которые вы можете использовать в вашем приложении, такие как кнопки, радио переключатели, флажки, поля ввода и списки.

LIAL 24.11.11 в 09:05

Общие рекомендации в использовании Элементов управления

LIAL 24.11.11 в 09:06

Вам настоятельно рекомендуется использовать стандартные элементы управления Aqua в вашем приложении, этим вы получите два главных преимущества:

LIAL 24.11.11 в 09:09

* Пользователю быстро понять, какой элемент управления как работает, не тратя на это времени.

tucvbif 12.06.12 в 20:39

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

tucvbif 12.06.12 в 20:39

Не следует использовать элементы разных размеров в одном окне. У многих элементов управления есть версии в трёх размерах: обычный, малый и миниатюрный. Чаще всего следует использовать элементы обычного размера. Когда требуется экономить место, к примеру на палитрах или [within a pane], можно использовать малые или (реже) миниатюрные элементы. Изредко в закладках можно использовать малые элементы, окружённые окном с большими элементами, лучше, чтобы в одном окне не такого не наблюдалось. (Заметьте, что во всех закладках окна элементы управления долны быть одного размера)

tucvbif 12.06.12 в 20:39

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

tucvbif 12.06.12 в 20:39

Следует использовать шрифт, установленный системой. К примеру, элементы обычного размера используют обычный размер шрифта для отображаемого текста, например «ОК» на кнопке или названии строки всплывающего меню. При использовании Interface Builder автоматически выставляется нужный размер шрифта для стандартного элемента управления.

tucvbif 12.06.12 в 20:39

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

tucvbif 12.06.12 в 20:40

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

tucvbif 12.06.12 в 20:40

По этой причине не следует измерять элементы из этого документа и использовать при построении интерфейсов. При использовании Interface Builder правильные размеры выставляются автоматически.

tucvbif 12.06.12 в 20:40

Элементы управления для рамки окна

tucvbif 12.06.12 в 20:40

Для использовании в рамке окна (панелях инструментов в верхней и нижней части окна) служит небольшой набор специальных элементов. Эти элементы перечислены в таблице 8.1

tucvbif 12.06.12 в 20:40

Таблица 8.1 вид и стиль элемента управления, разработанного для использования в рамке окна:

tucvbif 12.06.12 в 20:40

Элемент (имя в API) |Стиль |пример

tucvbif 12.06.12 в 20:40

Выпуклая кнопка (NSButton)|NSTexturedRounded-BezelStyle|[<o>]</o>

tucvbif 12.06.12 в 20:40

Выпуклый переключатель(NSSegmentedControl)|NSSegmentStyle-TexturedRounded|[#|=|H|o]

tucvbif 12.06.12 в 20:41

Выпуклое всплывающее меню (NSPopUpButton с атрибутом PopUp)|NSTexturedRounded-BezelStyle|[Элемент1 :]

tucvbif 12.06.12 в 20:41

Выпуклое выпадающее меню (NSPopUpButton с атрибутом PopDown)|NSTexturedRounded-BezelStyle|[Элемент А v]

tucvbif 12.06.12 в 20:41

Строка поиска(NSSearchField)|нет (выставляется автоматически)|(q )

tucvbif 12.06.12 в 20:41

*Заметьте, что можно использовать стиль NSTexturedRoundedBezelStyle, чтобы разместить меню действий на панели управления (подробнее см. «Action Menu» (стр. 247))

tucvbif 12.06.12 в 20:41

Большинство из этих типов элементов можно видеть на рисунке ниже.

tucvbif 12.06.12 в 20:42

--

tucvbif 12.06.12 в 20:42

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

tucvbif 12.06.12 в 20:42

Также не стоит использовать элементы в стандартном стиле Aqua в панели инструментов. Все элементы и стили, не перечисленные в таблице 8.1 не предназначены для использования в верхней или нижней панели инструментов, за исключением кнопки-значка, подходящей для обоих случаев. В приложениях, предназначенных для работы под Mac OS X v10.7 этот тип кнопки зарезервирован для работы в панели инструментов окон настройки. Подробнее о разработке значков для кнопок-значков см. «Designing Toolbar Icons» (стр. 180). Об использовании кнопок-значков см. «Icon Button» (стр. 231))

tucvbif 12.06.12 в 20:42

Если в окне есть нижняя панель инструментов (что нетипично), следует использовать элементы для рамки окна и там. Подробнее см. «Providing a Bottom Bar» (стр. 179).

tucvbif 12.06.12 в 20:42

Не следует использовать одновременно текст и значки. Кнопка панели инструментов может содержать текст или значок. Также и переключатели могут одновременно содержать и текст и значок, но лучше не совмещать текст и значки в одной панели переключателя.

tucvbif 12.06.12 в 20:42

Interface Builder позволяет легко добавлять значки на кнопку, такие как плюс, символ аккаунта и замок. Некоторые из этих символов можно увидеть в панели инструментов Finder-а. Подробнее о системных значках см. «System-Provided Icons» (стр. 303), а о разработке собственных значков — «Designing Toolbar Icons» (стр. 108).

tucvbif 12.06.12 в 20:42

--

tucvbif 12.06.12 в 20:42

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

tucvbif 12.06.12 в 20:42

Если необходимо отображать текст внутри элемента панели инструментов, это должно быть [noun (or noun phrase)], описывающее объект, настройку или состояние, либо глагол (или словосочетание с глаголом), описывающий действие. [Характерно для английского языка] Заглавные буквы проставляются как в заголовке (подробнее см. «Capitalizing Labels and Text» (стр. 289)).

tucvbif 12.06.12 в 20:42

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

tucvbif 12.06.12 в 20:42

Также, если на панели инструментов есть элемент с фиксацией состояния, у него должны быть две подписи. Одна из них для нажатого (включенного) и другая — для отпущенного (выключенного) состояния. И наконец, каждое из этих состояний должно быть снабжено справочным тегом, вне зависимости от того, расположен ли элемент управления в основной или нижней панели. Подробнее о внешнем виде нажатой кнопки см. «Appearance and Behavior» (стр. 234).

tucvbif 12.06.12 в 20:42

К примеру, в Mail есть кнопка, позволяющая переключаться между активным и автономным режимом (показанная на рисунке в нажатом состоянии). После нажатия на кнопку, под которой написано «Go Offline» подпись сменится на «Go Online», а кнопка переключится в отпущенное состояние.

tucvbif 12.06.12 в 20:42

--

tucvbif 12.06.12 в 20:42

Чтобы установить фиксацию на кнопку панели инструментов, отображающуюся по умолчанию во включенном состоянии, следует использовать объект NSSegmentedControl вместе со стилем NSSegmentStyleTexturedRounded в режиме NSSegmentSwitchTrackingSelectAny. Если используется Interface Builder, следует поместить объект Segmented Control на нужную панель инструментов. В атрибутах инспектора нужно выставить стиль Textured Rounded и режим Select Any. Убедитесь, что для элемента задан значок (в Interface Builder следует выбрать значок в инспекторе атрибутов).

tucvbif 12.06.12 в 20:42

Чтобы установить сегментный переключатель с выбранным элементом, следует применить стиль NSSegmentStyleTexturedRounded и режим NSSegmentSwitchTrackingSelectAny к элементу NSSegmentedControl. В Interface Builder же следует установить элемент Segmented Control на панель инструментов в верхней или нижней части окна, а на вкладке атрибутов Инспектора следует установить стиль Textured Rounded и режим Select Any. Проверьте значки на переключателе (в Interface Builder для этого нужно выбрать изображение из меню изображения в инспекторе атрибутов)

tucvbif 11.02.13 в 18:44

Кнопки

tucvbif 12.06.12 в 20:43

Кнопки нужны для запуска какого-либо действия. В Mac OS X есть несколько видов кнопок, предназначенных для тех или иных задач. При разработке интерфейса пользователя следует убедиться, что выбран правильный тип кнопки, соответствующий задаче. Рекомендации в этой секции помогут правильно выбрать тип кнопки.

tucvbif 12.06.12 в 20:43

Важно: кнопки, описанные в этом разделе подходят для основной части окна, а не для панелей инструментов, за исключением кнопки-значка, которая используется в панели выбора страниц окна настроек. Об элементах управления, предназначенных для использования в панелях инструментов см. «Window-Frame Controls» (стр. 225).

tucvbif 12.06.12 в 20:43

Основная кнопка.

tucvbif 12.06.12 в 20:43

Кнопка основного типа предназначена для запуска тех или иных действий в приложении.

tucvbif 12.06.12 в 20:43

--

tucvbif 12.06.12 в 20:43

Кнопи разработаны для использования в основной части окна, а не в панелях инструментов. О панелях инструментов см. «Window-Frame Controls» (стр. 225).

tucvbif 12.06.12 в 20:43

Кнопки доступны в Interface Builder. Чтобы создать кнопку без него, нужно создать объект NSButton типа NSMomentaryPushInButton или NSMomentaryLightButton. Заметьте, что стиль кнопки NSTexturedRoundedBezelStyle предназначен для использования в панелях инструментов.

tucvbif 12.06.12 в 20:43

Внешний вид и поведение

tucvbif 12.06.12 в 20:43

В кнопке всегда должен находиться текст, без изображений.

tucvbif 12.06.12 в 20:43

Все кнопки не окрашены ни в какой цвет, за исключением кнопки по умолчанию в диалоге (которая предназначена для запуска безопасных действий по кнопке Return или Enter, подробнее см. «Dismissing Dialogs» (стр. 205)). На рисунке ниже можно увидеть две кнопки: «OK» и «Отмена».

tucvbif 12.06.12 в 20:43

--

tucvbif 12.06.12 в 20:43