Интерфейс в стиле Windows 95

После знакомства с основными управляющими элементами Visual Basic мы займемся разработкой программ, которые бы выглядели и вели себя так же, как коммерческие приложения для Windows 95 и Windows NT.

Интерфейсные функции большинства приложений Windows обеспечиваются пятью элементами: деревом (Tree View), табличным списком (List View), списком изображений (Image List), строкой состояния (Status Bar) и панелями инструментов. Первые четыре элемента рассматриваются в последующих разделах. Панелями инструментов мы займемся в уроке 5, «Создание и использование меню и панелей инструментов».

На рис. 3.18 изображено окно Проводника Windows. В нем присутствуют все перечисленные элементы.

Интерфейс в стиле Windows 95 - student2.ru

Рис. 3.18. Проводник Windows

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

Панель в левой части окна содержит элемент-дерево. Само название элемента прекрасно описывает его назначение: этот элемент отображает информацию в виде иерархического дерева.

Справа находится табличный список. Он предназначен для вывода списков объектов. Этот элемент обычно используется в сочетании с деревом, в нем выводится содержимое текущей выделенной папки дерева.

В нижней части окна находится строка состояния. Она выполняет несколько функций. В частности, на ней выводятся количество выделенных объектов, системная дата и/или время, а также объем свободного места на диске.

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

Дерево

Интерфейс в стиле Windows 95 - student2.ru В дереве (см. рисунок) выводится иерархический список папок или других объектов, удобно описываемых в виде древовидной структуры. Деревья часто используются в сочетании с табличными списками (рассматриваемыми в следующем разделе), в которых выводится содержимое текущей выделенной папки.

Свойства деревьев

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

Appearance Height MouseIcon SingleSel
BorderStyle HelpContextID MousePointer Sorted
CausesValidation HideSelection Name Style
CheckBoxes HotTracking Nodes Tablndex
Container hWnd Object TabStop
DragIcon ImageList OLEDragMode Tag
DragMode Indentation OLEDropMode ToolTipText
DropHighlight Index Parent Top
Enabled LabelEdit PathSeparator Visible
Font Left Scroll WhatsThisHelpID
FullRowSelect LineStyle SelectedItems Width

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

Как всегда, работа с элементом начинается со свойства Name. Для деревьев используется стандартный префикс tvw. Например, если в дереве отображается структура каталогов на диске, его можно назвать tvwDirectories.

Если дважды щелкнуть в строке Custom окна свойств, появляется диалоговое окно со страницами свойств (рис. 3.19).

Интерфейс в стиле Windows 95 - student2.ru

Рис. 3.19. Страницы свойств дерева

Из трех вкладок этого окна наибольший интерес представляет вкладка General.

Вкладка General

Свойство Style определяет внешний вид и поведение элемента. Оно может принимать следующие значения.

Значение Описание
- tvwTextOnly Отображается только текст узла
- tvwPictureText Отображается значок и текст узла
- tvwPlusMinusText Отображаются символы свертывания/развертывания (знаки «плюс» и «минус») и текст узла
- tvwPlusPictireText Отображаются символы свертывания/развертывания, маленький значок слева от текста и сам текст
- tvwTreeLinesText Если взаимосвязанные узлы иерархии должны соединяться линиями, для каждого узла выводятся линии и текст
- tvwTreeLinesPictureText Слева от текста отображается маленький значок, а взаимосвязанные узлы соединяются линиями
- tvwTreeLinesPlusMinusText Отображаются символы свертывания/развертывания, соединительные линии и текст узла
- tvwTreeLinesPlusMinusPictureText Для каждого узла отображается все возможное

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

Значение Описание
0 - TreeLines Основные линии дерева
1 - RootLines Линии между корневыми узлами (в дополнение к основным)

ПОДСКАЗКАУзел представляет собой объект, который может состоять из графики и текста. Как вы вскоре убедитесь, узлы используются как в деревьях, так и в табличных списках.

Логическое свойство Label Ed it позволяет разрешить или запретить автоматическое редактирование надписи элемента. Чтобы понять, о чем идет речь, щелкните на имени папки или файла в окне Проводника Windows. Надпись превращается в миниатюрное текстовое поле, в котором можно отредактировать имя. Значение True разрешает редактирование надписей, а значение False запрещает его. Чтобы включить в дерево графические изображения, свойству ImageList необходимо присвоить имя существующего элемента-списка изображений (см. далее в этом Уроке).

Свойства BorderStyle и Appearance определяют тип рамки и имитацию объема при выводе элемента.

Свойство OLEDragMode задает режим перетаскивания (ручной или автоматический). Оно может иметь одно из следующих значений:

0 - OLEDragManual

1 – OLEDragAutomatic

Свойство OLEDropMode разрешает или запрещает для дерева сбрасывание объектов при перетаскивании OLE. Оно принимает одно из следующих значений (см. следущую страницу).

Свойство Indentation определяет отступ, то есть горизонтальное расстояние между узлами соседних уровней. Чем меньше его значение, тем ближе располагаются узлы. Если вы стремитесь к компактности интерфейса, я могу порекомендовать значение 283 - оно хорошо смотрится во время выполнения программы.

Значение Описание
0 - OLEDropNone Целевой компонент не принимает сбрасываемый объект и отображает курсор, запрещающий сбрасывание
1 - OLEDropManual Элемент допускает сбрасывание OLE, при этом программист должен обработать эти операции в коде программы

Свойство PathSeparator позволяет задать или узнать символ-разделитель для пути, возвращаемого свойством Full Path узла:

Private Sub TreeViewi_NodeClick(ByVal Node As Node)

Dim rc as String

rc = Node.FullPath

MsgBox rc

End Sub

Например, при выводе списка папок на жестком диске обычно используется разделитель \ (обратная косая черта). А при выводе структуры IP-адресов локальной сети стоит выбрать символ . (точка).

Установите свойство Scroll в True, если вы хотите, чтобы дерево снабжалось полосами прокрутки. Полосы необходимы в случае, если некоторые узлы не помещаются при выводе. Если свойство Scroll равно False, использование полос прокрутки запрещается.

Наконец, если установить свойство HotTracking в True, текст узла, не укладывающийся в ширину элемента, будет отображаться в виде подсказки (рис. 3.20).

Интерфейс в стиле Windows 95 - student2.ru

Рис. 3.20. Отслеживание полного текста узлов

События деревьев

Ниже приведен список событий, поддерживаемых деревьями.

AfterLabelEdit Expand MouseMove OLEGiveFeedback
BeforeLabelEdit GotFocus MouseUp OLESetData
Click KeyDown NodeCheck OLEStartDrag
Collapse KeyPress NodeClick Validate
DblClick KeyUp OLECompleteDrag  
DragDrop LostFocus OLEDragDrop  
DragOver MouseDown OLEDragOver  

Событие AfterLabelEdit() происходит после завершения редактирования надписи узла, С помощью этого события можно проверить имя узла и убедиться в его правильности. Второе событие, BeforeLabelEdit(), происходит непосредственно перед началом редактирования.

Событие CollapseO происходит при свертывании ветви дерева. Для этого пользователь может дважды щелкнуть на ее корне или щелкнуть на знаке «минус» рядом с корнем ветви. Например, в процедуре этого события можно удалить свернутые объекты из дерева с целью экономии памяти.

Событие Expand() — полная противоположность Collapse(). Оно происходит в тот момент, когда пользователь развертывает ветвь дерева двойным щелчком на ее корне или щелчком на знаке «плюс» рядом с корнем. В процедуре этого события можно динамически загрузить данные в элемент для их отображения в развернутой ветви.

Событие NodeClick() — одно из важнейших событий для дерева. Оно позволяет получить информацию об узле, на котором был сделан щелчок, или выполнить любые другие функции, специфические для вашего приложения. Например, следующий фрагмент:

Private Sub tvwNodes_NodeClick(ByVal Noe As ComctlLib.Node)

MsgBox Node.FullPath

End Sub

отображает диалоговое окно с полным путем к узлу, на котором был сделан щелчок. Если в свойстве PathSeparator был задан символ \, корневой каталог — С:, а щелчок был сделан на узле Windows, то в диалоговом окне будет выведен путь С: \Windows. Событие OLECompleteDrag происходит, когда данные OLE сбрасываются на элемент или операция перетаскивания OLE отменяется.

Событие OLEDragDrop() происходит, когда на элемент сбрасываются данные OLE при свойстве OLEDropMode, установленном в 1 - Manual. Процедура события определяет, как приложение будет обрабатывать сброшенные данные. Вы можете включить в нее код, при котором элемент будет перемещать данные вместо копирования или наоборот — копировать данные вместо их перемещения. Все зависит от специфики вашего приложения.

Событие OLEDragOver происходит при протаскивании данных OLE над элементом. После того как это событие произошло, Visual Basic инициирует событие OLEGive Feed back, чтобы вы могли проверить данные и обеспечить необходимые операции обратной связи для пользователя.

Событие OLEGiveFeedback() происходит после каждого события OLEDragOver(). С его помощью элемент обеспечивает необходимую обратную связь, например изменяет вид указателя мыши и показывает, что произойдет при сбрасывании объекта. Возможны и другие варианты — например, в выделенном объекте (компонента-источника) организуются визуальные признаки, которые подсказывают, что произойдет в результате сбрасывания.

Событие OLESetData() происходит при вызове объектом-приемником метода GetData для объекта DataObject источника.

Наконец, событие OLEStartDrag() происходит, когда пользователь начинает перетаскивать данные из элемента. Если свойство OLEDragMode установлено в 1 - Automatic, элемент автоматически начинает перетаскивание. В процедуре этого события можно занести данные в объект DataObject элемента. В дальнейшем эти данные будут прочитаны элементом-приемником.

Методы деревьев

Элементы-деревья обладают следующими методами:

Drag Move SetFocus StartLabelEdit
GetVisibleCount OLEDrag ShowWhatsThis ZOrder
HitTest Refresh    

Метод GetVisibleCount определяет количество узлов, одновременно просматриваемых в дереве. Не путайте его с общим количеством узлов — речь идет всего лишь о количестве узлов, отображаемых без вертикальной прокрутки элемента. Этот метод поможет вам проверить, удастся ли одновременно вывести в окне конкретное количество узлов.

Метод HitTest определяет, может ли узел использоваться в качестве приемника перетаскивания. Его можно вызвать во время операции перетаскивания OLE, чтобы выделить узел или изменить указатель мыши во время прохождения данных над потенциальным приемником.

Метод OLEDrag инициирует операцию перетаскивания OLE. После этого вызывается событие OLEStartDrag элемента, что позволяет вам передать необходимые данные компоненту-приемнику.

Метод StartLabelEdit используется в том случае, если вы хотите принудительно перевести узел в режим редактирования надписи. Его можно вызывать в особых ситуациях, например когда свойство LabelEdit равно False, но вам необходимо изменить имя некоторого узла. Хороший пример встречается в Проводнике Windows -вы можете изменять имена папок и файлов в дереве, но не сможете переименовать встроенные компоненты (диски, панель управления или сетевое окружение).

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

Табличные списки

Интерфейс в стиле Windows 95 - student2.ru Как я уже говорил, табличный список часто работает в сочетании с деревом. В некоторых ситуациях эти элементы применяются по отдельности, но в этом уроке мы используем их вместе.

Свойства табличных списков

Табличные списки обладают следующими свойствами:

AllowColumnReorder Height Parent
Appearance HelpContextID Picture
Arrange HideColumnHeaders PictureAlignment
BackColor HideSelection SelectedItem
BorderStyle HotTracking SmallIcons
CausesValidation HoverSelection Sorted
CheckBoxes hWnd SortKey
ColumnHeaderlcons Icons SortOrder
ColumnHeaders Index Tablndex
Container LabelEdit TabStop
DragIcon LabelWrap Tag
DragMode Left TextBackground
DropHighlight Listltems ToolTipText
Enabled MouseIcon Top
FlatScrollBar MousePointer Visible
Font MultiSelect WhatsThisHelpID
ForeColor Name Width
FontName Object View
FullRowSelect OLEDragMode  
GridLines OLEDropMode  

Если дважды щелкнуть в строке Custom окна свойств табличного списка, Visual Basic выведет диалоговое окно со страницами свойств элемента (рис. 3.21). В нем содержатся самые полезные свойства, с помощью которых настраивается внешний вид и особенности поведения элемента.

Как всегда, первым задается свойство Name. Для табличных списков часто используется префикс Ivw. Например, если в элементе содержится перечень файлов на жестком диске, элемент можно назвать IvwFiles.

Диалоговое окно состоит из нескольких вкладок. Нас в первую очередь интересуют первые четыре вкладки.

Интерфейс в стиле Windows 95 - student2.ru

Рис. 3.21. Свойства табличного списка

Вкладка General

На первой вкладке, General, содержатся многие свойства, определяющие структуру табличного списка.

Свойство View определяет режим отображения информации в элементе.

Значение Описание
Ivwlcon Объекты списка отображаются в виде крупных значков
IvwList Объекты отображаются в виде, напоминающем обычный список
IvwReport Напоминает IvwList, но для каждого объекта выводится дополнительная информация
IvwSmalllcon Напоминает Ivwlcon, но объекты отображаются в виде мелких значков

Свойство Arrange доступно для чтения и записи. Оно определяет способ упорядочения значков в первом и последнем режимах (крупные и мелкие значки). Свойство Arrange может принимать следующие значения.

Значение Описание
- IvwNone - Значки не упорядочиваются
- IvwAutoLeft Объекты автоматически упорядочиваются в левой части элемента
- IvwAutoTop Объекты автоматически упорядочиваются в верхней части элемента

Логическое свойство Label Edit позволяет разрешить или запретить автоматическое редактирование надписей в элементе. Чтобы понять, о чем идет речь, щелкните на имени папки или файла в окне Проводника Windows. Надпись превращается в миниатюрное текстовое поле, в котором можно отредактировать имя. Значение True разрешает редактирование надписей, a False — запрещает. Свойство OLEDragMode задает режим перетаскивания (ручной или автоматический). Оно может иметь одно из следующих значений:

0 - OLEDragManual

1 – OLEDragAutomatic

Свойство OLEDropMode разрешает или запрещает сбрасывание объектов при перетаскивании OLE для табличного списка. Оно принимает одно из следующих значений.

Значение Описание
0 - OLEDropNone Целевой компонент не принимает сбрасываемый объект и отображает курсор, запрещающий сбрасывание
1 - OLEDropManual Элемент допускает сбрасывание OLE, при этом программист должен обработать эти операции в коде программы

Свойство ColumnHeaders устанавливается в False, когда вы устанавливаете флажок Hide Column Headers (Скрыть заголовки столбцов).

Свойство LabelWrap, доступное для чтения и записи, управляет переносом надписей в режиме отображения значков. Если соответствующий флажок установлен, свойство равно True.

Чтобы пользователь мог выделить сразу несколько объектов, установите в True свойство MultiSelect. Если выделение должно ограничиваться одним объектом, это свойство должно быть равно False.

Свойство FullRowSelect выглядит довольно интересно, потому что при его включении табличный список имитирует поведение электронных таблиц. Если задать этому свойству значение True, элемент выделяет для объекта всю строку, не ограничиваясь текстом объекта.

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

Устанавливая в True свойства GridLines и FullRowSelect, переведите табличный список в режим таблицы. Например, для табличного списка IvwSheet следует воспользоваться следующим фрагментом:

With IvwSheet

.View = IvwReport

.GridLines = True

.FullRowSelect = True

End With

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

Свойство HoverSelection доступно для чтения и записи. Если оно равно True, то задержка указателя мыши над объектом приводит к выделению объекта.

Вкладка Image Lists

На вкладке Image Lists сгруппированы свойства, относящиеся к использованию графики в табличных списках. Чтобы включить графику в табличный список, следует задать в качестве значения свойства ImageList имя существующего элемента-списка изображений (см. далее раздел «Списки изображений»).

Имя списка изображений, указанное в поле Small, назначается свойству SmallIcons табличного списка. Когда табличный список находится в режиме вывода мелких значков, эти значки берутся из списка изображений, определяемого данным свойством.

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

Вкладка Sorting

На вкладке Sorting сгруппированы параметры, относящиеся к сортировке данных в табличном списке.

Флажок Sorted определяет значение одноименного свойства. Если он установлен, табличный список сортирует свои данные. Если флажок снят, свойству Sorted присваивается значение False.

Свойство Sort Key управляет способом сортировки данных в табличном списке. Если это свойство равно 0, данные сортируются по свойству Text объектов. Если его значение положительно, сортировка осуществляется по тексту свойств Subltems.

Свойство SortOrder определяет тип сортировки — по возрастанию или по убыванию. Значение 0 соответствует сортировке по возрастанию, а значение 1 — по убыванию.

Вкладка Column Headers

Поле Index увеличивается при каждом добавлении объекта Column Header в табличный список.

Когда вы заполняете поле Text данной вкладки, Visual Basic задает значение свойства Text объекта ColumnHeader с индексом, указанным в поле Index. В поле Alignment можно указать одно из трех значений:

0 - IvwColumnLeft

1 - IvwColumnRight

2 – IvwColumnCenter

Эти значения определяют тип выравнивания текста в объекте ColumnHeader (соответственно, по левому краю, по правому краю или по центру). Значение, введенное в поле Width, определяет значение свойства Width объекта ColumnHeader. Оно задает ширину заголовка столбца с индексом, указанным в поле Index.

Свойство Key определяет уникальный ключ заголовка столбца в коллекции заголовков. Ключ может быть как числовым, так и текстовым. Его конкретное значение не принципиально — главное, чтобы он был уникальным. В поле Tag задается свойство Tag заголовка столбца. Это свойство используется для xpaнения произвольных данных, которые вы хотите ассоциировать с заголовком столбца.

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

События табличных списков

Ниже перечислены события, поддерживаемые табличными списками.

AfterLabelEdit DragOver KeyUp OLEDragDrop
BeforeLabelEdit GotFocus LostFocus OLEDragOver
Click ItemCheck MouseDown OLEGiveFeedback
ColumnClick ItemClick MouseMove OLESetData
DblClick KeyDown MouseUp OLEStartDrag
DragDrop KeyPress OLECompleteDrag Validate

Как видите, многие события табличных списков совпадают с событиями дерева. Событие After Label Edit также вызывается после того, как вы отредактируете надпись одного из объектов табличного списка. С помощью этого события можно проверить новый текст надписи и убедиться в его правильности. Второе событие, Befоrelabel Edit, происходит непосредственно перед тем, как объект переходит в режим редактирования.

ПРИМЕЧАНИЕОбъекты, отображаемые в табличных списках, состоят из текста и индекса значка. В режиме таблицы элемент также содержит массив строк, называемых вложенными объектами (subitems). В этих строках содержится дополнительная информация об объектах.

Событие ColumnClick происходит, когда пользователь щелкает в заголовке столбца. Заголовком столбца называется кнопка, расположенная над столбцом и содержащая краткое описание его содержимого. В режиме таблицы Проводника Windows отображаются заголовки столбцов Имя, Размер, Тип и Изменен. Вставляя код в процедуру данного события, можно заново отсортировать данные и даже изменить порядок столбцов. Событие ItemClick — одно из важнейших событий для табличных списков. В нем можно получить информацию о том объекте, на котором был сделан щелчок, или выполнить другие функции, отвечающие специфике вашего приложения. По способам применения оно похоже на событие NodeClick элемента-дерева.

Событие OLECompleteDrag происходит, когда данные OLE сбрасываются на элемент или операция перетаскивания OLE отменяется.

Событие OLEDragDrop() происходит, когда на элемент сбрасываются данные OLE при свойстве OLEDropMode, установленном в 1 - Manual. Процедура события определяет, как приложение будет обрабатывать сброшенные данные. Вы можете включить в нее код, при котором элемент будет перемещать данные вместо копирования или наоборот — копировать данные вместо их перемещения. Все зависит от специфики вашего приложения.

Событие OLEDragOver происходит при протаскивании данных OLE над элементом. После того как это событие произошло, Visual Basic инициирует событие OLEGiveFeedback, чтобы вы могли проверить данные и обеспечить необходимые операции обратной связи для пользователя.

Событие OLEGiveFeedback() происходит после каждого события OLEDragOver(). С его помощью элемент обеспечивает необходимую обратную связь — например, изменяет вид указателя мыши и показывает, что произойдет при сбрасывании объекта. Возможны и другие варианты — например, в выделенном объекте (компонента-источника) организуются визуальные признаки, которые подсказывают. что произойдет в результате сбрасывания.

- Событие OLESetData() происходит при вызове объектом-приемником метода GetData для объекта DataObject источника.

Наконец, событие OLEStartDrag() происходит, когда пользователь начинает перетаскивать данные из элемента. Если свойство OlEDragMode установлено в 1 - Automatic, элемент автоматически начинает перетаскивание. В процедуре этого события можно занести данные в объект DataObject элемента. В дальнейшем эти данные будут прочитаны элементом-приемником.

Методы табличного списка

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

Drag HitTest Refresh StartLabelEdit
Findltem Move SetFocus ZOrder
GetFirstVisible OLEDrag ShowWhatsThis  

Многие методы табличных списков совпадают с методами деревьев.

Метод Findltem ищет объекты в элементе. Возможен поиск с точным или частичным совпадением.

Поскольку в табличном списке может одновременно отображаться несколько объектов, метод GetFirstVisible определяет, какой объект будет первым в режиме списка или таблицы.

Метод HitTest определяет, может ли объект использоваться в качестве приемника перетаскивания. Его можно вызвать во время операции перетаскивания OLE, чтобы выделить объект или изменить указатель мыши во время прохождения данных над потенциальным приемником.

Метод OLEDrag инициирует операцию перетаскивания OLE. После этого вызывается событие OLEStartDrag элемента, что позволяет передать необходимые данные компоненту-приемнику.

Метод StartLabelEdit используется в том случае, если вы хотите принудительно перевести объект в режим редактирования надписи. Его можно вызывать в особых ситуациях, например, когда свойство Label Edit равно False, но вам необходимо изменить имя некоторого объекта. Хороший пример встречается в Проводнике Windows - вы можете изменять имена папок и файлов, но не сможете переименовать встроенные компоненты (диски, панель управления или сетевое окружение).

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

Списки изображений

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

Наши рекомендации