Glium图形编程教程：创建基本三角形渲染-优快云博客

Glium图形编程教程：创建基本三角形渲染

glium Safe OpenGL wrapper for the Rust language. 项目地址: https://gitcode.com/gh_mirrors/gl/glium

引言

Glium是一个基于Rust语言的OpenGL高级封装库，它提供了安全且符合人体工程学的API来创建图形应用程序。本教程将深入解析如何使用Glium创建一个简单的三角形渲染程序，这是学习图形编程的基础步骤。

环境初始化

任何Glium程序的第一步都是初始化事件循环和显示窗口：

let event_loop = glium::winit::event_loop::EventLoop::builder()
    .build()
    .expect("event loop building");
let (_window, display) = glium::backend::glutin::SimpleWindowBuilder::new()
    .with_title("Glium tutorial #2")
    .build(&event_loop);

这段代码创建了一个事件循环和一个显示窗口。事件循环是处理用户输入和系统事件的核心机制，而显示窗口则是图形渲染的目标表面。

顶点数据定义

在图形编程中，所有几何形状都是由顶点构成的。我们定义一个顶点结构体来表示二维坐标：

#[derive(Copy, Clone)]
struct Vertex {
    position: [f32; 2],
}
implement_vertex!(Vertex, position);

implement_vertex!宏是Glium特有的，它自动为我们的顶点结构体实现了必要的trait，使其能够被用作顶点数据。

创建几何形状

我们定义一个包含三个顶点的向量来形成一个三角形：

let shape = vec![
    Vertex { position: [-0.5, -0.5] },
    Vertex { position: [ 0.0,  0.5] },
    Vertex { position: [ 0.5, -0.25] }
];

这些坐标使用的是归一化设备坐标(NDC)，范围在[-1,1]之间，其中(0,0)表示屏幕中心。

顶点缓冲区和索引

将顶点数据上传到GPU内存：

let vertex_buffer = glium::VertexBuffer::new(&display, &shape).unwrap();
let indices = glium::index::NoIndices(glium::index::PrimitiveType::TrianglesList);

这里我们创建了一个顶点缓冲区对象(VBO)来存储顶点数据，并使用NoIndices表示我们将按顺序使用顶点而不使用索引。

着色器程序

着色器是运行在GPU上的小程序，控制图形的渲染方式。

顶点着色器

#version 140
in vec2 position;
void main() {
    gl_Position = vec4(position, 0.0, 1.0);
}

这个简单的顶点着色器将输入的二维位置转换为四维齐次坐标。

片段着色器

#version 140
out vec4 color;
void main() {
    color = vec4(1.0, 0.0, 0.0, 1.0);
}

片段着色器将所有像素设置为红色(RGBA值为1,0,0,1)。

创建着色器程序

let program = glium::Program::from_source(&display, vertex_shader_src, fragment_shader_src, None).unwrap();

这将编译并链接顶点和片段着色器，创建一个完整的渲染管线。

渲染过程

实际的渲染分为几个步骤：

获取绘制目标
清除颜色缓冲区
执行绘制命令
交换缓冲区

let mut target = display.draw();
target.clear_color(0.0, 0.0, 1.0, 1.0);  // 蓝色背景
target.draw(&vertex_buffer, &indices, &program, &glium::uniforms::EmptyUniforms,
    &Default::default()).unwrap();
target.finish().unwrap();

事件处理

最后，我们需要处理窗口事件，特别是关闭请求：

event_loop.run(move |ev, window_target| {
    match ev {
        glium::winit::event::Event::WindowEvent { event, .. } => match event {
            glium::winit::event::WindowEvent::CloseRequested => {
                window_target.exit();
            },
            _ => (),
        },
        _ => (),
    }
})