Lazarus - OpenGL 3.3 Tutorial - Texturen - Texturen und Matrixen: Unterschied zwischen den Versionen

Aus DGL Wiki
Wechseln zu: Navigation, Suche
(Die Seite wurde neu angelegt: „200px<br><br> =Texturen - Texturen und Matrixen = == Einleitung == Die Textur-Ko…“)
 
Zeile 5: Zeile 5:
 
Dies geschieht ähnlich, wie bei den Vertex-Koordinanten, der grösste Unterschied dabei ist, das es sich um 2D-Koordinaten handelt.<br>
 
Dies geschieht ähnlich, wie bei den Vertex-Koordinanten, der grösste Unterschied dabei ist, das es sich um 2D-Koordinaten handelt.<br>
 
<br>
 
<br>
Das Translate ist noch fehlerhaft !!!!!<br>
+
Dabei ist zu beachten, das beim Drehen/Verschieben die Transformationen in umgekehrter Reihenfolge verläuft,<br>
 +
im Gegensatz zu Vertex-Koordinaten.<br>
 
<br><br>
 
<br><br>
<syntaxhighlight lang="pascal">procedure TForm1.InitScene;
+
Das die Textur in der Mitte des Rechteckes dreht, muss sie um 0.5 verschoben werden.<br>
 +
<syntaxhighlight lang="pascal">procedure TForm1.CreateScene;
 
begin
 
begin
   Textur.LoadTextures('mauer.bmp');</syntaxhighlight>
+
   ScaleMatrix.Identity;
 +
  ScaleMatrix.Scale(1.1);
 +
 
 +
  TexturRotMatrix.Identity;
 +
 
 +
  // Textur verschieben
 +
  TexturTransMatrix.Identity;
 +
  TexturTransMatrix.Translate(-0.5, -0.0);
 +
 
 +
  // Startwerte Texturtransformation
 +
  with TexturTransform do begin
 +
    scale := 1.0;
 +
    direction := True;
 +
  end;</syntaxhighlight>
 
Matrizen multiplizieren und den Shader übergeben.<br>
 
Matrizen multiplizieren und den Shader übergeben.<br>
 
<syntaxhighlight lang="pascal">procedure TForm1.ogcDrawScene(Sender: TObject);
 
<syntaxhighlight lang="pascal">procedure TForm1.ogcDrawScene(Sender: TObject);
 +
var
 +
  Matrix: TMatrix2D;
 
begin
 
begin
 
   glClear(GL_COLOR_BUFFER_BIT);
 
   glClear(GL_COLOR_BUFFER_BIT);
Zeile 20: Zeile 37:
  
 
   // --- Texturmatrizen multiplizieren und übergeben.
 
   // --- Texturmatrizen multiplizieren und übergeben.
   texRotMatrix.Push;                                   // texRotMatrix sichern.
+
   Matrix := TexturRotMatrix;
   texRotMatrix.Multiply(texTransMatrix, texRotMatrix); // multiplizieren
+
   Matrix.Multiply(Matrix, TexturTransMatrix); // multiplizieren
   texRotMatrix.Uniform(texMatrix_ID);                   // Dem Shader übergeben.
+
   Matrix.Uniform(texMatrix_ID);               // Dem Shader übergeben.
  texRotMatrix.Pop;                                    // Gersicherte Matrix laden.
 
  
 
   // --- Zeichne Quadrat
 
   // --- Zeichne Quadrat
Zeile 36: Zeile 52:
 
   sstep = 1.03;  // Schritt für Skalierung
 
   sstep = 1.03;  // Schritt für Skalierung
 
   rstep = 0.01;  // Schritt für Rotation
 
   rstep = 0.01;  // Schritt für Rotation
 +
  winkel: single = 0.0;
  
  winkel: single = 0.0;
 
 
begin
 
begin
 
   with TexturTransform do begin
 
   with TexturTransform do begin
Zeile 57: Zeile 73:
 
     end;
 
     end;
  
     texRotMatrix.Identity;        // Matrix manipulieren.
+
     // Matrix Skalieren und Rotieren.
     texRotMatrix.Scale(scale);
+
    TexturRotMatrix.Identity;
     texRotMatrix.Rotate(winkel);
+
     TexturRotMatrix.Scale(scale);
 +
     TexturRotMatrix.Rotate(winkel);
 
   end;
 
   end;
 
   ogcDrawScene(Sender);
 
   ogcDrawScene(Sender);
 
end;</syntaxhighlight>
 
end;</syntaxhighlight>
 
<br><br>
 
<br><br>
 +
Hier sieht man, wie die Texturkoordinaten anhand der Matrix manipuliert werden.<br>
 +
<br>
 
==Vertex-Shader:==
 
==Vertex-Shader:==
 
<syntaxhighlight lang="glsl">#version 330
 
<syntaxhighlight lang="glsl">#version 330
  
layout (location = 0) in vec3 inPos;   // Vertex-Koordinaten
+
layout (location = 0) in vec3 inPos;   // Vertex-Koordinaten
 
layout (location = 10) in vec2 inUV;    // Textur-Koordinaten
 
layout (location = 10) in vec2 inUV;    // Textur-Koordinaten
  
Zeile 79: Zeile 98:
 
   gl_Position = mat * vec4(inPos, 1.0);
 
   gl_Position = mat * vec4(inPos, 1.0);
  
// UV0 = vec2(texMat * vec3(inUV + vec2(-0.5, -0.5), 1.0));
+
  // Texturkoordinaten transformieren
//  UV0 = vec2(texMat * vec3(inUV, 1.0));
 
 
   UV0 = (texMat * vec3(inUV, 1.0)).xy;
 
   UV0 = (texMat * vec3(inUV, 1.0)).xy;
 
}
 
}
Zeile 90: Zeile 108:
 
in vec2 UV0;
 
in vec2 UV0;
  
uniform sampler2D Sampler;             // Der Sampler welchem 0 zugeordnet wird.
+
uniform sampler2D Sampler;
  
 
out vec4 FragColor;
 
out vec4 FragColor;
Zeile 96: Zeile 114:
 
void main()
 
void main()
 
{
 
{
   FragColor = texture( Sampler, UV0 ); // Die Farbe aus der Textur anhand der Koordinten auslesen.
+
   FragColor = texture( Sampler, UV0 );
 
}
 
}
 
</syntaxhighlight>
 
</syntaxhighlight>

Version vom 22. Mai 2018, 18:09 Uhr

Lazarus - OpenGL 3.3 Tutorial - Texturen - Texturen und Matrixen.png

Texturen - Texturen und Matrixen

Einleitung

Die Textur-Koordinaten kann man im Shader auch mit einer Matrix multipizieren.
Dies geschieht ähnlich, wie bei den Vertex-Koordinanten, der grösste Unterschied dabei ist, das es sich um 2D-Koordinaten handelt.

Dabei ist zu beachten, das beim Drehen/Verschieben die Transformationen in umgekehrter Reihenfolge verläuft,
im Gegensatz zu Vertex-Koordinaten.


Das die Textur in der Mitte des Rechteckes dreht, muss sie um 0.5 verschoben werden.

procedure TForm1.CreateScene;
begin
  ScaleMatrix.Identity;
  ScaleMatrix.Scale(1.1);

  TexturRotMatrix.Identity;

  // Textur verschieben
  TexturTransMatrix.Identity;
  TexturTransMatrix.Translate(-0.5, -0.0);

  // Startwerte Texturtransformation
  with TexturTransform do begin
    scale := 1.0;
    direction := True;
  end;

Matrizen multiplizieren und den Shader übergeben.

procedure TForm1.ogcDrawScene(Sender: TObject);
var
  Matrix: TMatrix2D;
begin
  glClear(GL_COLOR_BUFFER_BIT);
  Textur.ActiveAndBind;
  Shader.UseProgram;

  ScaleMatrix.Uniform(Matrix_ID);  // Matrix für die Vektoren.

  // --- Texturmatrizen multiplizieren und übergeben.
  Matrix := TexturRotMatrix;
  Matrix.Multiply(Matrix, TexturTransMatrix); // multiplizieren
  Matrix.Uniform(texMatrix_ID);               // Dem Shader übergeben.

  // --- Zeichne Quadrat
  glBindVertexArray(VBQuad.VAO);
  glDrawArrays(GL_TRIANGLES, 0, Length(QuadVertex));

  ogc.SwapBuffers;
end;

Berechnen der Matrix-Bewegungen.

procedure TForm1.Timer1Timer(Sender: TObject);
const
  sstep = 1.03;  // Schritt für Skalierung
  rstep = 0.01;  // Schritt für Rotation
  winkel: single = 0.0;

begin
  with TexturTransform do begin
    if direction then begin
      scale *= sstep;
      if scale > 15.0 then begin
        direction := False;
      end;
    end else begin
      scale /= sstep;
      if scale < 1.0 then begin
        direction := True;
      end;
    end;

    winkel := winkel + rstep;
    if winkel > 2 * pi then begin
      winkel := winkel - 2 * pi;
    end;

    // Matrix Skalieren und Rotieren.
    TexturRotMatrix.Identity;
    TexturRotMatrix.Scale(scale);
    TexturRotMatrix.Rotate(winkel);
  end;
  ogcDrawScene(Sender);
end;



Hier sieht man, wie die Texturkoordinaten anhand der Matrix manipuliert werden.

Vertex-Shader:

#version 330

layout (location =  0) in vec3 inPos;   // Vertex-Koordinaten
layout (location = 10) in vec2 inUV;    // Textur-Koordinaten

uniform mat4 mat;
uniform mat3 texMat;

out vec2 UV0;

void main(void)
{
  gl_Position = mat * vec4(inPos, 1.0);

  // Texturkoordinaten transformieren
  UV0 = (texMat * vec3(inUV, 1.0)).xy;
}



Fragment-Shader:

#version 330

in vec2 UV0;

uniform sampler2D Sampler;

out vec4 FragColor;

void main()
{
  FragColor = texture( Sampler, UV0 );
}


Autor: Mathias

Siehe auch