基於bada的OpenGL ES2.0:著色器和程序(一)

2020-12-17 CSDN技術社區

這是我基於bada平臺的OpenGL ES 2.0開發系列的下一部分。您可以在此處找到OpenGL ES 2.0的介紹，您應該閱讀它，因為這部分構建於我們上周開發的實例項目之上。在這一部分，我們將首先關注著色器和程序 - 這些都是渲染程序OpenGL ES2.x的基本概念。使用這些對象，您必須對OpenGL的圖形管線的最重要部分進行直接控制。這種控制在對您喜歡的場景進行渲染時能提供巨大的靈活性，帶來很酷的渲染效果。

稍後您會看到更多這些效果，並了解如何正確使用這些工具來實現令人驚嘆的效果。現在，我們將創建最簡單的著色器和方案以渲染多種顏色的三角形。

在我們開始之前，請確保您已對從上一教程下載的項目有所了解。在本教程結束時，您可以下載升級的項目。

著色器和程序

什麼是著色器？（我將儘可能簡化回答 - 有興趣者可以多查查資料以了解更多信息）在OpneGL ES2.x中，著色器是渲染管線的可編程組件。著色器有兩種類型：

1、頂點著色器：允許在頂點上進行一般操作的可編程組件。

2、片段著色器（有時也被稱為像素著色器）：允許在片段（即最終像素）上進行一般操作的可編程組件。

 正如您可能已經注意到的：它與創建OpenGL自己的可執行的二進位對象有關，該等對象後來對圖形管線有直接影響。

首先，使用C -語法的OpenGL ES著色語言創建一個著色器。

然後，它被編譯成最終著色器對象。

一旦編譯好著色器對象，您可以將它們連結至一個程序對象。

最後，在某一時刻，您能告訴OpenGL ES2.x API使用哪個程序對象進行渲染。

一旦我們完成這項步驟，我們就可以開始繪製三角形。我們只需將我們希望渲染的頂點和顏色傳遞到OpenGL的API。OpenGL ES2.x打開這些陣列並將它們拖過圖形管線。當他們到達我們自己的編程著色器邏輯時，這些點/線/多邊形/像素會按照該著色器邏輯得到修改。最後，渲染的圖像傳送到我們的形式。

多種顏色的三角形 - 示範項目

OpenGLForm修改

在這個例子中，我們必須修改我們最後一個項目的OpenGLForm。您可能還記得，我們要使用OpenGLForm作為其他專門形式的基類，以渲染特定的OpenGL場景。然而，在最後一個項目中，我們只初始化將用於渲染的「畫布」。現在我們要添加一些特殊的功能以納入著色器和程序對象的編譯和連接。

#include <FBase.h>

#include <FUi.h>

#include <FGraphics.h>

#include <FGraphicsOpengl2.h>

class OpenGLForm :

 public Osp::Ui::Controls::Form

{

public:

 OpenGLForm(){};

 OpenGLForm(char* fShaderStr, char* vShaderStr);

 virtual ~OpenGLForm();

 result Construct();

 result OnInitializing(void);

 virtual result OnDraw(void){}; // override this

protected:

 Osp::Graphics::Opengl::EGLDisplay  __eglDisplay;

 Osp::Graphics::Opengl::EGLSurface  __eglSurface;

 Osp::Graphics::Opengl::EGLConfig   __eglConfig;

 Osp::Graphics::Opengl::EGLContext  __eglContext;

 Osp::Graphics::Opengl::GLuint      __programObject;

 char* __fShaderStr;

 char* __vShaderStr;

 void Commit();

 virtual void bindShaderVariables(){}; //override this, used to link/load all attributes

private:

 bool InitEGL();

 bool InitGL();

 Osp::Graphics::Opengl::GLuint LoadShader(Osp::Graphics::Opengl::GLenum type, const char *shaderSrc);

 void DestroyGL();

};

首先，我們創建一個新的構造器，其接受帶有著色器原始碼的兩個字符串。我們存儲這些字符串的引用作為成員對象（見11、22、23行）

然後，我們將OnDraw（）回調方法留白。派生形式應覆蓋它來繪製其特定的OpenGL場景（見15行）。要在拖至OpenGL ES API後進行更改，我們會創建一個特殊的方法Commit（）（見25行）

然後，我們還創建了一個成員對象，其將存儲程序對象引用（我們的著色器被連結到該處）（見21行）

此外，我們創建一種新的方法，其將初始化程序對象：InitGL（）（見29行）

然後，我們需要使用一種方法bindShaderVariables（），其連結著色器腳本中的屬性（以及其他「變量」）至我們自己的C + +變量。我們將此留白 - 它是由派生類使用/連結他們需要的屬性（見26行）。不要擔心此意義 - 在幾分鐘內您會看到一個例子。

最後，我們需要使用一種方法，其可以創建和編譯我們的著色器對象，辦法是向其提供著色器原始碼 - LoadShader（類型、源）（見30行）

相關焦點

  • OpenGL現代編程第三課——著色器
    一、 著色器概述從基本意義上來講，著色器只是一種把輸入轉化為輸出的程序。它們之間唯一的「通訊」方式只有通過輸入和輸出來實現。著色器是使用一種叫GLSL的類C語言寫成的，GLSL是為圖形計算量身定製的，它包含一些針對向量和矩陣操作的有用特性。
  • New程序媛OpenGL全解析之—第一個OpenGL程序解析
    接下來的三條語句就是將數據內容解綁，也就是重置為零ID，即為不綁定和操作任何數據。glEnableVertexAttribArray(0);glBindBuffer(GL_ARRAY_BUFFER, 0); glBindVertexArray(0); 有了數據，我們要來看的就是對應的著色器代碼啦。
  • OpenGL 與 Go 教程(一)Hello, OpenGL
    = nil {            panic(err)    }    window.MakeContextCurrent()    return window}好了，讓我們花一分鐘來運行一下這個程序，看看會發生什麼。首先定義了一些常量， width和 height —— 它們決定窗口的像素大小。
  • OpenGl著色器簡單範例
    新手，把書上的代碼弄來弄去，結果還是沒有動，就搜了好久，終於弄到一個定點著色器和片源著色器能運行的了.搜到的blog：http://blog.csdn.net/qianqiang1989/article/details/8307219首先會使用vs2013英語版創建C++的ConsoleApplication並且會增加相關的文件.cpp或者.h （特別說明，添加完也可以通過對增加的文件
  • 《OpenGL編程指南(原書第8版)》——計算著色器
    本地工作組的大小在計算著色器的原始碼中用輸入布局限定符來設置。全局工作組的大小則是本地工作組大小的整數倍。當計算著色器執行的時候，它可以內置變量來知道當前在本地工作組中的相對坐標、本地工作組的大小, 以及本地工作組在全局工作組中的相對坐標。基於這些還能進一步獲得執行單元在全局工作組中的坐標等。
  • UE4精品課程 | OpenGL學習筆記(三)繪製三角形/四邊形
    正是由於它們具有並行執行的特性，當今大多數顯卡都有成千上萬的小處理核心，它們在GPU上為每一個（渲染管線）階段運行各自的小程序，從而在圖形渲染管線中快速處理你的數據。這些小程序叫做著色器(Shader)。
  • 原創 | 學好opengl走遍天下都不怕系列《基礎篇》
    前言最近本來是想認真學習下《opengl es第三版》這本書，無奈內容過於生澀，有點看不下去，偶遇opengl-tutorial.org
  • 基於OpenGL ES的深度學習框架編寫
    背景項目組基於深度學習實現了視頻風格化和人像摳圖的功能，但這是在PC/服務端上跑的，現在需要移植到移動端，因此需要一個移動端的深度學習的計算框架
  • OpenGL glfw學習(一)初識,環境,窗口
    在opengl中新建lib文件夾，將編譯好的glfw可執行文件（build->src->Debug,Release）放入lib文件夾。解壓glad包，將glad->include目錄下的兩個文件夾glad和KHR複製到opengl->include文件夾中。
  • 著色器語言,圖形計算量身定做、支持3D特效
    著色器是運行在GPU上的小程序，它是使用著色器語言GLSL編寫的。前面的文章中已經介紹了基於OpenGL如何畫出三角形和長方形，在這個過程中說明了著色器程序的創建、編譯和連結。著色器程序上則需要附著上頂點著色器、片段著色器。而頂點著色器、片段著色器是採用著色器語言編寫的。
  • OpenGl ES 基礎入門知識
    其中 OpenGL ES 1.0 是以 OpenGL 1.3 規範為基礎的，OpenGL ES 1.1 是以 OpenGL 1.5 規範為基礎的，而 OpenGL ES 2.0 基於 OpenGL 2.0 實現。
  • OpenGL ES 3.0 實例化(Instancing)
    實例化（Instancing）的目標並不是實現將同一物體繪製多次，而是能基於某一物體繪製出位置、大小、形狀或者顏色不同的多個物體。OpenGL ES 著色器中有一個與實例化繪製相關的內建變量 gl_InstanceID。
  • Android OpenGl ES 基礎入門知識
    其中 OpenGL ES 1.0 是以 OpenGL 1.3 規範為基礎的，OpenGL ES 1.1 是以 OpenGL 1.5 規範為基礎的，而 OpenGL ES 2.0 基於 OpenGL 2.0 實現。
  • OpenGL現代編程第二課——第一個多邊形
    一、 圖形渲染管線過程概述圖形渲染管線接受一組3D坐標，然後把它們轉變為你屏幕上的有色2D像素輸出。圖形渲染管線可以被劃分為幾個階段，每個階段將會把前一個階段的輸出作為輸入。下圖是形渲染管線工作流程的簡化，其中藍色的是我們可以配置的著色器(關於著色器請參考原文)，本次我們只初步掌握頂點著色器與片段著色器即可。
  • Android OpenGL開發實踐 - 基於OpenGL ES 2.0的Android相機實時圖片塗鴉實現思路
    這篇文章將給大家講解如何在Android系統上基於OpenGL ES 2.0來實現相機實時圖片塗鴉效果，所塗內容跟隨人臉出現、消失、移動、旋轉及縮放
  • OpenGLES2.0(二)實戰之繪製三角形
    實現GLSurfaceView的Render，在Render中完成三角形的繪製，具體行為有：加載頂點和片元著色器確定需要繪製圖形的坐標和顏色數據創建program對象，連接頂點和片元著色器，連結program對象。設置視圖窗口(viewport)。將坐標數據顏色數據傳入OpenGL ES程序中使顏色緩衝區的內容顯示到屏幕上。
  • CSharpGL(0)一個易學易用的C#版OpenGL
    你可以：繪製模型你可以用legacy opengl(glVertex)或modern opengl(VBO+Shader)繪製模型。當然這是最基本的功能。CSharpGL提供一個GLCanvas控制項供你進行繪製。使用紋理（貼圖）你可以用legacy opengl(glVertex)或modern opengl(VBO+Shader)為模型貼上貼圖。
  • 音視頻開發之旅(九) OpenGL ES 繪製平面圖形
    收穫我們前兩篇介紹了OpenGL ES 基本概念 和 GLSL及Shader的渲染流程，這篇我們開始實戰，通過GLSurfaceView加載著色器，來繪製三角形、正方形和直線這些平面圖形。GLSL著色器的編寫如果對OpenGL的基本概念以及渲染流程不清晰的，建議看下前兩篇文章，這些基本概念和流程要了解或者理解，否則後面實踐之旅就是跳坑之旅。我們先通過下面重要的二張圖，快速回顧下
  • 初學者秘籍:混合紋理和著色器的14種使用方法
    在本教程中，你將學到使用Blender混合紋理和著色器的14種方法。創造出真實材質無非就是調整和混合。每一個逼真的表面都由幾十層組成，完成本Blender教程之後，你會在實際應用中得到巨大的提升。本教程的亮點：14種混合紋理的方法，Blender 2.80版本進行演示。公開課·第二期用Blender多邊形繪製紋理Blender中的每個對象可以有一個不同的標識。
  • Github霸榜:從零開始學3D著色器編程
    主要介紹了通過使用Panda3D遊戲引擎和OpenGL著色語言來為3D遊戲添加紋理，法線貼圖，泛光，環境遮擋等等。教程內容十分豐富，動圖也非常生動。Shader，是運行在GPU上的程序，中文稱為著色器。它的主要用途是對三維物體進行著色處理，對光與影進行計算，以及控制紋理顏色的呈現等，最終，將遊戲引擎中的幾何數據轉化為屏幕上的模型、場景以及特效。