Skip to content

Home

Jump to bottom
Greg edited this page Oct 12, 2019 · 4 revisions

Intro

OpenGL docs.

Every OpenGL call involves the GPU in some way. OpenGL stores memory in column major format when, data is read in column by column. Abstracting OpenGL into Classes and almost last vid in this series is Writing a Basic Renderer in OpenGL.

Depdends on: GL Extension Wrangler, imgui.

Draw Pipeline

Bind vertex > Bind vertex array > Bind index buffer > Bind shader > GLSM fragment and vertex shader > Give all to Renderer > Renderer.Draw()

  • Vertex buffer has our graphics bytes.
  • Vertex array defines the memory layout of our vertex buffer.
  • Vertex buffer layout defines mem address structure.
  • Shader and Texture adds the color and image graphics.
  • Draw earch frame on Window.

Unbind

Generally don't need to call unbind since going to bind something new anyway

Main Abstractions

Memory

  • Vertex Buffer Size of our queued up graphics data Tri verticies

  • Vertex Buffer Layout Struct for containing our vertex buffer attributes for our glVertexAttribPointer Vector of this struct Stride for vertex_mem_address_width between verts in our vector Push to add m_elements to our Buffer layout Ploymorphic funtion to store floats, int, and bytes

  • Vertex Array Adds collection of VertexBuffers with offsets Binds the vertex buffers and set memory layout

  • Index Buffer Loads rendundant vertex data during drawing Supporting 32 bit indicies

  • Vertex Buffer & Index Buffer Has a Renderer ID that uniquely identifies each Vertex Buffer Can bind, unbind with renderer id holding our pointer to the binded data

Graphics

  • Shader

    • GLSL (OpenGL Shading Language)
      • #shader vertex (aka pixel shader) fills in the on screen object. INput here.
      • #shader fragment for each pixel adds color. OUTput here.
    • Uniform shader variables that are constant from one Shader (instantiation?call?) to the next.
    • Compile source text of shader.
    • Major changes in vid "Shader Abstraction in OpenGL".
    • Implement sampling with varying_texture_coordinate in .shader to get a lookup of the exact coordinate to the texture we're drawing.
    // runs once per vertex (aka pixel), projection matrix puts pixel in right place on screen to maintain ratio
gl_Position = u_modelview_projection_matrix * position;
    • Projection
      • This result is a test that shows how we convert from the 100 to 100 vertex position to the -1 to 1 device * coordinate space.
       glm::mat4 orthographic_projection_matrix
     = glm::ortho(0.0f, 960.0f, 0.0f, 540.0f, -1.0f, 1.0f);

 glm::vec4 vertex_position(100.0f, 100.0f, 0.0f, 1.0f);
 glm::vec4 result = orthographic_projection_matrix * vertex_position;
      • In fragment shader, we can use the last color output to draw our texture with white. 
        void main()
{
    vec4 texture_color = texture(u_texture, varying_texture_coordinate);
    color = texture_color;
    color = vec4(1.0);
};

  • Blending

    • Belending colors. Render a red squrare and blue square on top of each other will get a purple square.
    • Combine both colors using glBlendFunc into an "output color" and store in a "target buffer"
    • Math is take each RGBA color channel for square1 and square2 then do:
    • sqaure1 RGBA (1.0, 1.0, 1.0, 0.5) -> SOURCE

    • sqaure2 RGBA (1.0, 0.0, 1.0, 1.0) -> DESTINATION

    • red_channel = (Rsrc * Asrc) - (Rsrc * (Asrc - Adest))
    • For transparency OpenGL provides: 
      `glEnable(GL_BLEND)`
`glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA)` // if `SRC_ALPHA = 0` get completely transparent

  • Textures

    • Image files loaded into CPU memory and Shader draws by reading the images pixel array and defining what color is for earch array element.
    • Use stb image loader header file.
    • In OpenGL bottom left is (0,0) so we must flip our image.
    • Need "Slots" to bind textures to, most desktops have 32 slots

  • Math

    • Matrix
      • Projection matrix
        • Use (glm for math)[https://github.com/g-truc/glm].
        • Helps image maintain aspect ratio on different screen sizes.
        • Orthographic Matrix for 2D mostly sometimes 時々{ときどき}.
        • Perspective Matrix for 3D.
      • Model view projection matrix
        • View matrix code to control camera (simulated by translating all on screen objects).
        • Model matrix code for our object (has position, rotatation, and scale).
    • Vector: directional or positional (where does ball go, where does camera go?).

Visual Studio 2019 Properities

C/C++

  • General: Add GLFW and glew include locatuions using $(SolutionDir).
  • Preprocessor: First Preprocessor Definition as GLEW_STATIC;.

Linker

  • General: Add GLFW and glew static libs locations using $(SolutionDir).
  • Input: List the libs you need, example glfw3.lib;User32.lib;Gdi32.lib;Shell32.lib;opengl32.lib;glew32s.lib.

Misc. Concepts

  • Quads are squares.
  • Tris are triangles.
  • Sampling: openGL uses 0 to 1 and scales depending on resolution and interpolates the color to fill in between for * earch pixel in the screen coordinates.
Clone this wiki locally