EAGL.Examples.LearnOpenGL.GettingStarted.HelloTriangleExercise3 (eagl v0.4.0)

View Source

LearnOpenGL 2.5 - Hello Triangle Exercise 3 (Multiple Shader Programs)

This example demonstrates using multiple shader programs to render different colored triangles. It solves the third exercise from the Hello Triangle tutorial.

Original C++ Source

This example is based on the original LearnOpenGL C++ tutorial: https://github.com/JoeyDeVries/LearnOpenGL/tree/master/src/1.getting_started/2.5.hello_triangle_exercise3

Framework Adaptation Notes

In the original LearnOpenGL C++ tutorial, this exercise asks you to create two triangles that render with different colors by using different fragment shaders.

EAGL's framework maintains the same approach:

  • Two separate VAO/VBO pairs for independent geometry
  • Shared vertex shader between both programs
  • Different fragment shaders for different colors
  • Multiple draw calls with different shader programs

Original Tutorial Exercise

Exercise 3: Create two shader programs where the second program uses a different fragment shader that outputs the color yellow; draw both triangles again where one outputs the color orange and the other outputs the color yellow.

Solution Concepts Demonstrated

  1. Multiple Shader Programs: Creating and managing separate programs
  2. Shader Reuse: Same vertex shader used in both programs
  3. Fragment Shader Variants: Different colors from different shaders
  4. Separate Geometry: Independent VAO/VBO pairs
  5. Multi-Pass Rendering: Multiple draw calls with different programs

Key Learning Points

  • How to create and manage multiple shader programs
  • Sharing shaders between different programs
  • The relationship between shader programs and rendering state
  • When to use separate geometry vs shared geometry
  • Understanding the cost of shader program switches

Triangle Geometry and Colors

Two separate triangles with different colors:

Left Triangle (Orange)    Right Triangle (Yellow)
      /\                       /\
     /  \                     /  \
    /____\                   /____\
  • Left triangle: Orange fragment shader
  • Right triangle: Yellow fragment shader
  • Same vertex shader for both triangles

Difference from Previous Examples

  • 2.3 Exercise 1: 2 triangles, 1 shader program, same color
  • 2.4 Exercise 2: 2 triangles (rectangle), 1 shader program, same color
  • 2.5 Exercise 3: 2 triangles, 2 shader programs, different colors

Usage

EAGL.Examples.LearnOpenGL.GettingStarted.HelloTriangleExercise3.run_example()

Press ENTER to exit the example.

Summary

Functions

run_example()

@spec run_example() :: :ok | {:error, term()}