iOS 視覺(jué)特效一 Xcode搭建OpenGL環(huán)境

一、搭建前準(zhǔn)備

首先靶剑，需要如下庫(kù)：

CLTools
glew
libGLTools.a

二、搭建開(kāi)始

1.創(chuàng)建工程

image.png

2.選擇創(chuàng)建macOS App

8E8FA100-DB48-4CF1-B10B-06D7FC60E34D.png

122DC420-018B-4B7F-BC62-D1AAF10D1C5E.png

3.添加依賴庫(kù)

在 Bulid Phases——Link Binary With Libraries 中點(diǎn)?添加依賴庫(kù) “GLUT.framework” 和 “OpenGL.framework”。

8B900D0B-BB42-42DA-BB2D-9EA6451C4C45.png

4.配置路徑

(1) 將下載好的 include 文件夾直接拖入項(xiàng)目工程中孕锄，將 libGLTools.a 靜態(tài)庫(kù)直接拖入到項(xiàng)目的 Frameworks 中翻斟。

2BD65600-E078-4E2E-AC24-2A82B592AA16.png

(2) 在 Build Settings 中搜索 “Header search” 逾礁，在 Header Search Paths 添加上 include 的路徑，可以直接把項(xiàng)目工程里的include文件夾拖過(guò)來(lái)就會(huì)出現(xiàn)路徑。

8D7E44EB-38CE-42B1-A421-9604DB1D5A33.png

5.刪除AppDelegate.h嘹履、AppDelegate.m腻扇、main.m 、ViewController.h 和 ViewController.m

290D3963-D5FF-4F7E-BA07-12316557A2DC.png

6.創(chuàng)建main.cpp

創(chuàng)建一個(gè) c++ 類型的文件砾嫉，命名為 main幼苛，創(chuàng)建的時(shí)候去掉勾選同時(shí)創(chuàng)建頭文件的對(duì)勾。

76DCC011-4CB9-4E1E-AFDA-4C2E504B9AF0.png

625AD998-1487-4839-AC18-B4E1A08BEEC1.png

三焕刮、運(yùn)行代碼

將代碼添加到main.cpp文件中

#include <stdio.h>


/*
`#include<GLShaderManager.h>` 移入了GLTool 著色器管理器（shader Mananger）類舶沿。沒(méi)有著色器，我們就不能在OpenGL（核心框架）進(jìn)行著色配并。著色器管理器不僅允許我們創(chuàng)建并管理著色器括荡，還提供一組“存儲(chǔ)著色器”，他們能夠進(jìn)行一些初步?基本的渲染操作溉旋。
*/
#include "GLShaderManager.h"

/*
 `#include<GLTools.h>`  GLTool.h頭文件包含了大部分GLTool中類似C語(yǔ)言的獨(dú)立函數(shù)
*/
#include "GLTools.h"

/*
 在Mac 系統(tǒng)下畸冲，`#include<glut/glut.h>`
 在Windows 和 Linux上，我們使用freeglut的靜態(tài)庫(kù)版本并且需要添加一個(gè)宏
*/
#include <GLUT/GLUT.h>

//定義一個(gè)观腊，著色管理器
GLShaderManager shaderManager;

//簡(jiǎn)單的批次容器邑闲，是GLTools的一個(gè)簡(jiǎn)單的容器類。
GLBatch triangleBatch;

GLfloat blockSize = 0.2f;

///正方形四個(gè)頂點(diǎn)坐標(biāo)
GLfloat vVerts[] = {
    -blockSize,-blockSize,0.0f,
    blockSize,-blockSize,0.0f,
    blockSize,blockSize,0.0f,
    -blockSize,blockSize,0.0f
};

/*
 在窗口大小改變時(shí)恕沫，接收新的寬度&高度监憎。
 */
void changeSize(int w,int h)
{
    /*
      x,y 參數(shù)代表窗口中視圖的左下角坐標(biāo)，而寬度婶溯、高度是像素為表示鲸阔，通常x,y 都是為0
     */
    glViewport(0, 0, w, h);
}

/// 渲染場(chǎng)景
void RenderScene(void)
{

    //1.清除一個(gè)或者一組特定的緩存區(qū)
    /*
     緩沖區(qū)是一塊存在圖像信息的儲(chǔ)存空間，紅色迄委、綠色褐筛、藍(lán)色和alpha分量通常一起分量通常一起作為顏色緩存區(qū)或像素緩存區(qū)引用。
     OpenGL 中不止一種緩沖區(qū)（顏色緩存區(qū)叙身、深度緩存區(qū)和模板緩存區(qū)）
      清除緩存區(qū)對(duì)數(shù)值進(jìn)行預(yù)置
     參數(shù)：指定將要清除的緩存的
     GL_COLOR_BUFFER_BIT :指示當(dāng)前激活的用來(lái)進(jìn)行顏色寫入緩沖區(qū)
     GL_DEPTH_BUFFER_BIT :指示深度緩存區(qū)
     GL_STENCIL_BUFFER_BIT:指示模板緩沖區(qū)
     */
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT|GL_STENCIL_BUFFER_BIT);
    
    //2.設(shè)置一組浮點(diǎn)數(shù)來(lái)表示白色
    GLfloat vRed[] = {1.0f,1.0f,1.0f,1.0f};
    
    //傳遞到存儲(chǔ)著色器渔扎，即GLT_SHADER_IDENTITY著色器，這個(gè)著色器只是使用指定顏色以默認(rèn)笛卡爾坐標(biāo)第在屏幕上渲染幾何圖形
    //單元著色器
    shaderManager.UseStockShader(GLT_SHADER_IDENTITY,vRed);
    
    //提交著色器 (繪制)
    triangleBatch.Draw();
    
    //在開(kāi)始的設(shè)置openGL 窗口的時(shí)候信轿，我們指定要一個(gè)雙緩沖區(qū)的渲染環(huán)境晃痴。這就意味著將在后臺(tái)緩沖區(qū)進(jìn)行渲染，渲染結(jié)束后交換給前臺(tái)财忽。這種方式可以防止觀察者看到可能伴隨著動(dòng)畫幀與動(dòng)畫幀之間的閃爍的渲染過(guò)程倘核。緩沖區(qū)交換平臺(tái)將以平臺(tái)特定的方式進(jìn)行。
    //將后臺(tái)緩沖區(qū)進(jìn)行渲染即彪，然后結(jié)束后交換給前臺(tái)
    glutSwapBuffers();
    
}

void SpecialKeys(int key, int x, int y)
{
    //定義移動(dòng)步長(zhǎng)
    GLfloat stepSize = 0.025f;
    //相對(duì)移動(dòng)頂點(diǎn)D為例
    GLfloat blockX = vVerts[0];
    GLfloat blockY = vVerts[10];
    //向上移動(dòng)
    if (key == GLUT_KEY_UP) {
        
    }
}

/// 設(shè)置
void setupRC()
{
    //設(shè)置清屏顏色（背景顏色）
    glClearColor(0.98f, 0.40f, 0.7f, 1);
    
    
    //沒(méi)有著色器紧唱，在OpenGL 核心框架中是無(wú)法進(jìn)行任何渲染的。初始化一個(gè)渲染管理器。
    //在前面的課程漏益，我們會(huì)采用固管線渲染蛹锰，后面會(huì)學(xué)著用OpenGL著色語(yǔ)言來(lái)寫著色器
    shaderManager.InitializeStockShaders();
    
    
    //指定頂點(diǎn)
    //在OpenGL中，三角形是一種基本的3D圖元繪圖原素绰疤。
//    GLfloat vVerts[] = {
//        -0.5f,0.0f,0.0f,
//        0.5f,0.0f,0.0f,
//        0.0f,0.5f,0.0f
//    };
    //連接方式 九種連接方式  GL_TRIANGLE_FAN
    //GL_POINTS 每個(gè)頂點(diǎn)在屏幕上都是單獨(dú)點(diǎn)
    //GL_LINES 每?對(duì)頂點(diǎn)定義?個(gè)線段;
    //GL_LINE_STRIP ?個(gè)從第?個(gè)頂點(diǎn)依次經(jīng)過(guò)每?個(gè)后續(xù)頂點(diǎn)?繪制的線條
    //GL_LINE_LOOP 和GL_LINE_STRIP相同,但是最后?個(gè)頂點(diǎn)和第?個(gè)頂點(diǎn)連接起來(lái)了
    //GL_TRIANGLES 每3個(gè)頂點(diǎn)定義?個(gè)新的三?形
    //GL_TRIANGLE_STRIP 共??個(gè)條帶(strip)上的頂點(diǎn)的?組三?形
    //GL_TRIANGLE_FAN 以?個(gè)圓點(diǎn)為中?呈扇形排列,共?相鄰頂點(diǎn)的?組三?形
    
    triangleBatch.Begin(GL_TRIANGLE_FAN, 4);
    triangleBatch.CopyVertexData3f(vVerts);
    triangleBatch.End();
    
}

int main(int argc,char *argv[])
{

    //初始化GLUT庫(kù),這個(gè)函數(shù)只是傳說(shuō)命令參數(shù)并且初始化glut庫(kù)
    glutInit(&argc, argv);
    
    /*
     初始化雙緩沖窗口铜犬，其中標(biāo)志GLUT_DOUBLE、GLUT_RGBA峦睡、GLUT_DEPTH翎苫、GLUT_STENCIL分別指
     雙緩沖窗口、RGBA顏色模式榨了、深度測(cè)試、模板緩沖區(qū)
     
     --GLUT_DOUBLE`：雙緩存窗口攘蔽，是指繪圖命令實(shí)際上是離屏緩存區(qū)執(zhí)行的龙屉，然后迅速轉(zhuǎn)換成窗口視圖，這種方式满俗，經(jīng)常用來(lái)生成動(dòng)畫效果转捕；
     --GLUT_DEPTH`：標(biāo)志將一個(gè)深度緩存區(qū)分配為顯示的一部分，因此我們能夠執(zhí)行深度測(cè)試唆垃；
     --GLUT_STENCIL`：確保我們也會(huì)有一個(gè)可用的模板緩存區(qū)五芝。
     深度、模板測(cè)試后面會(huì)細(xì)致講到
     */
    glutInitDisplayMode(GLUT_DOUBLE|GLUT_RGBA|GLUT_DEPTH|GLUT_STENCIL);
    
    //GLUT窗口大小辕万、窗口標(biāo)題
    glutInitWindowSize(500, 500);
    glutCreateWindow("Square 標(biāo)題");
    
    /*
     GLUT 內(nèi)部運(yùn)行一個(gè)本地消息循環(huán)枢步，攔截適當(dāng)?shù)南ⅰＨ缓笳{(diào)用我們不同時(shí)間注冊(cè)的回調(diào)函數(shù)渐尿。我們一共注冊(cè)2個(gè)回調(diào)函數(shù)：
     1）為窗口改變大小而設(shè)置的一個(gè)回調(diào)函數(shù)
     2）包含OpenGL 渲染的回調(diào)函數(shù)
     */
    //注冊(cè)重塑函數(shù)
    glutReshapeFunc(changeSize);
    //注冊(cè)顯示函數(shù)
    glutDisplayFunc(RenderScene);
    //注冊(cè)特殊函數(shù) (鍵盤調(diào)用)
    glutSpecialFunc(SpecialKeys);
    
    /*
     初始化一個(gè)GLEW庫(kù),確保OpenGL API對(duì)程序完全可用醉途。
     在試圖做任何渲染之前，要檢查確定驅(qū)動(dòng)程序的初始化過(guò)程中沒(méi)有任何問(wèn)題
     */
    GLenum status = glewInit();
    if (GLEW_OK != status) {
        
        printf("GLEW Error:%s\n",glewGetErrorString(status));
        return 1;
        
    }
    
    //設(shè)置我們的渲染環(huán)境
    setupRC();
    glutMainLoop();
 
    return  0;
    
}

之后運(yùn)行工程.
運(yùn)行結(jié)果