Как отобразить рисунок в форме

Для отображения рисунка, например, в форме можно использовать компонент Image, который располагается на вкладке Additional. Основные свойства компонента Image приведены в таблице:

Свойство	Описание
Picture	Позволяет загрузить рисунок в компонент
Top	Задает расстояние по вертикали от верхней части окна, куда помещен компонент, до левого верхнего угла компонента в пикселах
Left	Расстояние по горизонтали от левой части окна, куда помещен компонент, до левого верхнего угла компонента в пикселах
Autosize	Если равен true, рамка автоматически растягивается по размеру рисунка
Transparent	Если равен true, то рисунок прозрачен, т.е. все не закрашенные места прозрачны
Stretch	Если равен true, то рисунок растягивается по рамке
Height	Высота в пикселах
Width	Ширина в пикселах
Align	Выравнивание рисунка относительно окна

Упражнение. Нарисуйте человечка, жука, бабочку, шарик или машинку в Image Editor и с помощью компонента Image поместите рисунок в окне. Установите свойство Transparent=true для задания прозрачности и свойство Autosize=true для того, чтобы рамка автоматически растянулась по размеру рисунка.

Компонент Timer

Для организации движения мы часто будем использовать компонент Timer, который располагается на вкладке System. Событие OnTimer компонента выполняется каждый раз по прошествии интервала времени, заданного в свойстве Interval. Для включения или отключения таймера используется свойство Enabled.

Как заставить картинку двигаться

Можно организовать движение изображения в окне. При этом изображение может двигаться либо хаотично (случайное движение), либо по закону, или может управлять клавиатурой или мышкой. Рассмотрим разные варианты движения изображений.

Случайное движение

Например, изобразить полет бабочки в случайном направлении со случайной скоростью.

Для решения этой задачи поместим в окне компонент Image1:TImage, в свойство Picture компонента загрузим картинку, например изображение бабочки, которое предварительно создадим с использованием редактора Image Editor. Для задания позрачности будем использовать свойство Transparent = true, задать свойство Autosize = true для того, чтобы размер рамки компонента был равен размеру рисунка. Также поместим компонент Timer1:TTimer в область формы. Внешний вид окна на этапе проектирования изображен на рисунке:

Для таймера зададим свойство Interval, например, равным 100. На событие OnTimer напишем обработчик, который и будет выполнять основную функцию организации хаотичного движения бабочки.

При движении бабочки случайно задается направление ее движения и скорость по X и Y, при этом отслеживается, чтобы бабочка не вылетала за границы окна. Обработчик события OnTimer может иметь следующий вид:

procedure TForm1.Timer1Timer(Sender: TObject);

var k:integer;

dx,dy:integer;

begin

k:=random(4)+1; { задает направление движения}

dx:=random(10)+1; dy:=random(10)+1; {скорости по X и Y}

case k of

1: {вверх}

if Image1.top - dy > 0 then

Image1.Top:= Image1.Top - dy;

2: {вниз}

if Image1.top + dy < ClientHeight then

Image1.Top:= Image1.Top + dy;

3: {влево}

if Image1.left - dx > 0 then

Image1.left:= Image1.left - dx;

4: {вправо}

if Image1.left + dx <ClientWidth then

Image1.Left:= Image1.Left + dx;

END;

end;