Лекции по ЧМВ-дополнительные (1022759), страница 6
Текст из файла (страница 6)
Ситуации при работе с кнопкой:
-
Кнопка мыши нажата, курсор на кнопке. Кнопка получает фокус ввода и выделяется, команда не выполняется.
-
Кнопка мыши нажата, курсор не на кнопке. Кнопка теряет фокус ввода и выделение пропадает, команда не выполняется.
-
Кнопка мыши нажата, курсор на кнопке, кнопка отпускается. Команда выполняется, кнопка теряет фокус ввода
Проблемы при работе с кнопками:
-
Размеры и поля. Чем больше кнопка, тем легче попасть в нее курсором. Это правило по мере сил всеми соблюдается, во всяком случае, кнопок размером 5 на 5 пикселей уже практически не встретишь.
-
Пользователю должно быть трудно нажать не на ту кнопку. Добиться этого можно либо изменением состояния кнопки при наведении на неё курсором, либо установлением пустого промежутка между кнопками. Ни тот, ни другой способы не обеспечивают стопроцентной надежности.
-
Несоответствие видимой площади кнопки её действующей площади. В последнее время, кнопки часто реализуют посредством окрашенных ячеек таблицы, в которых размещается текст, являющийся гипертекстовой ссылкой. Проблема заключается в том, что пользователи воспринимают кнопкой всю ячейку, хотя реально «нажимается» лишь малая её часть.
Метки на кнопках. Это могут быть текст или пиктограмма. Сначала о тексте. Все руководства по разработке интерфейса требуют снабжать командные кнопки названиями, выраженными в виде глаголов в форме инфинитива (Прийти, Увидеть, Победить). Кнопка, запускающая действие, недаром называется командной. С её помощью пользователи отдают системе команды. Команда же в русском языке формируется посредством глагола в повелительном наклонении. У глагольных кнопок есть одно большое достоинство. По ним понятно, какое действие произойдет после нажатия. Следует всемерно избегать создания кнопок с ничего не говорящим текстом, поскольку такой текст не сообщает пользователям, что именно произойдет после нажатия кнопки.
Помимо текста, на кнопках можно выводить пиктограммы. Эта возможность редко используется при разработке программ, но очень широко в Интернете. Формально, на таких кнопках пиктограммы не очень хороши из-за того, что они обычно должны передавать пользователям идею действия (т. е. глагол), а действие плохо передается пиктограммами. Конечно, даже и нераспознанная пиктограмма хороша тем, что она обеспечивает ускорение при поиске нужной кнопки (пользователь может помнить, что ему нужна кнопка с синим пятном на пиктограмме). Пиктограммы хороши для тех кнопок, для которых пиктограммы нарисовать легко, и для тех кнопок, которые нужны особенно часто (при этом качество пиктограммы особого значения не имеет, важно только различие пиктограмм между собой).
Также к группе командных кнопок относится кнопка доступа к меню. Идея проста - вставить кнопку, нажатие на которую будет вызывать меню. В самой этой мысли нет ничего плохого, но есть недостатки:
-
Значение кнопки в этом контексте будет менее понятным, чем контекстное меню безо всякой кнопки. Контекстное меню окажется эффективней. Как никак, в кнопку надо попасть курсором, а в меню попадать не надо, достаточно просто нажать правую кнопку мыши.
-
Само использование кнопки в таком исполнении не совсем правильно, поскольку нарушается принцип единообразия: пользователь нажал на кнопку, а действия как такового и нет (не считать же действием появление меню).
Использовать кнопку для инициирования показа меню можно, но не эффективно.
5.2.2. Зависимые переключатели
Зависимый переключатель позволяют пользователю выбрать единственный вариант из множества взаимоисключающих альтернатив (не менее двух). При выборе новой альтернативы ранее выбранная отключается. Зависимый переключатель часто называют радиокнопкой (это связано со сходностью поведения с кнопкой выбора диапазона в радиоприемнике. Радиокнопки объединяются в группы, во включенном состоянии в группе может быть только одна кнопка. Радиокнопка может находиться в одном из двух состояний: включена или выключена. Традиционно для систем с графическим интерфейсом включенное состояние радиокнопки отображается кружком с точкой внутри, а выключенное пустым кружком. Для систем с символьным интерфейсом кружок заменяется парой круглых скобок. Нарушать эти правила нельзя. Желательно радиокнопки в группе располагать вертикально, поскольку это облегчает поиск конкретного элемента.
5.2.3. Независимые переключатели
Независимый переключатель (часто называемый флажком, так как обычно употребляется для установки какого-то признака объекта) позволяет пользователю установить любые из множества параметров объекта (в том числе и одного). Флажок может находиться в одном из трех состояний: включен, выключен или не выбран. Традиционно для систем с графическим интерфейсом включенное состояние флажка отображается квадратом с птичкой внутри, выключенное пустым квадратом, не выбранное - квадратом с птичкой внутри и закраской серым цветом. Для систем с символьным интерфейсом кружок заменяется парой квадратных скобок, а птичка символом х. Нарушать эти правила нельзя. Желательно флажки располагать в группе вертикально , поскольку это облегчает поиск конкретного элемента.
5.3. Списки
5.3.1. Список единичного выбора
5.3.2. Выпадающий список
5.3.3. Расширенный список и список множественного выбора
5.3.4. Модифицируемый список
5.3.5. Модифицируемое дерево
5.3.6. Комбинированный список
Список - средство выбора требуемых объектов или их свойств. Элементы списков могут представлены в текстовой или графической формах. Список должен обеспечивать:
-
Визуализацию сделанного выбора.
-
Поддержку действий, связанных с выбранными пунктами.
Списки разумно использовать при большом количестве вариантов, либо когда перечень может изменяться.
Порядок расположения элементов в списке зависит от содержания, он должен быть удобен пользователю. Для списка имен лучше применять сортировку по алфавиту, для дат лучше использовать хронологический порядок. Если в данной ситуации какой-либо элемент списка не может быть выбран, его не нужно включать в отображаемый пользователю список.
Ширина поля списка должна быть достаточной для отображения пункта средней длины. Если заранее невозможно подобрать такую, то используйте один из следующих подходов:
-
Выберите ширину для размещения самого длинного пункта.
-
Используйте эллипсис (...) в середине или конце длинных названий, но сохранив при этом символы, позволяющие понять пункт. Например, \Образец\...\Пример.
-
Включите в панель списка полосу горизонтальной прокрутки.
Если количество пунктов в списке превышает умещающиеся в поле списка, то включите в поле списка линейку вертикальной прокрутки.
5.3.1. Список единичного выбора
Список единичного выбора (Single Selection ListBox) используется для выбора только одного пункта в списке. Если содержимое списка не умещается в поле списка, то отображается линейка прокрутки, позволяющая просмотреть весь список.
Высота панели списка выбирается для отображения в нем 3...8 пунктов. В окно списка часто включают линейки вертикальной и горизонтальной прокрутки, которые обычно блокируются, если все пункты в списке видимы. Пункт в списке выбирается щелчком по пункту левой кнопкой мыши.
Для клавиатурной навигации по списку обычно применяются клавиши <Home>- в начало, <End> - в конец, <PageUp> - страница вверх, <Page Down> - страница вниз, а также клавиши стрелок.
5.3.2. Выпадающий список
Выпадающий список (Drop Down ListBox) подобен списку единичного выбора и отличается от него только способом отображения данных. Когда список свернут, на экране отображен только выбранный пункт, справа от которого находится кнопка раскрытия списка в виде стрелки. При нажатии на эту кнопку список раскрывается (выпадает вниз), отображаются пункты списка. Такой список иногда называют и раскрывающимся.
Выпадающий список: свернут слева, развернут справа
5.3.3. Расширенный список и список множественного выбора
Расширенный список (Extended ListBox) и список множественного выбора (Multiple Selection ListBox) позволяют выбрать в списке несколько пунктов, например для выполнения над ними одинаковых действий. Пример - список файлов в папке с возможностью выбора нескольких, например, для удаления.
5.3.4. Модифицируемый список
Модифицируемый список (ListView Control) - особая форма расширенного списка. Содержит набор пунктов, каждый из которых включает пиктограмму и текстовую метку. Возможны варианты оформления:
Формат | Описание |
Пиктограмма | Каждый пункт - полноразмерная пиктограмма с текстовой меткой под ней. Пиктограмму можно перемещать мышью в любое место в видимой области списка. Пример - пиктограммы на Рабочем столе Windows. |
Маленькая пиктограмма | Подобно первому, но пиктограмма маленькая, текстовая метка справа. |
Список | Каждый пункт содержит маленькую пиктограмму и текстовую метку справа. Пункты упорядочены в виде столбца заданного формата. Пример - выпадающие меню в приложениях Windows. |
Отчет | Пункты представляют собой строку с нескольким столбцами. В левом столбце размещена маленькая пиктограмм и текстовая метка справа, в остальных столбцах дополнительная информация. Пример - отображение в Проводнике списка файлов с детальным описанием. |
Для создания модифицируемого списка используется специальный редактор, окно которого показано на рис.5.3.4. В группе Items можно выбирать тему или подтему списка. Для новой темы в группе свойств Item Properties задаются Текст темы, номер пиктограммы Image Index и номер статуса State Index (если оно равно -1, то пиктограмма не отображается). Пиктограммы должны находится в компоненте ImageList, доступном редактору, и иметь там те же номера, что и в списке ListView.
Компонента ImageList может быть создана специальным редактором. В нем для создания списка нажимается клавиша Add (добавить). Вызывается окно выбора файла, в котором отыскивается файл нужной пиктограммы, которая отображается в поле Selected Image.
5.3.5. Модифицируемое дерево
Модифицируемое дерево (TreeView Control) - частный случай модифицируемого списка, в котором содержимое отображается с учетом иерархических соотношений между пунктами списка. В дереве допускаются более мощные операции редактирования, чем в модифицируемом списке. Этот компонент создается с помощью специального редактора, окно которого показано ниже. Редактор похож на редактор модифицируемого списка, но поддерживает больше возможностей.
5.3.6. Комбинированный список
Комбинированный список (ComboBox) является комбинацией однострочного редактора текста и списка с одиночным выбором. В поле развернутого списка отображаются строка редактора с кнопкой разворачивания справа и ниже развернутый список. Нажатие на кнопку разворачивания списка меняет его статус (свернут или развернут). При развернутом списке перемещением курсора выбирается элемент списка, щелчок по строке списка переносит ее содержимое в поле редактора для изменения. Отредактированное значение затем может быть использовано программно. В строку редактора заносится свойство текст компонента.
5.4. Текстовые поля
5.4.1. Текстовые поля вывода
5.4.2. Текстовые поля вода и редактирования
5.4.3. Дискретные числовые поля
5.4.4. Поле назначения горячих клавиш
Текстовые поля предназначены для ввода, отображения или редактирования текста. Различают следующие виды текстовых полей:
-
Текстовые поля вывода. Это Метка (Label) и Статический текст (Static Text). Предназначены для отображения однострочного текста. Часто используется для создания поясняющих надписей.
-
Однострочные текстовые редакторы для ввода, отображения и редактирования однострочного текста. Это простой редактор (Edit), иначе называемый строкой ввода, и редактор с маской (MaskEdit), позволяющий фильтровать вводимые данные.
-
Многострочные текстовые редакторы для ввода и/или отображения многострочного текста. Это простой редактор (Memo) и редактор форматируемого текста (RichEdit), отличающийся поддержкой правил RTF (Rich Text Format - Расширенный Текстовый Формат), применяемых для изменения параметров текста (шрифт, цвет и др.).
-
Поля назначения горячих клавиш.
5.4.1. Текстовые поля вывода
Текстовые поля вывода используются для отображения поясняющих надписей, которые могут формироваться в окне приложения при старте программы или заносится программно при ее исполнении. Пользователь не имеет возможности редактировать текст в этих полях. Свойства полей Label и StaticText похожи. Есть небольшая разница в визуализации. Так у поля StaticText можно отобразить границу в рельефной форме.
5.4.2. Текстовые поля ввода и редактирования