Модуль 2. Форма и основные элементы управления

Модуль 2. Форма и основные элементы управления

1.  Форма

2.  Метка

3.  Командная кнопка

4.  Текстовое поле

5.  Флажки, переключатели, фреймы

6.  Списки

7.  Полосы прокрутки

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

1.  Форма

Форма (Form) – контейнер, содержащий другие элементы управления, аналог окна Windows.

Некоторые свойства:

Name: по умолчанию Form1

Caption: заголовок формы

BackColor: цвет фона

Picture: путь доступа к файлу, являющемуся фоном формы

WindowState: состояние окна (в виде пиктограммы, нормального размера, во весь экран)

BorderStyle: стиль обрамления формы, возможность изменять ее размеры, наличие кнопок управления окном

MaxButton, MinButton: определяют доступность кнопок развернуть, свернуть во время работы приложения

StartUpPosition: задает расположение формы на экране при работе приложения

Некоторые события: Click, DblClick, ReSize (при изменении размера), Load, Unload (в момент загрузки/выгрузки формы из памяти), MouseDown, MouseUp (нажатие/отпускание кнопки мыши).

Пример: после щелчка по форме ее размеры уменьшаются вдвое, и ее фон становится синим (проект «Свойства формы»).

Основное внимание при создании данного проекта уделим технологии создания кода.

Вызов окна Редактора кода:

· 

выполнить двойной щелчок по объекту, для которого создаем процедуру. Ниже представлен текст в окне Code, образовавшийся в результате двойного щелчка по командной кнопке с именем Command1:

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

·  командой View ® Code. В окне кода можно выбрать из списка событий нужное (появится заготовка для процедуры) и набрать команды процедуры.

В нашем примере в окне Редактора кода выберем в левом списке объект Form, а в правом – событие Click и наберем три команды внутри появившейся заготовки процедуры.

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

2.  Метка

Метка (Label) – элемент управления, применяемый для вывода информации. Другое название объекта - этикетка.

Некоторые свойства: Name: по умолчанию Label1

Caption: информация, выводимая в метку

BorderStyle: стиль обрамления

Alignment: выравнивание

Font: тип, размер шрифта

ForeColor: цвет шрифта

Некоторые события: Click, DblClick, Change (изменение содержимого)

Пример: после двойного щелчка по метке в ней появляется слово “Щелчок”, расположенное по центру. Для его написания использован полужирный курсив с подчеркиванием (проект «Метка»).

3.  Командная кнопка

Командная кнопка (Command Button) – элемент, применяемый для интерактивного управления работой приложения.

Некоторые свойства:

Name: по умолчанию Command1

Caption: надпись на кнопке

Picture: путь доступа к файлу с изображением, помещаемым на кнопку

Style: стиль оформления (Standart – на кнопке будет текст, заданный в свойстве Caption; Graphical - на кнопке будет изображение, заданное в свойстве Picture);

Font: тип и размер шрифта

Некоторые события: Click

Пример: после щелчка по кнопке
у формы изменяется заголовок.

4.  Текстовое поле

Текстовое поле (Text Box) – элемент управления, применяемый для ввода и вывода информации.

Некоторые свойства:

Name: по умолчанию Text1

Text: содержимое текстового поля

Alignment: выравнивание; Font: тип и размер шрифта; ForeColor: цвет шрифта

MultiLine: многострочный текст

ScrollBar: наличие и вид полос прокрутки

PasswordChar: символ, заменяющий (скрывающий) вводимые в текстовое поле символы

Некоторые события: Click, DblClick, Change, KeyPress (нажатие клавиши)

Пример: после ввода в текстовое поле 5-го символа цвет шрифта станет красным

(проект «Текст»).

5.  Флажки, переключатели, фреймы

1.  Переключатели (Option Button): обычно образуют группу и помещаются внутри фрейма, обеспечивая для пользователя возможность выбора 1 из предложенных вариантов.

Некоторые свойства:

Name: по умолчанию Option1

Caption, BackColor, Alignment, основное свойство Value: значения True/False

2.  Флажки (Check Box): используются для размещения на форме данных, которые могут иметь одно из 2 значений. Если флажки образуют группу, то обеспечивают для пользователя возможность выбора нескольких вариантов из предложенных.

Некоторые свойства:

Name: по умолчанию Check1

Value: значения 0 – сброшен, 1 – установлен, 2 – не доступен

3.  Фрейм (рамка) – элемент управления, который служит контейнером для других элементов управления.

Некоторые свойства:

Name: по умолчанию Frame1,
Caption: надпись вверху рамки

BorderStyle: стиль обрамления (наличие рамки вокруг группы элементов)

Создание группы элементов:

·  разместить на форме фрейм, установить для него необходимые свойства;

·  поместить на форму элемент управления (переключатель, флажок и др.), установить его свойства, вырезать его в буфер обмена;

·  выделить фрейм и вставить элемент из буфера обмена, затем разместить его в нужном месте во фрейме;

·  вставить следующие элементы группы, включив их в массив.

6.  Списки

1.  Обычный список (List Box)

Некоторые свойства:

Name: по умолчанию List1

ListCount: число элементов в списке

ListIndex: номер выбранного элемента списка (нумерация начинается с 0). Если элемент не выбран, значение свойства равно –1.

List: символьный массив, хранящий все элементы списка

Text: значение выбранного элемента

Style: оформление списка (значения 0,1)

Sorted: сортировка элементов списка по возрастанию (свойство можно установить только при проектировании интерфейса).

Заполнение списка:

1.  На этапе проектирования значения элементов вводятся в свойстве List (после каждого значения нажимается сочетание клавиш Ctrl +Inter)

2.  Во время выполнения приложения используется метод AddItem:

For i=1 to 100

List1.AddItem i ‘список заполняем числами от 1 до 100

Next i

Удаление элементов из списка:

1.  Для очистки всего списка используется метод Clear (команда List1.Clear)

2.  Для удаления элемента с указанным номером используется метод RemoveItem, например: List1. RemoveItem 5 (удаляется элемент списка с № 5)

2.  Комбинированный список (Combo Box)

Этот элемент позволяет выбирать данные из списка и добавлять новые элементы в текстовое поле списка (сочетает в себе список и текстовое поле).

Некоторые свойства:

Name: по умолчанию Combo1, ListCount, ListIndex, List, Text, Style (0, 1, 2), Sorted

7.  Полосы прокрутки

Элементы VScrollBar, HscrollBar используются для ввода параметра, значения которого изменяются в некотором диапазоне.

Некоторые свойства:

Name: по умолчанию VScroll1 (вертикальная), HScroll1 (горизонтальная)

Value: числовое значение, которое определяется положением бегунка на полосе прокрутки

Min, Max: устанавливают диапазон значений

SmallChange: величина перемещения бегунка при щелчке по стрелкам на краях полосы прокрутки

LargeChange: величина перемещения бегунка при щелчке по полосе прокрутки
(по умолчанию значение 1, рекомендуется выбирать равным 10 процентам от диапазона)

События: Scroll (возникает при перемещении бегунка на полосе прокрутки), Change (возникает после перемещения бегунка в момент отпускания кнопки мыши, после щелчка мыши по стрелке на краях полосы прокрутки, после щелчка мыши по полосе прокрутки).

Пример: проект «Скорость» демонстрирует удобный способ ввода данных во время работы приложения с помощью полосы прокрутки (при перемещении бегунка любым из указанных выше способов соответственно изменяется значение скорости).

Программный код содержит 3 процедуры обработки событий: