Difference between revisions of "Drawing with canvas"

From Free Pascal wiki
Jump to navigationJump to search
(Don't paint in OnClickCode! Fix coordinate of bottom right pixel of form. Avoid using form variable in form code.)
m (Fixed syntax highlighting)
Line 9: Line 9:
 
The following code draws the diagonals of a form onto its canvas:
 
The following code draws the diagonals of a form onto its canvas:
  
<syntaxhighlight>
+
<syntaxhighlight lang\pascal>
 
procedure TForm1.Form1Paint(Sender: TObject);
 
procedure TForm1.Form1Paint(Sender: TObject);
 
begin
 
begin
Line 19: Line 19:
 
In the Canvas object the <code>Brush</code> and <code>Pen</code> objects are defined, both with a <code>Color</code> property, which indicate the color that makes the fill and stroke of the various objects that are drawn. To paint an object of one color, the first thing is to change the brush and color, before giving the instruction to draw, the order of the statements is important. This would be the code, notice how the color is changed before drawing the ellipse:
 
In the Canvas object the <code>Brush</code> and <code>Pen</code> objects are defined, both with a <code>Color</code> property, which indicate the color that makes the fill and stroke of the various objects that are drawn. To paint an object of one color, the first thing is to change the brush and color, before giving the instruction to draw, the order of the statements is important. This would be the code, notice how the color is changed before drawing the ellipse:
  
<syntaxhighlight>
+
<syntaxhighlight lang\pascal>
 
   Canvas.Brush.Color:= clRed;
 
   Canvas.Brush.Color:= clRed;
 
   Canvas.Ellipse(195, 117, 205, 128);
 
   Canvas.Ellipse(195, 117, 205, 128);
Line 34: Line 34:
 
</syntaxhighlight>
 
</syntaxhighlight>
  
or shorter
+
or shorter:
<syntaxhighlight>
+
 
 +
<syntaxhighlight lang\pascal>
 
   with Canvas do begin
 
   with Canvas do begin
 
     Brush.Color:= clRed;
 
     Brush.Color:= clRed;

Revision as of 08:10, 14 February 2020

Deutsch (de) English (en) français (fr) 中文(中国大陆)‎ (zh_CN)

Drawing with canvas can be done using several procedures e.g.

  • Canvas Line, draws a line from coordinates (x1,y1) to (x2,y2)
  • Canvas Rectangle, draws a rectangle from upper left (x1,y1) to lower right (x2,y2)
  • Canvas Ellipse, draws an ellipse in a rectangle defined by (x1,y1) and (x2,y2). If x2-x1 = y2-y1, the ellipse will be a circle with radius (x2-x1)/2.


The following code draws the diagonals of a form onto its canvas:

procedure TForm1.Form1Paint(Sender: TObject);
begin
  Canvas.Line(0, 0, Width-1, Height-1);
  Canvas.Line(0, Height-1, Width-1, 0);
end;

In the Canvas object the Brush and Pen objects are defined, both with a Color property, which indicate the color that makes the fill and stroke of the various objects that are drawn. To paint an object of one color, the first thing is to change the brush and color, before giving the instruction to draw, the order of the statements is important. This would be the code, notice how the color is changed before drawing the ellipse:

  Canvas.Brush.Color:= clRed;
  Canvas.Ellipse(195, 117, 205, 128);
  Canvas.Brush.Color:= clBlue;
  Canvas.Rectangle (192, 130,208,160);
  Canvas.Brush.Color:= clGreen;
  Canvas.Rectangle (187, 130,191,162);
  Canvas.Brush.Color:= clYellow;
  Canvas.Rectangle (209, 130,213,162);
  Canvas.Brush.Color:= clMaroon;
  Canvas.Rectangle (193,161,199,200);
  Canvas.Brush.Color:= clPurple;
  Canvas.Rectangle (201,161,207,200);

or shorter:

  with Canvas do begin
    Brush.Color:= clRed;
    Ellipse(195, 117, 205, 128);
    Brush.Color:= clBlue;
    Rectangle (192, 130,208,160);
    Brush.Color:= clGreen;
    Rectangle (187, 130,191,162);
    Brush.Color:= clYellow;
    Rectangle (209, 130,213,162);
    Brush.Color:= clMaroon;
    Rectangle (193,161,199,200);
    Brush.Color:= clPurple;
    Rectangle (201,161,207,200);
  end;

This will give something like this: canvas3.png