10866

Компонент Timer Создание простейшей анимации

Лабораторная работа

Информатика, кибернетика и программирование

Лабораторная работа № 4 Компонент Timer Создание простейшей анимации Вывод иллюстраций. Наиболее просто вывести иллюстрацию которая находится в файле с расширением bmp jpg или ico можно при помощи компонента image значок которого находится на вкладке Additional палитры рис....

Русский

2013-04-02

294.5 KB

10 чел.

Лабораторная работа № 4

«Компонент Timer Создание простейшей анимации»

Вывод иллюстраций. 

Наиболее просто вывести иллюстрацию, которая находится в файле с расширением bmp, jpg или ico, можно при помощи компонента image, значок которого находится на вкладке Additional палитры (рис. 10.11).

Рис. 10.11. Значок компонента Image

В табл. 10.8 перечислены основные свойства компонента image.

Таблица 10.8. Свойства компонента image

Свойство

Определяет

Picture Width, Height

AutoSize

Strech

Visible

Иллюстрацию, которая отображается в поле компонента

Размер компонента. Если размер компонента меньше размера иллюстрации, и значение свойств AutoSize и strech равно False, то отображается часть иллюстрации

Признак автоматического изменения размера компонента в соответствии с реальным размером иллюстрации

Признак автоматического масштабирования иллюстрации в соответствии с реальным размером компонента. Чтобы было выполнено масштабирование, значение свойства AutoSize должно быть False

Отображается ли компонент, и, соответственно, иллюстрация, на поверхности формы

Иллюстрацию, которая будет выведена в поле компонента image, можно задать как во время разработки формы приложения, так и во время работы программы.

Во время разработки формы иллюстрация задается установкой значения свойства picture путем выбора файла иллюстрации в стандартном диалоговом окне, которое появляется в результате щелчка на командной кнопке Load окна Picture Editor (рис. 10.12). Чтобы запустить Image Editor, нужно в окне Object Inspector выбрать свойство Picture и щелкнуть на кнопке с тремя точками.

Если размер иллюстрации больше размера компонента, то свойству strech нужно присвоить значение True и установить значения свойств width и Height пропорционально реальным размерам иллюстрации.

Чтобы вывести иллюстрацию в поле компонента image во время работы программы, нужно применить метод LoadFromFile к свойству Picture, указав в качестве параметра имя файла иллюстрации. Например, инструкция

Form1.Image1.Picture.LoadFromFile('e:\temp\bart.bmp')

загружает иллюстрацию из файла bart.bmp и выводит ее в поле вывода иллюстрации (imagel).

Метод LoadFromFile позволяет отображать иллюстрации различных графических форматов: BMP, WMF, JPEG (файлы с расширением jpg).

Следующая программа, ее текст приведен в листинге 10.6, использует компонент image для просмотра иллюстраций, которые находятся в указанном пользователем каталоге. Диалоговое окно программы приведено на рис. 10.13.

Рис. 10.12. Окно Picture Editor

Рис. 10.13. Слайд-проектор

Листинг 10.6. Слайд-проектор

unit shpic_;

interface

uses

Windows, Messages, SysUtils, Classes,

Graphics, Controls, Forms,

Dialogs, ExtCtrls, StdCtrls, Menu

type

TForm1 = class(TForm) Image1: ТImage;

Button1: TButton;

procedure FormActivate(Sender: TObject);

procedure ButtonlClick(Sender: TObject);

private

{ Private declarations }

public

{ Public declarations }

end;

var

Form1: TForm1;

aSearchRec : TSearchRec;

aPath : String; // каталог, в котором находятся иллюстрации

aFile : String; // файл иллюстрации

iw,ih: integer; // первоначальный размер компонента Image

implementation

$R *.DFM}

// изменение размера области вывода иллюстрации

// пропорционально размеру иллюстрации

Procedure Scalelmage;

var

pw, ph : integer; // размер иллюстрации

scaleX, scaleY : real; // масштаб по Х и Y

scale : real; // общий масштаб

begin

// иллюстрация уже загружена

// получим ее размеры

pw := Form1.Image1.Picture.Width;

ph := Form1.Image1.Picture.Height;

if pw > iw // ширина иллюстрации больше ширины компонента Image

then scaleX := iw/pw // нужно масштабировать

else scaleX := 1;

if ph > ih // высота иллюстрации больше высоты компонента

then scaleY := ih/ph // нужно масштабировать

else scaleY := 1;

// выберем наименьший коэффициент

if scaleX < scaleY

then scale := scaleX

else scale := scaleY;

// изменим размер области вывода иллюстрации

Form1.Image1.Height := Round(Form1.Image1.Picture.Height*scale)

Form1.Image1.Width := Round(Form1.Image1.Picture.Width*scale);

// т. к. Strech = True и размер области пропорционален

// размеру картинки, то картинка масштабируется без искажений

end;

// вывести первую иллюстрацию

procedure FirstPicture;

var

r : integer; // результат поиска файла

begin

aPath := 'f:\temp\';

r := FindFirst(aPath+'*.bmp',faAnyFile,aSearchRec);

if г = 0 then

begin // в указанном каталоге есть bmp-файл

aFile := aPath + aSearchRec.Name;

Form1.Image1.Picture.LoadFromFile(aFile); // загрузить

// иллюстрацию

Scalelmage; //-установить размер компонента

Image r := FindNext(aSearchRec); // найти следующий файл 

if r = 0 then // еще есть файлы иллюстраций

Forml.Button1.Enabled := True;

end;

end;

// вывести следующую иллюстрацию 

Procedure NextPicture();

var

r : integer;

begin

aFile := aPath + aSearchRec.Name;

Forml.Image1.Picture.LoadFromFile(aFile);

Scalelmage;

// подготовим вывод следующей иллюстрации

r := FindNext(aSearchRec); // найти следующий файл

if r<>0

then // больше нет иллюстраций

Forml.Buttonl.Enabled := False;

end;

procedure TForml.FormActivate(Sender: TObject);

begin

Image1.AutoSize := False; // запрет автоизменения размера компонента

Image1.Stretch := True; // разрешим масштабирование

// запомним первоначальный размер области вывода иллюстрации

iw := Imagel.Width;

in := imagel.Height;

Button1.Enabled := False; // сделаем недоступной кнопку Дальше

FirstPicture; // вывести первую иллюстрацию

end;

//щелчок на кнопке Дальше

procedure TForm1.Button1Click(Sender: TObject);

begin

NextPicture;

end;

end.

Программа выполняет масштабирование выводимых иллюстраций без искажения, чего нельзя добиться простым присвоением значения True свойству strech. Загрузку и вывод первой и остальных иллюстраций выполняют соответственно процедуры FirstPicture и NextPicture. Процедура FrirstPicture использует функцию FindFirst для того, чтобы получить имя первого BMP-файла. В качестве параметров функции FindFirst передаются:

  •  имя каталога, в котором должны находиться иллюстрации;
  •  структура asearchRec, поле Name которой, в случае успеха, будет содержать имя файла, удовлетворяющего критерию поиска;
  •  маска файла иллюстрации.

Если в указанном при вызове функции FindFirst каталоге есть хотя бы один BMP-файл, значение функции будет равно нулю. В этом случае метод LoadFromFiie загружает файл иллюстрации, после чего вызывается функция scaieimage, которая устанавливает размер компонента пропорционально размеру иллюстрации. Размер загруженной иллюстрации можно получить, обратившись к свойствам Form1.Image1.Picture.Width и Form1.Шmage1.Picture.Height, значения которых не зависят от размера компонента Image.

Битовые образы

При работе с графикой удобно использовать объекты типа TBitMap (битовый образ). Битовый образ представляет собой находящуюся в памяти компьютера, и, следовательно, невидимую графическую поверхность, на которой программа может сформировать изображение. Содержимое битового образа (картинка) легко и, что особенно важно, быстро может быть выведено на поверхность формы или области вывода иллюстрации (image). Поэтому в программах битовые образы обычно используются для хранения небольших изображений, например, картинок командных кнопок.

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

Например, если в программе объявлена переменная pic типа TBitMap, то после выполнения инструкции

pic.LoadFromFiie('е:\images\aplane.bmp')

битовый образ pic будет содержать изображение самолета.

Вывести содержимое битового образа (картинку) на поверхность формы или области вывода иллюстрации можно путем применения метода Draw к соответствующему свойству поверхности (canvas). Например, инструкция

Image1.Canvas.Draw(x,у, bm)

выводит картинку битового образа bm на поверхность компонента image 1 (параметры х и у определяют положение левого верхнего угла картинки на поверхности компонента).

Если перед применением метода Draw свойству Transparent объекта TBitMap присвоить значение True, то фрагменты рисунка, окрашенные цветом, совпадающим с цветом левого нижнего угла картинки, не будут выве-

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

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

Листинг 10.7. Использование битовых образов

unit aplanes_; interface

uses

Windows, Messages, SysUtils, Classes,

Graphics, Controls, Forms, Dialogs;

type

TForml = class(TForm)

procedure FormPaint(Sender: TObject);

private

{ Private declarations }

public

{ Public declarations }

end;

var

Forml: TForm1;

sky,aplane: TBitMap; // битовые образы: небо и самолет

implementation

($R *.DFM}

procedure TForm1.FormPaint(Sender: TObject);

begin

// создать битовые образы 

sky := TBitMap.Create;

aplane := TBitMap.Create;

// загрузить картинки

sky.LoadFromFile('sky.bmp');

aplane.LoadFromFile('aplane.bmp') ;

Form1.Canvas.Draw(0,0,sky); // отрисовка фона

Form1.Canvas.Draw(20,20,aplane); // отрисовка левого самолета

aplane.Transparent:=True;

// теперь элементы рисунка, цвет которых совпадает с цветом

// левой нижней точки битового образа, не отрисовываются Form1.Canvas.Draw(120,20,aplane);

// отрисовка правого самолета

// освободить память sky.free; aplane.free;

end;

end.

После запуска программы в окне приложения (рис. 10.14) появляется изображение летящих на фоне неба самолетов. Фон и изображение самолета -битовые образы, загружаемые из файлов. Белое поле вокруг левого самолета показывает истинный размер картинки битового образа aplane. Белое поле вокруг правого самолета отсутствует, т. к. перед его выводом свойству Transparent битового образа было присвоено значение True.

Рис. 10.14. Влияние значение свойства Transparent на вывод изображения

Мультипликация

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

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

Следующая простая программа, текст которой приведен в листинге 10.8, а вид формы — на рис. 10.15, демонстрирует движение окружности от левой к правой границе окна программы.

Рис. 10.15. Форма программы Движущаяся окружность

Листинг 10.8. Движущаяся окружность

unit mcircle_;

interface

uses

Windows, Messages, SysUtils, Classes,

Graphics, Controls, Forms,

Dialogs, ExtCtrls, StdCtrls;

type

TForm1 = class(TForm) Timer1: TTimer;

procedure Timer1Timer(Sender: TObject};

procedure FormActivate(Sender: TObject);

private

{ Private declarations }

public

{ Public declarations }

end;

implementation

{$R *.DFM}

var

Form1: TForml;

x,y: byte; // координаты центра окружности

dx: byte; // приращение координаты x при движении окружности

// стирает и рисует окружность на новом месте

procedure Ris;

begin

// стереть окружность

form1.Canvas.Pen.Color:=form1.Color;

form1.Canvas.Ellipse(x,y,x+10,y+10);

x:=x+dx;

// нарисовать окружность на новом месте

form1.Canvas.Pen.Color:=clBlack;

form1.Canvas.Ellipse(x,y, x+10, y+10) ;

end;

// сигнал от таймера

procedure TForm1.Timer1Timer(Sender: TObject);

begin Ris; end;

procedure TForm1.FormActivate(Sender: TObject);

begin

x:=0;

y:=10;

dx:=5;

timer1.Interval:=50;

// период возникновения события OnTimer —0.5 сек

form1.canvas.brush.color:=forml.color;

end;

end.

Основную работу выполняет процедура Ris, которая стирает окружность и выводит ее на новом месте. Стирание окружности выполняется путем перерисовки окружности поверх нарисованной, но цветом фона.

Для обеспечения периодического вызова процедуры Ris в форму программы добавлен невизуальный компонент Timer (таймер), значок которого находится на вкладке System палитры компонентов (рис. 10.16). Свойства компонента Timer, перечислены в табл. 10.9.

Рис. 10.16. Значок компонента Timer

Таблица 10.9. Свойства компонента Timer

Свойство

Определяет

Name Interval

 

Enabled

Имя компонента. Используется для доступа к компоненту Период генерации события OnTimer. Задается в миллисекундах

Разрешение работы. Разрешает (значение True) или запрещает (значение False) генерацию события OnTimer

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

Компонент Timer генерирует событие OnTimer. Период возникновения события OnTimer измеряется в миллисекундах и определяется значением свойства Interval. Следует обратить внимание на свойство Enabled. Оно дает возможность программе "запустить" или "остановить" таймер. Если значение свойства Enabled равно False, то событие OnTimer не возникает.

Событие onTimer в рассматриваемой программе обрабатывается процедурой TimeriTimer, которая, в свою очередь, вызывает процедуру Ris. Таким образом, в программе реализован механизм периодического вызова процедуры
Ris.

Примечание

Переменные х, у (координаты центра окружности) и dx (приращение координаты х при движении окружности) объявлены вне процедуры Ris, т. е. они являются глобальными. Поэтому надо не забыть выполнить их инициализацию (в программе инициализацию глобальных переменных реализует процедура FormActivate).

Метод базовой точки

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

1. Выбирается некоторая точка изображения, которая принимается за базовую.

2. Координаты остальных точек отсчитываются от базовой точки.

3. Если координаты точек изображения отсчитывать от базовой в относительных единицах, а не в пикселах, то обеспечивается возможность масштабирования изображения.

На рис. 10.17 приведено изображение кораблика. Базовой точкой является точка с координатами (X0 Y0). Координаты остальных точек отсчитываются именно от этой точки.

 

Рис. 10.17. Определение координат изображения относительно базовой точки

В листинге 10.9 приведен текст программы, которая выводит на экран изображение перемещающегося кораблика.

Листинг 10.9. Кораблик

unit ship_;

interface

uses

Windows, Messages, SysUtils, Classes,

Graphics, Controls, Forms, Dialogs,

StdCtrls, ExtCtrls;

type

TForm1 = class(TForm)

Timer1: TTimer;

procedure Timer1Timer(Sender: TObject);

procedure FormActivate(Sender: TObject);

private

{ Private declarations } public

{ Public declarations } end;

var

Form1: TForm1;

x,y: integer; // координаты корабля (базовой точки)

implementation

{$R *.DFM}

// вычерчивает кораблик

procedure Titanik(x,y: integer; // координаты базовой точки

color: TColor); // цвет корабля 

const dx = 5; dy = 5;

var

buf: TColor;

begin

with form1.canvas do begin

buf:=pen.Color; // сохраним текущий цвет

pen.Color:=color;

// установим нужный цвет

// рисуем . . .

// корпус MoveTo(x,y);

LineTo(x,y-2*dy) ;

LineTo (x+10*dx, y-2*dy) ;

LineTo (x+ll*dx, y-3*dy) ;

LineTo (x+17*dx,y-3*dy) ;

LineTo (x+14*dx, y) ;

LineTo (x,y) ;

// надстройка 

MoveTo(x+3*dx,y-2*dy) ;

LineTo (x+4*dx, y-3*dy) ;

LineTo (x+4*dx, y-4*dy) ;

LineTo (x+13*dx,y-4*dy) ;

LineTo (x+13*dx, y-3*dy) ;

MoveTo(x+5*dx,y-3*dy) ;

LineTo (x+9*dx, y-3*dy) ;

// капитанский мостик

Rectangle (x+8*dx, y-4*dy, x+ll*dx, y-5*dy)

// труба

Rectangle (x+7*dx, y-4*dy, x+8*dx, y-7*dy) ;

// иллюминаторы

Ellipse (x+ll*dx,y-2*dy,x+12*dx,y-l*dy) ;

Ellipse (x+13*dx, y-2*dy, x+14*dx, y-l*dy) ;

// мачта

MoveTo(.x+10*dx,y-5*dy) ; LineTo(x+10*dx,y-10*dy);

// оснастка

MoveTo(x+17*dx,y-3*dy);

LineTo(x+10*dx,y-10*dy);

LineTo(x,y-2*dy);

pen.Color:=buf; // восстановим старый цвет карандаша

end;

end;

// обработка сигнала таймера

procedure TForm1.Timer1Timer(Sender: TObject);

begin

Titanik(x,y,form1.color); // стереть рисунок 

if x < Form1.ClientWidth

then x := x+5

else begin // новый рейс x := 0;

у := Random(50) + 100;

end;

Titanik(x,у,clWhite); // нарисовать в новой точке end;

procedure TForml.FormActivate(Sender: TObject);

begin

x:=0; y:=100;

Form1.Color:=clNavy;

Timerl.Interval := 50; // сигнал таймера каждые 50 миллисекунд

end;

end.

Отрисовку и стирание изображения кораблика выполняет процедура Titanik, которая получает в качестве параметров координаты базовой точки и цвет, которым надо вычертить изображение кораблика. Если при вызове процедуры цвет отличается от цвета фона формы, то процедура рисует кораблик, а если совпадает — то "стирает". В процедуре Titanik объявлены константы dx и dy, определяющие шаг (в пикселах), используемый при вычислении координат точек изображения. Меняя значения этих констант, можно проводить масштабирование изображения.

Использование битовых образов

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

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

В рассматриваемой программе используется второй подход. Картинка выводится применением метода Draw к свойству canvas компонента Image, a стирается путем копирования (метод copyRect) нужной части фона из буфера на поверхность компонента Image.

Форма программы приведена на рис. 10.18, а текст — в листинге 10.10.

Компонент image используется для вывода фона, а компонент Timer — для организации задержки между циклами удаления и вывода на новом месте изображения самолета.

Листинг 10.10. Летящий самолет

unit anim_;

interface

uses

Windows, Messages, SysUtils,

Classes, Graphics, Controls,

Forms, Dialogs, ExtCtrls, StdCtrls, Buttons;

type

TForm1 = class(TForm)

Timer1: TTimer;

Image1: Tlmage;

procedure FormActivate(Sender: TObject);

procedure Timer1Timer(Sender: TObject);

procedure FormClose(Sender: TObject;

var Action: TCloseAction); private

{ Private declarations } public

{ Public declarations } end;

var

Form1: TForm1;

implementation

{$R *.DFM}

var

Back, bitmap, Buf : TBitMap; // фон, картинка, буфер 

BackRct : TRect; // область фона, которая должна быть

// восстановлена из буфера

BufRet: Trect; // область буфера, которая используется для

// восстановления фона

х,у:integer; // текущее положение картинки

W,H: integer; // размеры картинки

procedure TForm1.FormActivate(Sender: TObject);

begin

// создать три объекта — битовых образа

Back := TBitmap.Create; // фон 

bitmap := TBitmap.Create; // картинка 

Buf := TBitmap.Create; // буфер

// загрузить и вывести фон 

Back.LoadFromFile('factory.bmp');

Form1.Image1.canvas.Draw(0,0,Back);

// загрузить картинку, которая будет двигаться

bitmap.LoadFromFile('aplane.bmp');

// определим "прозрачный" цвет

bitmap.Transparent := True;

bitmap.TransParentColor := bitmap.canvas.pixels[1,1];

// создать буфер для сохранения копии области фона,

// на которую накладывается картинка

W:= bitmap.Width;

Н:= bitmap.Height;

Buf.Width:= W;

Buf.Height:=H;

Buf.Palette:=Back.Palette;

// Чтобы обеспечить соответствие палитр //

Buf.Canvas.CopyMode:=cmSrcCopy;

// определим область буфера, которая

// будет использоваться

// для восстановления фона

BufRct:=Bounds(0,0,W,H);

// начальное положение картинки

х := -W; у := 20;

// определим сохраняемую область фона

BackRct:=Bounds(x,y,W,H); // и сохраним ее

Buf.Canvas.CopyRect(BufRet,Back.Canvas,BackRct);

end;

// обработка сигнала таймера

procedure TForm1.Timer1Timer(Sender: TObject);

begin

// восстановлением фона (из буфера) удалим рисунок

Forml.image1.canvas.Draw(x,у,Buf);

x:=x+2;

if x>fоrm1.Image1.Width then x:=-W;

// определим сохраняемую область фона

BackRct:=Bounds(x,у,W,H);

// сохраним ее копию

Buf.Canvas.CopyRect(BufRct,Back.Canvas,BackRct);

// выведем рисунок

Forml.image1.canvas.Draw(x,y,bitmap);

end;

// завершение работы программы

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

begin

// освободим память, выделенную

// для хранения битовых образов

Back.Free;

bitmap.Free;

Buf.Free;

end;

end.

Рис. 10.18. Форма программы Самолет

Для хранения битовых образов (картинок) фона и самолета, а также копии области фона, перекрываемой изображением самолета, используются объекты типа TBitMap, которые создаются динамически процедурой FormActivate. Эта же процедура загружает из файлов картинки фона (factory.bmp) и самолета (aplane.bmp), а также сохраняет область фона, на которую первый раз будет накладываться картинка.

Сохранение копии фона выполняется при помощи метода CopyRect, который позволяет выполнить копирование прямоугольного фрагмента одного битового образа в другой. Объект, к которому применяется метод CopyRect, является приемником копии битового образа. В качестве параметров методу передаются координаты и размер области, куда должно быть выполнено копирование, поверхность, откуда должно быть выполнено копирование, а также положение и размер копируемой области. Информация о положении и размере копируемой в буфер области фона, на которую будет наложено изображение самолета и которая впоследствии должна быть восстановлена из буфера, находится в структуре BackRct типа TRect. Для заполнения этой структуры используется функция Bounds.

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

Загрузка битового образа из ресурса программы

В приведенной в листинге 10.10 программе битовые образы фона и картинки загружаются из файлов. Это не всегда удобно. Delphi позволяет поместить необходимые битовые образы в виде ресурса в файл исполняемой программы и по мере необходимости загружать битовые образы из ресурса, т. е. из файла исполняемой программы (ЕХЕ-файла).

Создание файла ресурсов

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

Файл ресурсов можно создать при помощи утилиты Image Editor (Редактор изображений), которая запускается выбором команды Image Editor меню Tools.

Для того чтобы создать новый файл ресурсов, надо из меню File выбрать команду New, а затем в появившемся подменю — команду Resource File (Файл ресурсов)

В результате открывается окно нового файла ресурсов, а в строке меню окна Image Editor появляется новый пункт — Resource.

Для того чтобы в этот файл добавить новый ресурс, необходимо выбрать команду New меню Resource и из открывшегося списка — тип ресурса. В данном случае следует выбрать Bitmap (битовый образ). После выбора Bitmap открывается диалоговое окно Bitmap Properties (Свойства битового образа), используя которое можно установить размер (в пикселах) и количество цветов создаваемой картинки.

Нажатие кнопки ОК в диалоговом окне Bitmap Properties вызывает появление элемента Bitmap1 в иерархическом списке Contents. Этот элемент соответствует новому ресурсу, добавленному в файл .

Bitmap1 — это автоматически созданное имя ресурса, которое может быть изменено выбором команды Rename меню Resource и вводом нужного имени. После изменения имени Bitmap1 можно приступить к созданию битового образа. Для этого необходимо выбрать команду Edit меню Resource, в результате чего открывается окно графического редактора.

Графический редактор Image Editor предоставляет программисту стандартный для подобных редакторов набор инструментов, используя которые можно нарисовать нужную картинку. Если во время работы надо изменить масштаб отображения картинки, то для увеличения масштаба следует выбрать команду Zoom In меню View, а для уменьшения — команду Zoom Out. Увидеть картинку в реальном масштабе можно, выбрав команду Actual Size меню View.

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

1. Сначала надо запустить графический редактор, например Microsoft Paint, загрузить в него файл картинки и выделить всю картинку или ее часть. В процессе выделения следует обратить внимание на информацию о размере (в пикселах) выделенной области (Paint выводит размер выделяемой области в строке состояния). Затем, выбрав команду Копировать меню Правка, следует поместить копию выделенного фрагмента в буфер.

2. Далее нужно переключиться в Image Editor, выбрать ресурс, в который надо поместить находящуюся в буфере картинку, и установить значения характеристик ресурса в соответствии с характеристиками картинки, находящейся в буфере. Значения характеристик ресурса вводятся в поля диалогового окна Bitmap Properties, которое открывается выбором команды Image Properties меню Bitmap. После установки характеристик ресурса можно вставить картинку в ресурс, выбрав команду Past меню Edit.

3. После добавления всех нужных ресурсов файл ресурса следует сохранить в том каталоге, где находится программа, для которой этот файл создается. Сохраняется файл ресурса обычным образом, т. е. выбором команды Save меню File. Image Editor присваивает файлу ресурсов расширение res.

Подключение файла ресурсов

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

В общем виде эта директива выглядит следующим образом:

{$R ФайлРесурсов}

где ФайлРесурсов — имя файла ресурсов. Например, директива может выглядеть так:

{$R images.res}

Директиву включения файла ресурсов в файл исполняемой программы обычно помещают в начале текста модуля.

Примечание

Если имена файла модуля программы и файла ресурсов совпадают, то вместо имени файла ресурсов можно поставить "*". В этом случае директива включения файла ресурсов в файл исполняемой программы выглядит так:

{$R *.res}

Загрузить картинку из ресурса в переменную типа TBitMap можно при помощи метода LoadFromResourceName, который имеет два параметра: идентификатор программы и имя ресурса. В качестве идентификатора программы используется глобальная переменная Hinstance. Имя ресурса должно быть представлено в виде строковой константы.

Например, инструкция загрузки картинки в переменную Pic может выглядеть так:

Pic.LoadFromResourceName(Hinstance,'FACTORY') ;

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

Листинг 10.11. Пример загрузки картинок из ресурса

unit aplanel_;

{$R images.res} // включить файл ресурсов interface

uses

Windows, Messages, SysUtils, Classes,

Graphics, Controls, Forms, Dialogs,

ExtCtrls, StdCtrls, Buttons;

type

TForm1 = class(TForm)

Timer1: TTimer;

Image1: ТImage;

procedure FormActivate(Sender: TObject);

procedure Timer1Timer(Sender: TObject);

procedure FormClose(Sender: TObject;

var Action: TCloseAction); private

{ Private declarations } public

{ Public declarations } end;

var

Form1: TForm1;

Back, bitmap, Buf : TBitMap;

// фон, картинка, буфер

BackRct, BufRet: TRect;

// область фона, картинки, буфера

х,у:integer;

// координаты левого верхнего угла картинки

W,H: integer; // размеры картинки

implementation

{$R *.DFM}

procedure TForm1.FormActivate(Sender: TObject);

begin

Back := TBitmap.Create; // фон

bitmap := TBitmap.Create; // картинка

Buf := TBitmap.Create; // буфер

// загрузить из ресурса фон

Back.LoadFromResourceName(HInstance,'FACTORY');

Forml.Image1.canvas.Draw(0,0,Back);

// загрузить из ресурса картинку, которая будет двигаться

bitmap.LoadFromResourceName(HInstance,'APLANE');

bitmap.Transparent := True;

bitmap.TransParentColor := bitmap.canvas.pixels[1,1];

// создать буфер для сохранения копии области фона, на которую

// накладывается картинка

W:= bitmap.Width;

Н:= bitmap.Height;

Buf.Width:= W;

Buf.Height:=H;

Buf.Palette:=Back.Palette; // Чтобы обеспечить соответствие палитр !!

Buf.Canvas.CopyMode:=cmSrcCopy;

BufRct:=Bounds(0,0,W,H);

x:=-W; y:=20;

// определим сохраняемую область фона

BackRct:=Bounds(x,y,W,H); // и сохраним ее

Buf.Canvas.CopyRect(BufRet,Back.Canvas, BackRct);

end;

procedure TForm1.Timer1Timer(Sender: TObject);

begin

// восстановлением фона (из буфера) удалим рисунок Form1.image1.canvas.Draw(x,y, Buf);

x:=x+2;

if x>form1.Image1.Width then x:=-W;

// определим сохраняемую область фона

BackRct:=Bounds(x,у,W,H);

// сохраним ее копию

Buf.Canvas.CopyRect(BufRct,Back.Canvas,BackRct);

// выведем рисунок

Form1.image1.canvas.Draw(x,y,bitmap);

end;

procedure TForm1.FormClose(Sender: TObject;

var Action: TCloseAction);

begin

Back.Free;

bitmap.Free ;

Buf.Free;

end;

end.

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

Просмотр "мультика"

Теперь рассмотрим, как можно реализовать вывод в диалоговом окне программы простого "мультика", подобного тому, который можно видеть в диалоговом окне Установка связи при подключении к Internet .

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

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

Вывести кадр на поверхность формы можно применением метода copyRect к свойству canvas этой формы. Метод CopyRect копирует прямоугольную область одной графической поверхности на другую.

Инструкция применения метода CopyRect в общем виде выглядит так:

Canvas1.CopyRect(Область1, Canvas2, 06ласть2)

где:

  •  canvas1 — графическая поверхность, на которую выполняется копирование;
  •  Canvas2 — графическая поверхность, с которой выполняется копирование;
  •  параметр Область2 —- задает положение и размер копируемой прямоугольной области, а параметр областьi — положение копии на поверхности Canvas1.

В качестве параметров область! и область2 используются структуры типа TRect, поля которых определяют положение и размер области.

Заполнить поля структуры TRect можно при помощи функции Bounds, инструкция обращения к которой в общем виде выглядит так:

Bounds(x,у,Width,Height)

где:

  •  х и у — координаты левого верхнего угла области;
  •  width и Height — ширина и высота области.

Следующая программа, текст которой приведен в листинге 10.12, выводит в диалоговое окно простой мультик — дельфийскую колонну, вокруг которой "летает" некоторый объект. На рис. 10.19 приведены кадры этого мультика (содержимое файла film.bmp).

Диалоговое окно программы приведено на рис. 10.20, оно содержит один единственный компонент — таймер.

Рис. 10.19. Кадры мультика

Рис. 10.20. Форма программы

Тистинг 10.12. Мультик (использование метода CopRect)

unit multik ;

interface

uses

Windows, Messages, SysUtils, Classes,

Graphics, Controls, Forms, Dialogs,

ExtCtrls, StdCtrls;

type

TForm1 = class(TForm)

Timer1: TTimer;

procedure FormActivate(Sender: TObject);

procedure Timer1Timer(Sender: TObject);

private

{ Private declarations }

public

{ Public declarations }

end;

var

Form1l: TForm1;

implementation

($R *.DFM}

const

FILMFILE = 'film2.bmp'; // фильм — bmp-файл 

N_KADR=12; // кадров в фильме (для данного файла)

var

Film: TBitMap; // фильм — все кадры

WKadr,HKadr: integer; // ширина и высота кадра

CKadr: integer; // номер текущего кадра

RectKadr: TRect; // положение и размер кадра в фильме

Rect1 : Trect; // координаты и размер области отображения фильма

procedure TForm1.FormActivate(Sender: TObject);

begin

Film := TBitMap.Create;

Film.LoadFromFile(FILMFILE);

WKadr := Round(Film.Width/N_Kadr);

HKadr := Film.Height;

Rect1 := Bounds(10,10,WKadr,HKadr);

Ckadr:=0;

Form1.Timerl.Interval := 150; // период обновления кадров — 0.15 с

Form1.Timerl.Enabled:=True; // запустить таймер

end;

// отрисовка кадра procedure DrawKadr;

begin

// определим положение текущего кадра в фильме

RectKadr:=Bounds(WKadr*CKadr,0,WKadr,HKadr);

// вывод кадра из фильма

Form1.Canvas.CopyRect(Rect1,Film*.Canvas,RectKadr);

// подготовимся к выводу следующего кадра

CKadr := CKadr+1;

if CKadr = N_KADR then CKadr:=0;:

end;

// обработка сигнала от таймера

procedure TForm1.Timer1Timer(Sender: TObject);

begin

DrawKadr;

end;

end.

Программа состоит из трех процедур. Процедура TForm1. FormActivate создает объект Film и загружает в него фильм — BMP-файл, в котором находятся кадры фильма. Затем, используя информацию о размере загруженного битового образа, процедура устанавливает значения характеристик кадра: высоту и ширину.

После этого создается объект Kadr (типа TBitMap), предназначенный для хранения текущего кадра. Следует обратить внимание, что после создания объекта Kadr принудительно устанавливаются значения свойств width и Height. Если этого не сделать, то созданный объект будет существовать, однако память для хранения битового образа не будет выделена. В конце своей работы процедура TForml. FormActivate устанавливает номер текущего кадра и запускает таймер.

Основную работу в программе выполняет процедура DrawKadr, которая выделяет из фильма очередной кадр и выводит его в форму. Выделение кадра и его отрисовку путем копирования фрагмента картинки с одной поверхности на другую выполняет метод copyRect (рис. 10.21), которому в качестве параметров передаются координаты области, куда нужно копировать, поверхность и положение области, откуда нужно копировать. Положение фрагмента в фильме, т. е. координата х левого верхнего угла, определяется умножением ширины кадра на номер текущего кадра. Запускает процедуру DrawKadr процедура TForm1.Timer1Timer, обрабатывающая событие OnTiner.

Рис. 10.21. Инструкция Canvas1. CopyRect (Rect1, Canvas2, Rect2) копирует в область Rectl поверхности Canvasl область Rect2 с поверхности Canvas2

Задания по вариантам

Создайте анимацию, путем прорисовки каждого кадра на канве компонента Image, через интервал времени, установленный в компоненте Timer.

Примечание. Далее следует номер варианта и описание анимации.

Задание:

  1.  прыгающую кошку;
  2.  идущего пешехода;
  3.  муравья, несущего соломинку;
  4.  взлетающий самолет;
  5.  плывущего кита;
  6.  ползущего паука;
  7.  подметающего дворника;
  8.  движущийся паровоз;
  9.  ползущую гусеницу;
  10.   собаку, бегущую к добыче;
  11.   ползущую змею;
  12.   прыгающего кузнечика;
  13.   собаку, бегающую по любой из диагоналей экрана;
  14.   появляющиеся следы;
  15.   летящую бабочку;
  16.   лист, падающий с дерева;
  17.   пчелу, собирающую нектар с цветов;
  18.   летящий по небу спутник;
  19.   ползущую черепаху;
  20.   летящего комара;


 

А также другие работы, которые могут Вас заинтересовать

34428. Преобразования Петра I в первой четверти XVIII в.: содержание, итоги, последствия 15.24 KB
  Изменения в сословиях: По указу о единонаследии запрещалось делить имения при передаче их по наследству. Изменения в государственном управлении: В 1721 г. Изменения в области культуры: Развивалось просвещение. Произошли изменения во внешнем облике дворян.
34429. Дворцовые перевороты в России в середине XVIII века 30.5 KB
  Причины дворцовых переворотов: Указ Петра I о престолонаследии 1722 г. императором стал внук Петра I Петр II. Императрицей стала племянница Петра I Анна Иоанновна вдова герцога Курляндского. в результате дворцового переворота с помощью гвардии императрицей стала дочь Петра I Елизавета Петровна.
34430. Россия в эпоху Екатерины II. Просвещенный абсолютизм 27.5 KB
  Внутренняя политика. Политика Екатерины II известна как политика просвещенного абсолютизма. Просвещенный абсолютизм – политика сформировавшаяся под влиянием идей философов – просветителей и направленная на организацию общества на основе разумных законов при сохранении абсолютной власти монарха. В результате политика Екатерины II еще больше укрепила крепостнические порядки.
34431. Противоречивость внутренней политики Александра I 32 KB
  После Отечественной войны 1812 года в настроении Александра I произошли большие перемены.Аракчеев поэтому этот период правления Александра I получил название аракчеевщина.
34432. Отечественная война 1812 г. и заграничный поход русской армии (1813 – 1814 гг.) 32 KB
  Причины войны: Россия нарушала условия невыгодного для нее Тильзитского мира и была препятствием на пути Наполеона к мировому господству. На границе с Россией Наполеон сосредоточил 600тысячную армию. – Бородинское сражение в котором Наполеон стремился разгромить русскую армию. Наполеон не достиг своей цели.
34433. Россия в годы правления Николая I 37.5 KB
  в России начинается промышленный переворот – переход от ручного труда к машинному от мануфактуры к фабрике. Турция стремилась вернуть территории утраченные в войнах с Россией Англия и Франция стремились не допустить усиление влияния России на Балканах и Ближнем Востоке. Основные военные действия развернулись в Крыму где противники России высадили десант и осадили Севастополь. Причины поражения России: Военнотехническая отсталость России Дипломатические просчеты: Россия оказалась в изоляции Итоги: Поражение России в Крымской войне...
34434. Реформы 1860 -1870-х гг. и их значение 35.5 KB
  Реформа расчистила дорогу для развития капиталистических отношений но была половинчатой и не решила аграрного вопроса. Другие реформы: год реформа Содержание 1864 Земская реформа В уездах и губерниях создавались выборные органы самоуправления которые решали местные хозяйственные вопросы. 1864 Судебная реформа Создавался бессословный гласный суд с адвокатом и присяжными заседателями. 1864 Реформа образования Образование становилось бессословным.
34435. Россия в начале ХХ в. Революция 1905 – 1907 гг.: причины, этапы, итоги 41.5 KB
  Причины революции 1905 – 1907 гг. Поводом к началу революции послужили события 9 января 1905 г. Этапы и основные события революции: Январьсентябрь 1905 г. – развитие революции по восходящей линии.
34436. Россия в 1906 – 1914 гг. Реформы П.А.Столыпина. Направления, итоги и значение аграрной реформы 32.5 KB
  начала работу I Государственная дума. Аграрную реформу должна была утвердить Государственная дума. начала работу II государственная дума. Дума отказалась утвердить Указ 9 ноября и занялась собственным законотворчеством.