VSCode+CMake搭建OpenGL开发环境

发表于 | 更新于 | 分类于 | 评论数： | 阅读次数：

OpenGL跨平台开发环境很多种，自动化构建的话首选 CMake，编辑器方面可选的比较多，个人非常喜欢 Jetbrains 的 CLion，代码提示和自动补全功能非常强大，目前没有提供社区版本，需要购买激活，另一个比较推荐的就是微软的 VSCode，它的插件非常丰富，非常轻量，并且免费开源，下面介绍一下基于 VSCode和CMake 搭建 OpenGL的开发环境，我这里的的操作系统为 OSX。

准备工作

搭建环境需要的软件包括：

OpenGL项目需要的第三方库：

  • GLFW 用于定义窗口、上下文以及处理用户输入等等；
  • GLAD 提供了跨平台的访问 OpenGL 接口，因为 OpenGL 只是提供了标准，具体的实现是由各个显卡的驱动去做，由于驱动版本众多，很多函数在编译期没有办法确定，只能通过LoadLibrary的方式在运行时查找，每个函数都这么干非常麻烦，glad 就是用来完成这部分工作的。

搭建环境

下面假设已经把VSCode和CMake安装好了，直接介绍如果设置项目，以及如何编译、配置类库。

编译 glfw

编译需要工具：

  • CMake；
  • Unix 系统使用 Make，Windows 使用 Visual Studio 或者 MinGW。

从 glfw 官网 直接下载源码并解压，然后开始编译：

打开命令行，切换到解压后的 glfw 根目录，然后依次执行如下命令：

编译动态库，编译完的动态库在build/src目录：

1
2
3
4
mkdir build
cd build
cmake -DBUILD_SHARED_LIBS=ON ..
make

编译静态库：

1
2
3
4
mkdir build
cd build
cmake .
make

然后将库安装到本机，执行如下命令，动态库将会被安装到usr/local/lib目录，头文件安装到usr/local/include：

1
make install

准备 glad

进入下载页面下载 glad，它提供了一个生成器，选择如下：

  • Language选择C/C++；
  • Specification 选择 OpenGL;
  • gl 我这里选择的是 Version 3.3;
  • Profile 选择 Core.

然后点击下面的 Generate 进行下载，下载完成后进行解压即可，不需要进行编译，直接在项目中引用源文件即可。

创建项目

初始化

VSCode 创建项目很简单，打开一个空的文件夹即可，然后创建 CMakeList.txt，如果安装了 ‘CMake Tools’插件，可以直接按下 F1，然后执行 CMake:Quick Start命令帮助快速创建。

安装 glad

这一步很简单，将 include 文件夹下的 glad、KHR 拷贝到项目中的 include 文件夹（没有的话进行创建），然后将 src/glad.c 拷贝到项目中。

配置库和框架

修改 CMakeList.txt：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
cmake_minimum_required(VERSION 3.0.0)
project(HelloGL VERSION 0.1.0)

# 使用 C++ 11 标准
set(CMAKE_CXX_STANDARD 11)

# 添加头文件
set(GLAD_H ${PROJECT_SOURCE_DIR}/include)
set(GLFW_H /usr/local/include)
include_directories(${GLAD_H} ${GLFW_H})

# 添加目标链接
set(GLFW_LINK /usr/local/lib/libglfw.3.dylib)
link_libraries(${GLFW_LINK})

# 执行编译命令
set(SOURCES glad.c main.cpp)
add_executable(HelloGL ${SOURCES})

# 链接系统的 OpenGL 框架
if (APPLE)
    target_link_libraries(HelloGL "-framework OpenGL")
endif()

include(CTest)
enable_testing()

set(CPACK_PROJECT_NAME ${PROJECT_NAME})
set(CPACK_PROJECT_VERSION ${PROJECT_VERSION})
include(CPack)

验证测试代码

修改 main.cpp

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
#include <glad/glad.h>
#include <GLFW/glfw3.h>
#include <stdio.h>
#include <stdlib.h>
#include <iostream>

void framebuffer_size_callback(GLFWwindow *window, int width, int height);
void processInput(GLFWwindow *window);

int main(int argc, const char *argv[])
{
    glfwInit();
    glfwWindowHint(GLFW_CONTEXT_VERSION_MAJOR, 3);
    glfwWindowHint(GLFW_CONTEXT_VERSION_MINOR, 3);
    glfwWindowHint(GLFW_OPENGL_PROFILE, GLFW_OPENGL_CORE_PROFILE);
#ifdef __APPLE__
    glfwWindowHint(GLFW_OPENGL_FORWARD_COMPAT, GL_TRUE); // uncomment this statement to fix compilation on OS X
#endif

    GLFWwindow *window = glfwCreateWindow(800, 600, "LearnOpenGL", NULL, NULL);
    if (window == NULL)
    {
        std::cout << "fail to create window" << std::endl;
        glfwTerminate();
        return -1;
    }

    glfwMakeContextCurrent(window);

    if (!gladLoadGLLoader((GLADloadproc)glfwGetProcAddress))
    {
        std::cout << "Failed to initialize GLAD" << std::endl;
        return -1;
    }

    glViewport(0, 0, 800, 600);
    glfwSetFramebufferSizeCallback(window, framebuffer_size_callback);

    while (!glfwWindowShouldClose(window))
    {

        processInput(window);
        glClearColor(0.2f, 0.3f, 0.3f, 1.0f);
        glClear(GL_COLOR_BUFFER_BIT);

        glfwSwapBuffers(window);
        glfwPollEvents();
    }

    glfwTerminate();
    return 0;
}

void framebuffer_size_callback(GLFWwindow *window, int width, int height)
{
    glViewport(0, 0, width, height);
}

void processInput(GLFWwindow *window)
{
    if (glfwGetKey(window, GLFW_KEY_ESCAPE) == GLFW_PRESS)
    {
        glfwSetWindowShouldClose(window, true);
    }
}

生成与调试

可以通过 CMake Tools提供的图形界面进行生成，也可以通过一下命令，打开 F1，执行命令CMake:Build。如果显示生成成功，说明环境配置成功，显示结果如下：

如果需要调试程序，在 Debug 面板中点击齿轮按钮，然后选择C++(GDB/LLDB)调试器，再选择默认配置，最后修改 launch.json 中的 program 属性，指向生成的程序：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
{
    // 使用 IntelliSense 了解相关属性。 
    // 悬停以查看现有属性的描述。
    // 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "(lldb) 启动",
            "type": "cppdbg",
            "request": "launch",
            "program": "${workspaceFolder}/build/HelloGL",
            "args": [],
            "stopAtEntry": false,
            "cwd": "${workspaceFolder}",
            "environment": [],
            "externalConsole": false,
            "MIMode": "lldb"
        }
    ]
}