Zeichnung wird nicht richtig gezeichnet

[delphicoder123]

Zitat von Gollum:

Hallo delphicoder123,

anbei ein einfaches Beispiel, in dem das Rechteck nach Mausklick gezeichnet und der Hintergrund aktualisiert wird.

Delphi-Quellcode:

unit Unit2;

interface

uses
  Winapi.Windows, Winapi.Messages, System.SysUtils, System.Variants, System.Classes, Vcl.Graphics,
  Vcl.Controls, Vcl.Forms, Vcl.Dialogs, Vcl.ExtCtrls;

type
  TForm2 = class(TForm)
    ScrollBox1: TScrollBox;
    imgAusgabe: TImage;
    procedure imgAusgabeMouseDown(Sender: TObject; Button: TMouseButton;
      Shift: TShiftState; X, Y: Integer);
    procedure FormCreate(Sender: TObject);
    procedure FormDestroy(Sender: TObject);
  private
    x1, x2, y1, y2:Integer;
    bmpHintergrund:TBitmap;

    procedure InitHintergrund();
    procedure Ausgabe();
  public
  end;

var
  Form2: TForm2;


implementation

{$R *.dfm}

procedure TForm2.FormCreate(Sender: TObject);
begin
  x1:=0;
  y1:=0;
  x2:=0;
  y2:=0;
  bmpHintergrund:=TBitmap.Create();
  bmpHintergrund.SetSize(ScrollBox1.Width*2, ScrollBox1.Height*2);
  bmpHintergrund.Canvas.Brush.Color:=clYellow;
  bmpHintergrund.Canvas.Pen.Color:=clNavy;
  bmpHintergrund.Canvas.Pen.Width:=2;
  imgAusgabe.SetBounds(0, 0, bmpHintergrund.Width, bmpHintergrund.Height);

  InitHintergrund();
  Ausgabe();
end;


procedure TForm2.FormDestroy(Sender: TObject);
begin
  bmpHintergrund.Free();
end;


procedure TForm2.InitHintergrund();
var i, dx:Integer;
begin
  dx:=imgAusgabe.Width div 30;

  bmpHintergrund.Canvas.FillRect(bmpHintergrund.Canvas.ClipRect);
  for i:=0 to 29 do
  begin
    bmpHintergrund.Canvas.MoveTo(dx*i, 0);
    bmpHintergrund.Canvas.LineTo(dx*i, imgAusgabe.Height);
  end; // for i
end; // TForm2.InitHintergrund


procedure TForm2.Ausgabe();
begin
  imgAusgabe.Picture.Assign(bmpHintergrund);
  imgAusgabe.Canvas.Rectangle(x1, y1, x2, y2);
end; // TForm2.Ausgabe


procedure TForm2.imgAusgabeMouseDown(Sender: TObject; Button: TMouseButton;
  Shift: TShiftState; X, Y: Integer);
begin
  if (Button=mbLeft) then
  begin
    x1:=x;
    x2:=x+100;
    y1:=y;
    y2:=y+100;
    Ausgabe();
  end; // if
end;
end.

Der Hintergrund ist eine Bitmap. Und auf die Bitmap legst du ein Image drauf.
Warum ist die Bitmap sichtbar, wenn darauf ein Image liegt?

[delphicoder123]

Zitat von Medium:

Du übermalst die Linien ja auch. Bei allem was du selber zeichnest, musst du, wenn sich etwas "bewegt", auch selber dafür sorgen, dass das was hinter dem bewegten Teil war wieder neu gezeichnet wird wenn es wieder sichtbar sein soll.

Ich zeichne das Rechteck beim MouseUp Event neu. Das heißt, beim MouseUp Event muss ich zuerst die Linien zeichnen und dann das Rechteck?

[delphicoder123]

Außerdem ist mir noch etwas aufgefallen, wenn ich nach ganz unten scrolle und das Rechteck in der
unteren Ecke platziere. Dann wird die Scrollbar nicht größer, sodass man das ganze Rechteck sieht.
Wie kann ich das ändern?

Video (15s):
https://youtu.be/7ThQNJtNZK4

[Medium]

Zitat von delphicoder123:

Ich zeichne das Rechteck beim MouseUp Event neu. Das heißt, beim MouseUp Event muss ich zuerst die Linien zeichnen und dann das Rechteck?

Korrekt. Oder du malst die Linien wie schon vorgeschlagen auf ein "internes" TBitmap, sodass du im MouseUp nicht mehr jede Linie einzeln zeichnen musst, sondern einfach das komplette Bitmap auf das Image wirfst, und die "dynamischen" Anteile (in diesem Fall dein Rechteck) malst du dann oben drauf.

Zitat von delphicoder123:

Außerdem ist mir noch etwas aufgefallen, wenn ich nach ganz unten scrolle und das Rechteck in der
unteren Ecke platziere. Dann wird die Scrollbar nicht größer, sodass man das ganze Rechteck sieht.
Wie kann ich das ändern?

Das Image ist so groß, wie du es im Formular-Designer erstellt hast, und darüber hinaus nicht "content-aware". Du musst schon selbst ermitteln, ob das Rechteck die Grenzen des Images verlässt, und könntest dann entweder das Zeichnen verhindern, oder aber das Image per Code vergrößern.