Цель: Изучение компонентов Button, Shape, Bevel, Edit, Label

Лабораторная работа №3.

Тема: Создание простейшего приложения «Светофор»

Цель: Изучение компонентов Button, Shape, Bevel, Edit, Label.

Краткие теоретические сведения.

Компонент Bevel предназначен для внешнего оформления формы. Стиль отображения Bevel определяется свойством Style, которое может принимать значения bsLowered — утопленный, и bsRaised — приподнятый. А контур компонента определяется свойством Shape, которое может принимать значения: bsBox — прямоугольник, bsFrame — рамка, bsSpacer — пунктирная рамка, bsTopLine, bsBottomLine, bsLeftLine, bsRightLine — соответственной верхняя, нижняя, левая и правая линии. В зависимости от значения Style линии могут быть утопленными или выступающими.

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

Другое существенное свойство компонента — Brush (кисть). Это свойство является объектом типа TBrush, имеющим ряд подсвойств, в частности: цвет (Brush.Color) и стиль (Brush.Style) заливки фигуры. Третье из специфических свойство компонента Shape — Pen (перо), определяющее стиль линий.

Простейшей и, пожалуй, наиболее часто используемой кнопкой является кнопка Button, расположенная на странице библиотеки Standard.

Основное с точки зрения внешнего вида свойство кнопки — Caption (надпись). В надписях кнопок можно предусматривать использование клавиш ускоренного доступа, выделяя для этого один из символов надписи. Перед символом, который должен соответствовать клавише ускоренного доступа, ставится символ амперсанта «&». Этот символ не появляется в надписи, а следующий за ним символ оказывается подчеркнутым. Тогда пользователь может вместо щелчка на кнопке нажать в любой момент клавишу Alt совместно с клавишей выделенного символа.

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

Свойство Cancel, если его установить в true, определяет, что нажатие пользователем клавиши Esc будет эквивалентно нажатию на данную кнопку. Это свойство целесообразно задавать равным true для кнопок «Отменить» в различных диалоговых окнах, чтобы можно было выйти из диалога, нажав на эту кнопку или нажав клавишу Esc.

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

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

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

Label1.Caption:= 'Новый текст';

Цвет фона определяется свойством Color, а цвет надписи — подсвойством Color свойства Font.

Компонент Edit предназначен для отображения, ввода и редактирования однострочных текстов. Имеется возможность оформления объемного бордюра. Основное свойство — Text. Это свойство можно устанавливать в процессе проектирования или задавать программно.

Свойство PasswordChar позволяет превращать окно редактирования в окно ввода пароля. По умолчанию значение PasswordChar равно #0 — нулевому символу. В этом случае это обычное окно редактирования. Но если в свойстве указать иной символ (например, символ звездочки «*»), то при вводе пользователем текста в окне будут появляться именно эти символы, а не те, которые вводит пользователь.

Ход работы.

1. Для начала запустим Delphi. При этом автоматически будет создан новый проект с формой. Давайте назовём форму "Светофор". Для этого в Инспекторе объектов на вкладке Свойства находим свойство Caption и задаём заголовок окна Светофор.

2. Из вкладки Additional палитры компонентов, вставляем на форму компонент Bevel и располагаем его так, чтобы он служил как обрамление для светофора

3. Выделим компонент Bevel и из вкладки Additional вставим компонент Shape.

В Инспекторе объектов на вкладке Свойства компонента Shape, в свойстве Shape стоит наименование stRectangle, меняем его на stEllipse. (для того чтобы изменить свойства компонента, его нужно выбрать, для этого достаточно щелкнуть по нему мышкой). Далее выбираем этот компонент снова и выбираем в меню Правка / Копировать, а затем 2 раза Правка / Вставить - теперь у нас стало 3 таких компонента.

4. Из вкладки Standart палитры компонентов, вставляем на форму компонент Button (Кнопка). Описанным выше образом размножим кнопки до количества 3.

В Инспекторе объектов первой кнопки находим свойство Caption и задаём ему название "Красный", второй кнопки "Желтый", а третьей "Зелёный". Шрифт надписи на кнопке можно изменить, щелкнув по свойству кнопки Fonts. Теперь всё это красиво расположим на форме (как на рисунке).

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

procedure TForm1.Button1Click(Sender: TObject);

begin

Shape1.Brush.Color:=clRed; //свойство Brush определяет заливку объекта

Shape2.Brush.Color:=clWhite;

Shape3.Brush.Color:=clWhite;

end;

Это означает следующее – при щелчке на первой кнопке цвет первого «глаза» светофора изменится на красный, остальные – на белый.

Аналогично поступаем с остальными кнопками. Для «Желтой» кнопки:

Shape1.Brush.Color:=clWhite;

Shape2.Brush.Color:=clYellow;

Shape3.Brush.Color:=clWhite;

и для «Зеленой»

Shape1.Brush. Color:=clWhite;

Shape2.Brush. Color:=clWhite;

Shape3.Brush. Color:=clGreen;

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

В обработчике события OnMouseDown каждого из «глаз» поместим код:

shape1.Top:= shape1.Top+10; // элемент переместится на 10 единиц вниз по вертикали – вернется на место

Это событие возникает, когда пользователь нажал левую клавишу мыши на объекте.

В обработчике события OnMouseUp напишем:

shape1.Top:= shape1.Top-10; // элемент переместится на 10 единиц вверх по вертикали

Это событие возникает, когда пользователь отпустил левую клавишу мыши.

!!!!Не забудьте поменять номера компонентов shape2, shape3.

7. Для непонятливых сделаем подсказку.

Свойству ShowHint каждого из компонентов Shape («глаза светофора») установим значение True. В свойстве Hint напишем сам текст подсказки, например, «Нажми меня!» или любое другое, подходящее к данному случаю.

8. Усложняем наше приложение. Сделаем так, чтобы при запуске приложения на экране появлялось окно с запросом пароля.

Создайте новую форму, нажав на кнопку Новая форма.

Для Form1 (нашей первой, главной формы, не забудьте щелкнуть по ней, выбрав в качестве объекта) в обработчике события OnShow (При появлении) напишем:

procedure TForm1.FormShow(Sender: TObject);

begin

form2.Showmodal

end;

Это означает, что при появлении окна-формы1 на экран выскочит окно-форма-2.

Зададим заголовок форме «Смена пароля». Подсвойству biSystemMenu свойства BorderIcons формы (подсвойства появляются, когда нажмешь на плюсик) зададим значение false. Это означает, что никаких кнопок в заголовке окна не будет.

Добавим в список переменных модуля Unit2 переменную логического типа. Для этого необходимо нажать на кнопку Показать список модулей (Ctrl+F12) и выбрать в списке нужный.

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

var

Form2: TForm2;

f:boolean;

В обработчике события OnCreate form2 запишем код:

procedure TForm2.FormCreate(Sender: TObject);

begin

f:=false

end;

При создании формы переменная f инициализируется с начальным значением false.

Для обработчика события OnClose:

procedure TForm2.FormClose(Sender: TObject; var Action: TCloseAction);

begin

if f=false then form1.close;

end;

Таким образом, если какой-то умник нажмет Alt+F4 для закрытия окна ввода пароля, он ничего не добьется – автоматически закроется и главная форма, если пароль не был введен правильно.

9. Поместите на Form2 компонент Label (Метка). Определите для него шрифт MS Sans Serif 12 полужирный (для того, чтобы изменить шрифт необходимо щелкнуть мышкой по кнопке с тремя точками напротив свойства Font компонента в Инспекторе объектов). Разместим на новой форме еще два компонента – кнопку Button и поле для ввода текста Edit. Переименуем и разместим их как показано на рисунке.

Удалим текст из свойства Text компонента Edit, установим его свойство AutoSize в false, а свойству PasswordChar присвоим значение *

В обработчике события OnClick для кнопки Button1 напишем код:

procedure TForm2.Button1Click(Sender: TObject);

Begin

if edit1.Text='secret' then

Begin

f:=true; form2.Close;

End

else showmessage('Пароль введен неверно!')

end;

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

Выполнить самостоятельно:

1. Сделать так, чтобы при нажатии Enter в окне ввода пароля было аналогично нажатию кнопки ОК. (Для этого используем событие OnKeyPress для компонента Edit1).

2. Измените заголовок окна сообщения о неправильном вводе пароля на «Ошибка!». При неправильном вводе пароля фокус должен возвращаться в поле ввода.

3. Сделайте так, чтобы при троекратном неправильном вводе окно автоматически закрывалось.

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

Создание игры «Поймай кнопку»