首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

未显示现代OpenGL + SDL2三角形

未显示现代OpenGL + SDL2三角形是指使用SDL2库和现代OpenGL技术来绘制一个三角形,但是该三角形不会在屏幕上显示出来。

现代OpenGL是指OpenGL 3.0及以上版本,它引入了一些新的特性和改进,使得图形渲染更加高效和灵活。

SDL2是一个跨平台的多媒体库,它提供了对窗口、图像、音频、输入设备等的统一抽象,方便开发者进行跨平台的游戏和图形应用程序开发。

在使用SDL2和现代OpenGL绘制三角形之前,需要进行以下几个步骤:

  1. 初始化SDL2库:包括初始化视频子系统、创建窗口和渲染器等。
  2. 创建OpenGL上下文:使用SDL2提供的函数创建一个与窗口关联的OpenGL上下文。
  3. 设置OpenGL状态:包括设置视口大小、清除颜色缓冲区、启用深度测试等。
  4. 编写顶点着色器和片段着色器:顶点着色器负责对顶点进行变换和处理,片段着色器负责对像素进行着色。
  5. 创建顶点缓冲对象(VBO)和顶点数组对象(VAO):VBO用于存储顶点数据,VAO用于管理顶点属性。
  6. 绘制三角形:使用glDrawArrays或glDrawElements函数绘制三角形。

完整的代码示例如下:

代码语言:cpp
复制
#include <SDL2/SDL.h>
#include <OpenGL/gl3.h>

int main(int argc, char* argv[]) {
    // 初始化SDL2库
    SDL_Init(SDL_INIT_VIDEO);

    // 创建窗口
    SDL_Window* window = SDL_CreateWindow("Triangle", SDL_WINDOWPOS_CENTERED, SDL_WINDOWPOS_CENTERED, 800, 600, SDL_WINDOW_OPENGL);

    // 创建OpenGL上下文
    SDL_GLContext context = SDL_GL_CreateContext(window);

    // 设置OpenGL状态
    glViewport(0, 0, 800, 600);
    glClearColor(0.0f, 0.0f, 0.0f, 1.0f);

    // 顶点着色器代码
    const char* vertexShaderSource = R"(
        #version 330 core
        layout (location = 0) in vec3 aPos;
        void main() {
            gl_Position = vec4(aPos.x, aPos.y, aPos.z, 1.0);
        }
    )";

    // 片段着色器代码
    const char* fragmentShaderSource = R"(
        #version 330 core
        out vec4 FragColor;
        void main() {
            FragColor = vec4(1.0, 0.5, 0.2, 1.0);
        }
    )";

    // 编译顶点着色器
    GLuint vertexShader = glCreateShader(GL_VERTEX_SHADER);
    glShaderSource(vertexShader, 1, &vertexShaderSource, NULL);
    glCompileShader(vertexShader);

    // 编译片段着色器
    GLuint fragmentShader = glCreateShader(GL_FRAGMENT_SHADER);
    glShaderSource(fragmentShader, 1, &fragmentShaderSource, NULL);
    glCompileShader(fragmentShader);

    // 创建着色器程序
    GLuint shaderProgram = glCreateProgram();
    glAttachShader(shaderProgram, vertexShader);
    glAttachShader(shaderProgram, fragmentShader);
    glLinkProgram(shaderProgram);

    // 删除着色器对象
    glDeleteShader(vertexShader);
    glDeleteShader(fragmentShader);

    // 创建顶点缓冲对象(VBO)
    GLfloat vertices[] = {
        -0.5f, -0.5f, 0.0f,
        0.5f, -0.5f, 0.0f,
        0.0f, 0.5f, 0.0f
    };
    GLuint VBO;
    glGenBuffers(1, &VBO);
    glBindBuffer(GL_ARRAY_BUFFER, VBO);
    glBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW);

    // 创建顶点数组对象(VAO)
    GLuint VAO;
    glGenVertexArrays(1, &VAO);
    glBindVertexArray(VAO);
    glBindBuffer(GL_ARRAY_BUFFER, VBO);
    glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(GLfloat), (void*)0);
    glEnableVertexAttribArray(0);
    glBindBuffer(GL_ARRAY_BUFFER, 0);
    glBindVertexArray(0);

    // 渲染循环
    bool quit = false;
    while (!quit) {
        SDL_Event event;
        while (SDL_PollEvent(&event)) {
            if (event.type == SDL_QUIT) {
                quit = true;
            }
        }

        // 清除颜色缓冲区
        glClear(GL_COLOR_BUFFER_BIT);

        // 使用着色器程序
        glUseProgram(shaderProgram);

        // 绑定顶点数组对象(VAO)
        glBindVertexArray(VAO);

        // 绘制三角形
        glDrawArrays(GL_TRIANGLES, 0, 3);

        // 解绑顶点数组对象(VAO)
        glBindVertexArray(0);

        // 刷新缓冲区
        SDL_GL_SwapWindow(window);
    }

    // 删除顶点缓冲对象(VBO)和顶点数组对象(VAO)
    glDeleteBuffers(1, &VBO);
    glDeleteVertexArrays(1, &VAO);

    // 删除着色器程序和OpenGL上下文
    glDeleteProgram(shaderProgram);
    SDL_GL_DeleteContext(context);

    // 销毁窗口和SDL2库
    SDL_DestroyWindow(window);
    SDL_Quit();

    return 0;
}

这段代码使用SDL2创建了一个窗口,并在窗口中使用现代OpenGL绘制了一个橙色的三角形。在代码中,顶点着色器将顶点的位置传递给片段着色器,片段着色器将所有像素的颜色设置为橙色。然后,通过顶点缓冲对象(VBO)和顶点数组对象(VAO),将顶点数据传递给OpenGL进行绘制。

推荐的腾讯云相关产品和产品介绍链接地址:

  • 腾讯云云服务器(CVM):提供弹性计算能力,满足各种规模和业务需求。产品介绍链接
  • 腾讯云云数据库MySQL版:提供高性能、可扩展的云数据库服务。产品介绍链接
  • 腾讯云对象存储(COS):提供安全、稳定、低成本的云端存储服务。产品介绍链接

请注意,以上链接仅供参考,具体选择产品时需要根据实际需求进行评估和决策。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

OpenGL ES 2.0 (iOS):修复三角形显示

分布图 从图可以看出,这三个数据形成的其实是一个等边直角三角形,而在 iOS 模拟器中通过 OpenGL ES 绘制出来的是直角三角形,所以是有问题的,三角形被拉伸了。...首先,OpenGL 最后生成的都是像素信息,再显示在物理屏幕上;通过 1) 和 2) 可以知道 Y 方向的像素数量大于 X 方向的像素数量,导致真实屏幕所生成的 Y 轴与 X 轴的刻度不一致(就是Y=0.5...FixTriangle.gif 所以要做的事情是,把顶点坐标的 Y 坐标变小,而且是要根据当前显示屏幕的像素比来进行缩小。...图1,列向量 英文大意:矩阵和矩阵乘法在处理坐标系显示模型方面是一个非常有用的途径,而且对于处理线性变换而言也是非常方便的机制。 ?...4X4方阵 OpenGL ? 平移 OpenGL 矩阵平移公式 ?

1.2K10
  • SDL2来源分析7:演出(SDL_RenderPresent())

    ===================================================== SDL源代码分析系列文章上市: SDL2源码分析1:初始化(SDL_Init()) SDL2源码分析...2:窗体(SDL_Window) SDL2源码分析3:渲染器(SDL_Renderer) SDL2源码分析4:纹理(SDL_Texture) SDL2源码分析5:更新纹理(SDL_UpdateTexture...()) SDL2源码分析6:拷贝到渲染器(SDL_RenderCopy()) SDL2源码分析7:显示(SDL_RenderPresent()) SDL2源码分析8:视频显示总结 ===========...OpenGL OpenGL渲染器中相应RenderPresent()的函数是GL_RenderPresent(),它的源码例如以下所看到的(位于render\opengl\SDL_render_gl.c...(window->flags & SDL_WINDOW_OPENGL)) { SDL_SetError("The specified window isn't an OpenGL window

    82120

    【音视频连载-001】基础学习篇- SDL 介绍以及工程配置

    这种跨平台特性和 OpenGL 是一样的,差别在于 OpenGL 是真·跨平台,它是 Khronos Group 组织开发维护的一个接口规范,具体的实现是由驱动厂商完成。...SDL 下载安装 在 Mac 上下载 SDL 很简单,直接 brew install sdl2 注意,这里下载的是 SDL 2.0 版本,如果用如下的命令 brew install sdl 下载的就是.../usr/local/Cellar/sdl2/2.0.10 CLion 新建工程 接下来就开始打开 CLion ,新建一个 C++ 工程。...之前提到 SDL 的安装路径如下: /usr/local/Cellar/sdl2/2.0.10 该目录如下图: ? 其中 include 就是头文件的路径,lib 就是库的路径。...实现代码如下: target_link_libraries(av-beginner SDL2) target_link_libraries 方法会优先链接动态库,也可以显示指定动态库或者静态库。

    1.1K10

    OpenGL ES 2.0 (iOS) 笔记大纲

    疑问: OpenGL ES 2.0 (iOS)[02]:修复三角形显示 ?...问题与目标 这是一篇,图形显示有问题【出现拉伸】,而引发的一次思考,从而编写完成的文章;当然按照正常的管线流程,这篇文章应该不用出现,但是你在这条路向前行走着的时候,你就要思考,为什么是对的,又为什么是错的...解决 3D 视觉问题 : OpenGL ES 2.0 (iOS)[04]:坐标空间 与 OpenGL ES 2 3D空间 ?...这是一篇,真正意义上解决 [02] 中出现的,三角形拉抻问题的文章,也是真正认识 OpenGL ES 2 是如何把 3D 图形正确渲染出来的【3D 变换】。...任意 3D 模型的渲染: 《OpenGL ES 2.0 (iOS)[05-1]:任意 3D 模型的渲染》【写】 纹理 : 《OpenGL ES 2.0 (iOS)[06-1]:纹理初识》【写】

    58520

    一看就懂的 OpenGL 基础概念丨音视频基础

    假设当我们想告诉 OpenGL 去画线段而不是三角形的时候,我们通过改变一些上下文变量来改变 OpenGL 状态,从而告诉 OpenGL 如何去绘图。...一旦我们改变了 OpenGL 的状态为线段绘制模式,下一个绘制命令就会画出线段而不是三角形。...,而屏幕本质用是一个个像素来显示颜色的,所以上色之前要先确定好哪些像素是属于三角形的,于是你叫计算机把属于三角形内部的像素一个个圈出来: 三角形绘制流程 3 第四步,你想画一个带渐变色的炫酷三角形,所以需要给每个像素都上不同的颜色...OpenGL 渲染管线 这些工序是将输入的 3D 的坐标,转化为显示在屏幕上的 2D 的像素的一个处理流程。...随着时间推移,规范越来越灵活,开发者对绘图细节有了更多的掌控,现代 OpenGL 转变为可编程(Programmable)渲染管线,而这里的编程语言就是 GLSL 语言,它是一种类 C 的语言,专为图形计算量身定制

    2.1K10

    快速入门 WebGL

    也有很多现代浏览器支持 WebGL2,但是苹果还不支持 WebGL2,所以编写 WebGL 程序时,需要向下降级到 WebGL1。...三角形 WebGL 算是比较底层的图形 API,不同于 canvas 2d,WebGL 只能用它来渲染点,线和三角形。那些复杂的 3D 模型其实都是由一个个三角形组成。...可能有同学会问了,为什么就是三角形,而不是 5 边形,6 边形呢? 因为三角形有很多的优势,比如三角形一定在一个平面上,任何多边形都可以使用三角形组成等性值。...处理完毕后会进行光栅化,大家可以把光栅化理解成把图形变成一个个像素,我们显示器屏幕是一个个像素组成的,要显示图形就需要计算出图形中的每个像素点。...上图中顶点数据传送给 GPU 后,顶点着色器计算出每个点的位置,光栅化计算出图形的每个像素,片段着色器计算出每个像素的颜色,然后就可以渲染到显示器上了。

    2.7K11

    一文搞懂 OpenGL 多重采样抗锯齿,再也不怕面试被问到了

    如图示,我们渲染一个三角形,每个像素中心包含一个采样点,它被用来决定一个像素是否被三角形所覆盖(即是否在渲染区域内)。 红色的采样点如果被三角形覆盖,那么就会为这个被覆盖像素生成一个片段。...多重采样对每个像素使用多个样本点来决定三角形的覆盖范围,这样三角形边缘附近每个片段的颜色将会由多个采样点共同决定,不再按照中心的样本一刀切。...使用多重采样之后,三角形的硬边就被比实际颜色浅一些的颜色所包围,因此观察者从远处看上去就比较平滑了。...0, 0, screenW, screenH, GL_COLOR_BUFFER_BIT, GL_LINEAR); 抗锯齿结果对比: 开启多重采样 开启多重采样...完整实现代码下方扫码添加微信获取。

    82310

    最简WebGL教程,仅需 75 行代码

    现代 OpenGL(以及名为WebGL的扩展)与我过去学习的传统 OpenGL 有很大不同。我了解栅格化的工作原理,所以对这些概念很满意。...希望这将帮助你使用现代OpenGL入门。这就我们要做的: ? 一个等边三角形,顶部为绿色,左下为黑色,右下为红色,中间有过渡颜色 初始化 要使用 WebGL,需要用 canvas 进行绘制。...作为栅格化的一部分(确定哪些像素被顶点覆盖),我们告诉 OpenGL 将 3 个一组的顶点视为三角形。...---- 将所有内容放在一起,下图显示了在屏幕上显示第一个三角形的最小概念集。即使这样,该图还是被大大简化了,所以你最好配合本文所介绍的 75 行代码放在一起进行研究。 ?...最后的步骤,尽管经过了简化,但完整描述了三角形所需的步骤顺序 对我而言,学习 OpenGL 的难点在于获得屏幕上最基本图像所需的大量模板。

    1.9K31

    OpenGL学习笔记 (一)- 综述、渲染管线

    之后OpenGL还提供了显示列表(display list)对绘制操作、数据进行缓存,不过这些绘制方式如今都已经被废弃了。 OpenGL 3+开始,所有绘制所需要的数据都被存储在显存之中。...因此在现代OpenGL中,绘图指令将从显存之中的缓存读取数据,相关的内容将在下一篇文章中介绍。 顶点着色器 顶点着色器(vertex shader)通常进行一系列顶点操作。...可以理解成,在这一步中,三角形的三个顶点会被连接成三角形这个形状。 早期图元装配之所以叫“早期”,是因为这一步骤其实是被提前执行了。...OpenGL事实上只能处理三角形,因此使用Tessellation可以把复杂的图形转化成三角形图元,由此减少储存图形需要的顶点数。这些复杂的图形称为面片(patch),由至少三个顶点组成。...其中,现代OpenGL不包含顶点着色器和片段着色器,因此我们需要实现至少一个顶点着色器。 顶点数据(也就是求值器求值后)首先被传递给顶点着色器,此时所有的数据还保持为顶点形式。

    1.5K11

    SDL2OpenGL使用踩坑笔记经验分享

    SDL + OpenGL使用笔记 LFTK 是一个嵌入式GUI,为了开发方便,需要提供PC运行环境。我选择了SDL2+OpenGL+nanovg来实现底层的渲染,让LFTK可以运行在各个平台上。...在使用SDL2+OpenGL+nanovg的过程中,踩了一些坑,这里做个笔记,给需要的朋友参考: 一、在MacPro上显示模糊的问题。...使用低级的OpenGL去绘图是一个比较麻烦的事情。在LFTK中,采用了nanovg矢量图绘图函数库,nanovg缺省使用的GLFW,要移植到SDL2上也不难。...SDL_Init/glfwInit的实现,发现SDL中,stencil_size的缺省值是0,尝试把设置它为8: SDL_GL_SetAttribute(SDL_GL_STENCIL_SIZE, 8); 显示正常了...三、Windows下的OpenGL 在MacPro和Ubuntu下测试没有问题,在Window测试时发现一些OpenGL函数找不到,明明已经链接了opengl32.dll啊。

    3.6K20

    OpenGL学习笔记 (二)- 顶点与绘制指令

    )提到过,现代OpenGL不再推荐使用显示列表或者更古老的glVertex了。...几何图元 OpenGL中有若干几何图元,但是最终这些图元都会被转化为点、线和三角形。通过组合三角形OpenGL还额外提供了条带和扇面。 在OpenGL中,多边形区分正面与背面。...在OpenGL中,使用四个分量(齐次坐标)来描述一个位置。不过,一个顶点还可以同时具备其他的数据,比如顶点处的法向量、对应的纹理坐标等等。 OpenGL缓冲 现代OpenGL广泛应用缓冲。...由于现代OpenGL的顶点数据都存在于缓冲对象中(曾经可以使用glVertexPointer函数),所以现在VAO已经不自带数据了,因此它需要绑定一个VBO。...glEnableVertexAttribArray(0); // 绘制时 glBindVertexArray(VAO); glDrawArrays(GL_TRIANGLES, 0, 3); // 绘制一个三角形

    1.5K10

    OpenGL 可编程管线编程概述

    之后后台有小伙伴留言,建议我用OpenGL现代化编程版本来做,即可编程管线而非NeHe版本的固定管线。...当使用OpenGL的核心模式时,OpenGL迫使我们使用现代的函数。当我们试图使用一个已废弃的函数时,OpenGL会抛出一个错误并终止绘图。现代函数的优势是更高的灵活性和效率,然而也更难于学习。...现代函数要求使用者真正理解OpenGL和图形编程,它有一些难度,然而提供了更多的灵活性,更高的效率,更重要的是可以更深入的理解图形编程。 3....假设当我们想告诉OpenGL去画线段而不是三角形的时候,我们通过改变一些上下文变量来改变OpenGL状态,从而告诉OpenGL如何去绘图。...一旦我们改变了OpenGL的状态为绘制线段,下一个绘制命令就会画出线段而不是三角形

    1.1K10

    【前端可视化】 OpenGL WebGL 入门和实践

    OpenGL 定义 OpenGL 是一套规范,不是接口,学习这套规范,就可以在支持 OpenGL 的机器上正常使用这些规范,在显示器上看到绘制的结果。 这套接口是 Khronos 这个组织在维护。...GPU 的工作 现代的 GPU 功能涵盖了图形显示的方方面面,这里只取一个简单的方向作为例子。这个立方体渲染的例子,会有助于理解接下来会讲到的 GLSL(OpenGL着色器) 语言。 ?...显示出一个这样的立方体要经过很多步骤,我们先考虑简单一点的,想象一下他只是一个线框,没有侧面的“X”图像。再简化一点,连线都没有,就是八个点(立方体有八个顶点的)。...是的,它只能画点、线、三角形。就算是像下面这样的复杂模型,也是一个个三角形画出来的。 ?...想一下,每个三角形都有三个顶点,而一个茶壶就会有成千上万个顶点,而且还需要精密的计算,显然人的肉眼以及精力是不允许一个一个写这些坐标的。

    4.6K31
    领券