Назад Оглавление Дальше Свойство Canvas и класс TCanvas. Алгоритм простейшей анимации


Многие объекты имеют свойство Canvas (холст, канва), которое используется для рисования различных линий: эллипсов, прямоугольников и т.п. - на поверхности соответствующего объекта, для задания свойств фона и для вывода текста. Свойство Canvas относится к классу TCanvas, поэтому нужно в справочной системе Делфи рассмотреть (кратко) этот класс.

Основые методы класса TCanvas:

Для настройки параметров линии, используемой для рисования этих фигур требуется св-во Canvas.Pen. Рассмотрим основные св-ва класса TPen:

Основые свойства класса TCanvas:

Вы можете увидеть примеры использования Canvas в программах:

А также скачать файлы учебных проектов, использующих Canvas (все файлы проекта в архиве .RAR, каждый архив по 200Кб): Однако для серьезной анимации лучше использовать технологию Flash. (Для просмотра должен быть установлен плагин для Вашего броузера)

Алгоритм простейшей анимации

Простейшая анимация - это просто движение неизменной фигуры (рисунка) относительно некоторого фона. При помощи свойств и методов класса TCanvas простейшую анимацию можно сделать так:

  1. Нарисовать где-либо эту фигуру. Пусть координаты верхнего-левого угла охватывающего (описанного) прямоугольника: X,Y и фигура эта - прямоугольник высотой H, шириной B. Нарисовать его можно так: canvas.rectangle(X,Y,X+B,Y+H);
  2. Выдержать некоторую паузу чтобы глаз успел воспринять фигуру (например, 50 мсек ) . Для этого удобно использовать компоент Timer, т е настроить Timer1.Interval = 50.
  3. Стереть фигуру (для этого можно ее повторно нарисовать в том же месте цветом фона или использовать метод FillRect - наверное, это быстрее)
  4. Изменить координаты для рисования на небольшую величину (например, шаг dx=dy=2)
  5. Нарисовать фигуру в новом месте. Т е для нашего прямоугольника:
    X:= X+dx; Y:= Y+dy; canvas.rectangle(X,Y,X+B,Y+H);
  6. Повторять пункты 1 - 5, пока фигура не приедет в конечную позицию.
Все эти действия нужно поместить в тело метода Timer1Timer. Полный текст модуля unit1.pas, создающего эту анимацию:
unit Unit1;

interface

uses
  Windows, Messages, SysUtils, Variants, Classes,
  Graphics, Controls, Forms, Dialogs, StdCtrls, ExtCtrls;

type
  TForm1 = class(TForm)
    Timer1: TTimer;
    Button1: TButton;
    procedure Button1Click(Sender: TObject);
    procedure Timer1Timer(Sender: TObject);
  private
    { Private declarations }
  public
    { Public declarations }
  end;

var
  Form1: TForm1;

implementation

{$R *.dfm}
const H = 50; B = 100; dx=2; dy=2;
var X,Y: integer;

procedure TForm1.Button1Click(Sender: TObject);
begin
  X:= 10; Y:= 10;
  canvas.Rectangle(x,y,x+b,y+h);
  timer1.Enabled:= true;
end;

procedure TForm1.Timer1Timer(Sender: TObject);
var rr: trect;
{type
  TRect = packed record
  case Integer of
    0: (Left, Top, Right, Bottom: Integer);
    1: (TopLeft, BottomRight: TPoint);
end; }
begin
 rr.Left:= x;  rr.top:= y;
 rr.right:= x+b; rr.bottom:= y+h;
 canvas.FillRect(rr);
 x:= x+dx; y:=y+dy;
 canvas.Rectangle(x,y,x+b,y+h);
 if ((x + b) > clientwidth) or
  ((y+h) > clientheight )
  then
  timer1.enabled:= false;
end;
end.
а все файлы этого проекта можно скачать здесь

Можно сделать анимацию проще, если двигать (менять координаты) объекта Image, который содержит картинку. В этом случае не нужно заботиться о стирании и рисовании. Нужно просто изменить координату, сделать паузу и т д. Например, можно переделать проект ТИР (заменить присвоение случайных чисел в качестве координат - числами, которые меняются плавно, описывая траекторию движения).

Назад Дальше

Rambler's Top100
Hosted by uCoz