Обработка событий, или Ура! Заработала!
Всё в мире состоит из определённого рода событий и наших реакций на них. Например, на улице пошёл дождь и вы открыли зонт. То же самое происходит и в жизни компьютерных приложений. У них также возникают события, которые провоцируют пользователь либо операционная система, и они по-своему на них реагируют согласно заложенному в них программному коду.
Задачи урока
- Обработка события OnClick.
- Научиться назначать компонентам осмысленные имена.
- Работа с компонентом.
Выполнение упражнения
В этом уроке мы напишем первое приложение, реагирующее на событие — нажатие на кнопку. Оно будет состоять из двух кнопок («Ок» и «Закрыть»), одного однострочного редактора Edit и одной метки Label (рисунок 1). При нажатии на первую — «Ок» — в однострочном редакторе появляется надпись «Ура! Заработала!», а при нажатии на — вторую «Закрыть» — приложение закрывается (аналог крестика в правом верхнем углу).
Рисунок 1. Окно приложения
1. Дизайн приложения
- Разместите компоненты, как показано на рисунке 2, и измените их свойство Caption в соответствии с рисунком 1. Как видно из рисунка, на форме находятся один компонент метки Label1, один компонент однострочного редактора Edit1 и две кнопки Button1 и Button2.
- У компонента Edit1 очистите свойство Text.
Рисунок 2
2. Назначение компонентам имён
- Поменяйте свойства Name у всех компонентов, как показано ниже:
Имя, которое было |
Имя, на которое
необходимо изменить |
Для чего мы так сделали ? |
Form1 |
Form1 |
Ничего не изменили, т. к. форма одна. А если мы уберём 1, то будет ошибка, т. к. слово Form — зарезервировано |
Label1 |
Label1 |
Также ничего не изменили ( метка одна ). Если уберём 1, то будет ошибка, т. к. слово Label — зарезервировано |
Edit1 |
editOut |
Out — означает вывод. Т. е. в этот компонент будем выводить текст |
Button1 |
buttonOk |
Ok — обычно так называется кнопка, выполняющая какое-либо действие |
Button2 | buttonExit |
Exit (Выход) — кнопка, которая завершает работу приложения |
- Откройте окно Дерево объектов. Посмотрите, как изменились имена (рисунок 3). Теперь вы можете выбирать компоненты через дерево, уже точно зная, что делает каждый компонент.
Рисунок 3
3. Обработка событий
Итак, на форме мы расположили две кнопки, метку и однострочный редактор.
Рассмотрим самое распространённое событие большинства приложений — это нажатие на кнопку. Называется оно OnClick. Обработаем это событие на кнопках ButtonOk и ButtonExit .
- Выберите кнопку ButtonOk (через окно Дерево объектов, либо непосредственно на форме).
- Активируйте окно Инспектор объектов, щёлкнув на нём мышью (либо клавишей F11, если он находится не в пределах видимости).
- В Инспекторе объектов откройте вкладку Events и два раза щёлкните по правому столбцу напротив события OnClick (находится почти в самом верху). В результате среда Delphi автоматически сгенерирует процедуру с именем ButtonOkClick (Листинг 1).
Текст этой процедуры будет находиться в специальном окне кода.
Имя процедуры состоит из имени кнопки и названия события. Оно генерируется автоматически и может быть изменено пользователем непосредственно в окне Инспектор объектов. Нам не требуется его изменять, т. к. оно и так вполне осмысленное (ButtonOkClick читается как «Кнопка Ок Щелчок»).
procedure TForm.ButtonOkClick(Sender: TObject); begin end;
Листинг 1
Теперь между зарезервированными словами begin end можно записать действие, которое произойдет, если нажать на кнопку.
- Чтобы отобразить в компоненте с именем EditOut текст «Ура! Заработала!», необходимо записать код:
procedure TForm.ButtonOkClick(Sender: TObject); begin EditOut.Text:='Ура! Заработала!'; end;Листинг 2
- Создайте процедуру для события OnClick кнопки ButtonExit. Это событие должно приводить к завершению работы приложения. Для этого в созданной процедуре ButtonExitClick необходимо обратиться к методу Close (переводится как «закрыть») для нашей формы (Form1). Код процедуры выглядит следующим образом:
procedure TForm.ButtonExitClick(Sender: TObject); begin Form1.Close; end;
Листинг 3
- Теперь запустите проект и, нажимая на кнопки, насладитесь торжеством разума!
4. Коротко о главном
Для работы с событиями служит вкладка Events окна Инспектор объектов. Там перечислены все события для выбранного компонента.
Самое распространённое событие большинства компонентов — OnClick (нажатие на компонент).
5. Выполнение задания
Особенности задания
- Перед размещением компонентов на форме желательно нарисовать их расположение на листе бумаги.
- Кнопка выхода из приложения — обязательна, хотя в заданиях она не указана.
- В заданиях второго уровня сложности вам потребуется Оператор условного перехода.
Задания I уровня сложности
1. Создайте приложение «Разговор с миром» с полем ввода Edit и двумя кнопками: «Привет» и «Пока». При нажатии на кнопку «Привет» в поле ввода должна появиться надпись «Здравствуй, мир», а при нажатии на кнопку «Пока» — «До свидания, мир».
2. Создайте приложение с полем ввода Edit и двумя кнопками: «Имя» и «Очистить». При нажатии на кнопку «Имя» в компоненте Edit должно отобразиться ваше имя. А при нажатии на кнопку «Очистить» поле ввода должно быть очищено.
3. Создайте приложение «Заголовок, который ты выбираешь!». В поле ввода Edit пользователь заносит текст, и при нажатии на кнопку этот текст должен отобразиться в заголовке формы, которая изначально имеет надпись «впиши своё название».
4. Создайте приложение, где в поле ввода Edit пользователь заносит текст. При нажатии на кнопку этот текст должен отобразиться в компоненте Label, который изначально имеет надпись «Нет сообщений».
5. Создайте приложение «Меню» с полем ввода Edit и тремя кнопками: «Первое», «Второе» и «Компот». При нажатии на кнопку «Первое» в поле ввода отображается первое блюдо, например, суп. При нажатии на кнопку «Второе» — второе блюдо, например, каша. При нажатии на кнопку «Компот» — в поле ввода появляется текст «и компот !!!».
6. Создайте приложение с двумя метками Label и двумя кнопками: «Заголовок1» и «Заголовок2». При нажатии на кнопку «Заголовок1» заголовок формы меняется на содержимое первой метки. При нажатии на кнопку «Заголовок2» — на содержимое второй метки.
7. Создайте приложение «Царский приказ» с меткой Label и двумя кнопками: «Казнить», «Помиловать». При нажатии на кнопку «Казнить» текст метки становится «КАЗНИТЬ, нельзя помиловать!», а при нажатии на кнопку «Помиловать» — «Казнить нельзя, ПОМИЛОВАТЬ!»
8. Создайте приложение с меткой Label и двумя кнопками: «Красный», «Синий». При нажатии на кнопку «Красный» в метке должен отобразиться текст «красный» и цвет метки должен измениться на красный. При нажатии на кнопку «Синий» — текст «синий» и цвет метки, соответственно, синий.
9. Создайте приложение «Русско-английская поддержка» с двумя кнопками. Вначале на первой кнопке должно быть написано «English», а на второй кнопке — «Русский». При нажатии на первую кнопку названия кнопок меняются на «English» и «Russian», а при нажатии на вторую кнопку — на «Английский» и «Русский» для первой и второй кнопки соответственно.
Задания II уровня сложности
1. Создайте приложение «Переключатель» с меткой Label и кнопкой. Вначале на кнопке должно быть написано «Включить», а в метке — «Выключено». Нажатие на кнопку приводит к появлению текста «Включено», а надпись на кнопке меняется на «Выключить». Повторное нажатие возвращает исходный текст «Выключено», а надпись на кнопке снова становится «Включить».