Enjoy Your Coding

OpenGL 開發環境設定

在本篇文章中,將介紹如何在Windows, Ubuntu (Linux), macOS下安裝及設定OpenGL的開發環境,並撰寫跨三平台的OpenGL C++ 程式碼。

OpenGL 是什麼?

OpenGL(英語:Open Graphics Library,譯名:開放圖形庫或者「開放式圖形庫」)是用於彩現2D、3D向量圖形的跨語言、跨平台的應用程式編程介面(API)。這個介面由近350個不同的函式呼叫組成,用來從簡單的圖形位元繪製複雜的三維景象。而另一種程式介面系統是僅用於Microsoft Windows上的Direct3D。OpenGL常用於CAD、虛擬實境、科學視覺化程式和電子遊戲開發。可搭配freeglut的函示庫加速開發。

freeglut 是什麼?

GLUT (OpenGL Utility Toolkit) 是一個OpenGL的函式庫,主要提供一些I/O及底層呼叫的函式:視窗、滑鼠事件、鍵盤事件、繪圖等。 由於GLUT自西元2000年以來沒有再提供更新,freeglut的作者決定實作一個GLUT函式庫「freeglut」,並做維護及其他改善,沿用自今。

上述介紹部分內容取自 維基百科

跨平台的優勢?

上述提到OpenGL是一個跨平台的圖形函示庫,在開發過程中主要使用C++開發應用程式。我們可以依照不同作業系統載入不同的標頭檔(.h)來進行跨平台的設定,透過這樣的方式,撰寫出來的程式,可以在Windows、Ubuntu、macOS上面執行運作。若開發多平台遊戲的話,可以省下不少開發時間,「Write once, run anywhere」。

Sample Code

以下是OpenGL範例程式碼,從前六行程式碼可看到針對不同作業系統使用不同的標頭檔,程式碼修改至此連結:

#ifdef __APPLE__ // 若作業系統為macOS系統,則使用下列header檔案
#include <OpenGL/gl.h>
#include <GLUT/glut.h>
#else
#include <GL/glut.h>
#endif

void init();
void display();

int main(int argc, char* argv[])
{
    glutInit(&argc, argv);
    glutInitDisplayMode(GLUT_RGB | GLUT_SINGLE);
    glutInitWindowPosition(0, 0);
    glutInitWindowSize(300, 300);

    glutCreateWindow("OpenGL 3D View");

    init();
    glutDisplayFunc(display);

    glutMainLoop();
    return 0;
}

void init()
{
    glClearColor(0.0, 0.0, 0.0, 0.0);
    glMatrixMode(GL_PROJECTION);
    glOrtho(-5, 5, -5, 5, 5, 15);
    glMatrixMode(GL_MODELVIEW);
    gluLookAt(0, 0, 10, 0, 0, 0, 0, 1, 0);
}

void display()
{
    glClear(GL_COLOR_BUFFER_BIT);

    glColor3f(1.0, 0, 0);
    glutWireTeapot(3);

    glFlush();
}

環境設定

Windows

安裝 Visual Studio

請先自行安裝Visual Studio,安裝過程記得安裝Visual C++,在本範例使用Visual Studio 2015 Community,此為免費版本。

Visual Studio是一個由微軟公司所開發設計的IDE,主要用來開發Windows裝置、Android、iOS及雲端服務的應用程式,常用Visual Studio 撰寫的語言,像是C#, Visual Basic, TypeScript, C++, C,是微軟官方提供的IDE。

下載 freeglut

請到 freeglut 官網並點選下圖Prepackaged Releases的Martin Payne's Windows binaries (MSVC and MinGW) alt text

點選上圖連結後,會到下圖頁面,請點選freeglut 3.0.0 MSVC Package下的Download freeglut 3.0.0 for MSVC 下載 freeglut-MinGW.zip alt text

新增 Visual C++ 專案

開啟Visual Studio,從左上角選單 File -> New -> Project (英文版) alt text

選擇專案類型,並新增專案,在此範例專案為OpenGLSample alt text

設定OpenGL及freeglut

方案總管OpenGLSample Project上點選右鍵,並選取「Open Folder in File Explorer」 ,將先前下載的 freeglut-MinGW.zip解壓縮後的freeglut資料夾放到此目錄,如下圖

alt text

設定專案屬性,在方案總管OpenGLSample Project上點選右鍵,並選取「Properties」 ,如下圖

alt text

下列設定使用 $(ProjectDir) 代表是目前專案在PC上的路徑,若有在不同PC上進行開發,建議使用$(ProjectDir)的方式來設定

設定 Additional Include Directories

將下圖的Additional Include Directories裡面新增項目,內容為$(ProjectDir)freeglut\include

alt text

設定 Additional Library Directories

將下圖的Additional Library Directories裡面新增項目,內容為$(ProjectDir)freeglut\lib

alt text

設定 Build-Events 的 Post-Build Event

Post-Build Event會在專案編譯成功後,執行指令。

在此設定內容為

Copy /Y "$(ProjectDir)freeglut\bin\freeglut.dll" "$(ProjectDir)"

設定結果如下圖

alt text

執行OpenGL 應用程式

可使用上述提供的範例程式碼,測試看看是否可正常運行。

新增一個main.cpp檔案,內容使用剛開始提供的範例程式碼

若順利編譯,執行結果如下圖:

alt text

Ubuntu

使用Ubuntu 16.04.2 LTS Desktop版,進行環境配置,僅須透過以下指令安裝freeglut**

sudo apt install freeglut3 freeglut3-dev

可使用上述提供的範例程式碼,測試看看是否可正常運行。

新增一個main.cpp檔案,內容文章剛開始提供的 範例程式碼,透過Terminal下指令編譯及執行:

gcc main.cpp -o main.out -lGL -lGLU -lglut
 # 編譯
./main.out
 # 執行

若順利編譯,執行結果如下圖:

alt text

macOS

在這邊將提到安裝Xcode,新增專案並設定OpenGL函示庫。

Xcode是一個由蘋果公司所開發設計的IDE,主要用來開發macOS、iOS、watchOS、tvOS的應用程式,常用Xcode撰寫的語言,像是Swift, Objective-C, C++, C,是macOS上官方提供的IDE。

安裝 Xcode

請登入App Store,搜尋Xcode,並安裝。

開啟 Xcode 新增 C++ 專案

開啟Xcode後,請點選「Create a new Xcode Project

alt text

作業系統選擇macOS,類型選取Command Line Tool,按下Next

alt text

專案名稱在此範例為OpenGLSample,語言選擇C++,按下Next後選擇位置,即可建立專案

alt text

點選下圖中的左上角藍色icon的專案名稱,並在Linked Frameworks and Libraries點選+的icon設定Library

alt text

關鍵字輸入GL,並將GLKit.frameworkGLUT.frameworkOpenGL.framework加入至專案

alt text

設定結果如下圖

alt text

搭配文章開始提供的範例程式碼,若順利編譯,執行結果如下圖:

alt text