BGRABitmap tutorial 10/de

Deutsch · English · Español · Français

Dieses Tutorial zeigt, wie Sie Texturen transformieren können ("texture mapping").

Erzeugen Sie ein neues Projekt

Erzeugen Sie ein neues Projekt und fügen Sie eine Referenz auf BGRABitmap hinzu, genau so wie im ersten Tutorial.

Verwenden des Vorgabe-Mappings

Schauen wir uns an was passiert, wenn wir ein Polygon mit einer Textur zeichnen und dabei das Vorgabe-Mapping anwenden:

pascal

procedure TForm1.FormPaint(Sender: TObject);
var image: TBGRABitmap;
    tex: TBGRABitmap;
begin
  //schwarzer Hintergrund
  image := TBGRABitmap.Create(ClientWidth,ClientHeight, BGRABlack );

  tex:= TBGRABitmap.Create('image.png'); //lade eine Bitmap
  image.FillPolyAntialias( [PointF(110,10), PointF(250,10), PointF(350,160), PointF(10,160)], tex);
  tex.Free;

  image.Draw(Canvas,0,0,True); //auf dem Bildschirm zeichnen
  image.free;
end;

Starten Sie das Programm

Sie erhalten etwas in dieser Art:

Wie Sie sehen ist das Bild nicht verformt.

Affine Transformation

Wir können aber auch eine affine Transformation anwenden, wie folgt:

pascal

uses BGRABitmap, BGRABitmapTypes, BGRATransform;

procedure TForm1.PaintImage;
var image: TBGRABitmap;
    tex: TBGRABitmap;
    affine: TBGRAAffineBitmapTransform;

begin
  //schwarzer Hintergrund
  image := TBGRABitmap.Create(ClientWidth,ClientHeight, BGRABlack );

  tex:= TBGRABitmap.Create('image.png'); //lade eine Bitmap

  //create a rotation of 45°
  affine := TBGRAAffineBitmapTransform.Create(tex,True);
  affine.RotateDeg(45);

  //nimm diese Transformation als Parameter anstelle von 'tex'
  image.FillPolyAntialias( [PointF(110,10), PointF(250,10), PointF(350,160), PointF(10,160)], affine); 

  affine.Free;
  tex.Free;

  image.Draw(Canvas,0,0,True); //auf dem Bildschirm zeichnen
  image.free;
end;

Starten Sie das Programm

Sie erhalten ein gedrehtes Bild in dem Polygon:

Texturen-Mapping

Wenn die Textur an der Polygonlinie ausgerichtet sein soll, dann setzen wir ein Textur-Mapping ein.

Lineares Mapping

Lineares Mapping streckt das Bild linear bis zu den Rändern. Dazu schreiben wir:

pascal

procedure TForm1.PaintImage;
var image: TBGRABitmap;
    tex: TBGRABitmap;
begin
  image := TBGRABitmap.Create(ClientWidth,ClientHeight, BGRABlack );

  tex:= TBGRABitmap.Create('image.png');
  image.FillPolyLinearMapping( [PointF(110,10), PointF(250,10), PointF(350,160), PointF(10,160)], tex,
             [PointF(0,0), PointF(tex.width-1,0), PointF(tex.Width-1,tex.Height-1), PointF(0,tex.Height-1)], true);
  tex.Free;

  image.Draw(Canvas,0,0,True);
  image.free;
end;

Für das Mapping benutzen wir die Prozedur 'FillPolyLinearMapping'. Einige Parameter sind neu. Die Texturkoordinaten legen für jeden Punkt des Polygons die Lage in der Textur fest. Die letzte Option 'Interpolation' liefert uns die beste Qualität.

Starten Sie das Programm

Jetzt ist die Textur verformt, passend zur Form des Polygons.

Perspektives Mapping

Das perspektive Mapping erlaubt es, die Tiefe eines jeden Punktes zu ändern.

pascal

procedure TForm1.PaintImage;
var image: TBGRABitmap;
    tex: TBGRABitmap;
begin
  image := TBGRABitmap.Create(ClientWidth,ClientHeight, BGRABlack );

  tex:= TBGRABitmap.Create('image.png');
  image.FillPolyPerspectiveMapping( [PointF(110,10), PointF(250,10), PointF(350,160), PointF(10,160)],
                                    [75,             75,             50,              50],
       tex, [PointF(0,0), PointF(tex.width-1,0), PointF(tex.Width-1,tex.Height-1), PointF(0,tex.Height-1)], true);
  tex.Free;

  image.Draw(Canvas,0,0,True);
  image.free;
end;

Hier ist die Tiefe an der Polygonoberseite 75, am unteren Rand des Polygons bei 50. Dies bedeutet, dass die Unterseite näher beim Betrachter liegt, so als ob die Fläche horizontal wäre (wie ein Fussboden).

Starten Sie das Programm

Jetzt scheint es sich um ein 3D-Polygon zu handeln:

Schlussfolgerungen

Mittels dieser Techniken ist es möglich, ein Bild zu verformen - wie in LazPaints Werkzeug "Gitterverformung" ("grid deformation") - oder 3D-Objekte mit Texturen darzustellen, wie in den Tests 19-21 der Funktion 'testbgrafunc' (ebenfalls im LazPaint-Archiv enthalten).

Voriges Tutorial (Phong-Schattierung) | Nächstes Tutorial (Kombinieren von Transformationen)

From the Free Pascal wiki, page "BGRABitmap tutorial 10/de", as it stood on 2020-02-09 after a change by Trev, out of the wiki's dump of 2024-05-26. Copyright stays with the author who wrote it, according to the old wiki's Licensing page. If you have concerns about this material, message the admin.

Revision 2, last changed by WikiArchive 2026-11-04.

Talk about this page

Nobody has opened a bench for this page yet. Sign in to open one.