Description

This example shows how to use the TCanvas drawing functions and their results.

The TCanvas drawing functions are: DrawArc, DrawBitmap, DrawEllipse, DrawLine, DrawPath, DrawPolygon, DrawRect, DrawRectSides, CreateThumbnail.

To build and test this example, create a Multi-Device Application - Delphi and add the following controls on the form:

A TImage
A TGroupBox with nine TRadioButton objects (a radio button for each function). Change the TRadioButton.Text property for each radio button with the name of a function.
A TButton
A TOpenDialog

The example draws on the canvas of the bitmap. The bitmap is displayed on the TImage.

Code

Add the following code to the OnCreate event handler of the form.

procedure TForm1.FormCreate(Sender: TObject);
begin
  // sets the size of the TBitmap
  Image1.Bitmap.SetSize(Round(Image1.Width), Round(Image1.Height));
  Image1.Bitmap.Clear(TAlphaColors.White);
end;

Add the following code, which makes the drawing area white, to the OnClick event handler of the button.

procedure TForm1.ClearButtonClick(Sender: TObject);
begin
  // clears the canvas
  Image1.Bitmap.Clear(TAlphaColors.White);
end;

Add the following codes to the OnClick event handlers of each radio button.

Code

procedure TForm1.DrawArcClick(Sender: TObject);
var
  p1, p2: TPointF;
begin
  // Sets the center of the arc
  p1 := TPointF.Create(200, 200);
  // sets the radius of the arc
  p2 := TPointF.Create(150, 150);
  Image1.Bitmap.Canvas.BeginScene;
  // draws the arc on the canvas
  Image1.Bitmap.Canvas.DrawArc(p1, p2, 90, 230, 20);
  // updates the bitmap to show the arc
  Image1.Bitmap.Canvas.EndScene;
end;

procedure TForm1.DrawBitmapClick(Sender: TObject);
var
  // MyBitmap is the bitmap to be drawn on the canvas
  MyBitmap: TBitmap;
  // is the area where to draw the bitmap
  // also is the area of the bitmap to be drawn on the canvas
  MyRect: TRectF;
begin
  // loads the bitmap using the TOpenDialog. 
  if OpenDialog1.Execute then
    MyBitmap := TBitmap.CreateFromFile(OpenDialog1.Files[0]);
  // set the  MyRect coordinates
  MyRect := TRectF.Create(50, 30, 150, 200);
  Image1.Bitmap.Canvas.BeginScene;
  // draws on the rectangle specified by MyRect the area from MyBitmap specified by MyRect
  Image1.Bitmap.Canvas.DrawBitmap(MyBitmap, MyRect, MyRect, 20);
  Image1.Bitmap.Canvas.EndScene;
end;

procedure TForm1.DrawEllipseClick(Sender: TObject);
var
  MyRect: TRectF;
begin
  // sets the circumscribed rectangle of the ellipse
  MyRect := TRectF.Create(50, 40, 200, 270);
  // draws the ellipse on the canvas
  Image1.Bitmap.Canvas.BeginScene;
  Image1.Bitmap.Canvas.DrawEllipse(MyRect, 40);
  Image1.Bitmap.Canvas.EndScene;
end;

procedure TForm1.DrawLineClick(Sender: TObject);
var
  p1, p2: TPointF;
begin
  // sets the ends of the line to be drawn
  p1 := TPointF.Create(20, 2);
  p2 := TPointF.Create(350, 400);
  Image1.Bitmap.Canvas.BeginScene;
  // draws the line on the canvas
  Image1.Bitmap.Canvas.DrawLine(p1, p2, 100);
  Image1.Bitmap.Canvas.EndScene;
end;

procedure TForm1.DrawPathClick(Sender: TObject);
var
  path: TPathData;
  MyRect1, MyRect2: TRectF;
begin
  // set the circumscribed rectangle of the ellipse to be add in the path
  MyRect1 := TRectF.Create(90, 100, 230, 300);
  /// sets the rectangle to be add in the path
  MyRect2 := TRectF.Create(70, 90, 220, 290);
  // initializes and creates the path to be drawn
  path := TPathData.Create;
  path.AddEllipse(MyRect1);
  path.AddRectangle(MyRect2, 0, 0, AllCorners);
  Image1.Bitmap.Canvas.BeginScene;
  // draws the path on the canvas
  Image1.Bitmap.Canvas.DrawPath(path, 200);
  Image1.Bitmap.Canvas.EndScene;
end;

procedure TForm1.DrawPolygonClick(Sender: TObject);
var
  p1, p2, p3, p4, p5, p6: TPointF;
  MyPolygon: TPolygon; //System.Math.Vectors unit needed.
begin
  // sets the points that define the polygon
  p1 := TPointF.Create(80, 200);
  p2 := TPointF.Create(225, 30);
  p3 := TPointF.Create(370, 200);
  p4 := TPointF.Create(300, 340);
  p5 := TPointF.Create(150, 340);
  p6 := TPointF.Create(80, 200);
  // creates the polygon
  SetLength(MyPolygon, 6);
  MyPolygon[0] := p1;
  MyPolygon[1] := p2;
  MyPolygon[2] := p3;
  MyPolygon[3] := p4;
  MyPolygon[4] := p5;
  MyPolygon[5] := p6;
  Image1.Bitmap.Canvas.BeginScene;
  // draws the polygon on the canvas
  Image1.Bitmap.Canvas.DrawPolygon(MyPolygon, 50);
  Image1.Bitmap.Canvas.EndScene;
end;

procedure TForm1.DrawRectClick(Sender: TObject);
var
  MyRect: TRectF;
begin
  // sets the rectangle to be drawn
  MyRect := TRectF.Create(50, 40, 200, 270);
  Image1.Bitmap.Canvas.BeginScene;
  // draws the rectangle on the canvas
  Image1.Bitmap.Canvas.DrawRect(MyRect, 30, 60, AllCorners, 100);
  Image1.Bitmap.Canvas.EndScene;
end;

procedure TForm1.DrawRectSidesClick(Sender: TObject);
var
  MyRect: TRectF;
begin
  // sets the rectangle to be customized and drawn
  MyRect := TRectF.Create(50, 40, 200, 270);
  Image1.Bitmap.Canvas.BeginScene;
  // customize the rectangle and draws it on the canvas
  Image1.Bitmap.Canvas.DrawRectSides(MyRect, 50, 20, AllCorners, 40, AllSides,
    TCornerType.Bevel);
  Image1.Bitmap.Canvas.EndScene;
end;

procedure TForm1.CreateThumbnailClick(Sender: TObject);
var
  MyBitmap: TBitmap;
begin
  // loads the bitmap using the TOpenDialog. 
  if OpenDialog1.Execute then
    MyBitmap := TBitmap.CreateFromFile(OpenDialog1.Files[0]);
  // draws a thumbnail with given sizes
  Image1.Bitmap :=  MyBitmap.CreateThumbnail(300,300);