OpenGL / OpenGL ES entry: vertex shader and fragment shader (OpenGL transition OpenGL ES)

Series Recommended Reading:
OpenGL / OpenGL ES Getting Started: graphics API and professional terms to resolve
OpenGL / OpenGL ES entry: the rendering process and fixed storage shader
OpenGL / OpenGL ES Getting Started: image rendering implementation and rendering problems
OpenGL / OpenGL ES Getting Started: Basic transformation - acquaintance vectors / matrices
OpenGL / OpenGL ES entry: Probe texture - analytical common API
OpenGL / OpenGL ES entry: textures - case analysis and texture coordinates (pyramid)
OpenGL / OpenGL ES entry: vertex shader and fragment shader (OpenGL transition ES OpenGL)
OpenGL / OpenGL ES entry: GLKit and API Introduction to
OpenGL / OpenGL ES entry: GLKit and use cases

Before articles are related to knowledge about the fixed pipeline, the main purpose of the content behind the programmable pipeline to pave the way.
Fixed line
when using the fixed pipeline, developers do not need to care too much rendering process, is not allowed to interfere with the process of vertex shaders and pixel rendering, OpenGL interior will help us to produce a complete set of the rendering process, we only need to pass specific parameters to the fixed pipeline, to complete rendering.

Programmable pipeline
custom programmable high line, developers can write a few links in the vertex shader and pixel shader based on need, there is a vertex shader belonging to the vertex shader, a geometry shader, pixel belonging to the subdivision shader rendering fragment shader (pixel shader), shader understood as a small program, we tend to be more and more developers must write a vertex shader and fragment shader, and the shader and geometry shader is broken By default, you can use the default.

Man of few words said, directly into the relevant content.

OpenGL ES Introduction

OpenGL ES (OpenGL for Embedded Systems) is based Handheld and Embedded targeting advanced 3D graphics application programming interface (API).

OpenGL ES is the dominant smartphone platform graphics API supports:. IOS, Andriod, BlackBerry, bada, Linux, Windows.

OpenGL ES Open Graphics Library ( the OpenGL ) is used for two-dimensional and three-dimensional visualization of data. It is a versatile open standard graphics library, ⽀ support 2D and 3D digital content creation, mechanical and architectural design, virtual prototyping, simulation fly ⾏, video games and other applications. You can use the OpenGL configuration 3D graphics pipeline and submit data. Vertices are transformed and lit, a combination of primitives, and rasterized to create a 2D image. OpenGL is designed to convert the function call can be sent to the underlying graphics hardware graphics commands. Because the underlying hardware dedicated to processing graphics commands, so OpenGL graphics typically comes in handy faster. OpenGL for Embedded Systems (OpenGL ES) is OpenGL simplified version, it eliminates redundant functions, providing a ⼀ a separate warranty is both easy to learn easier libraries implemented in mobile graphics hardware.

Pipeline Rendering Process

Vertex shader

Vertex shader input:

  • Shader program - Description vertex shader program code for performing operations on the source vertex / executables
  • The input vertex discolored (attribute) - data providing vertex for each vertex in the array
  • Unified variable ( Uniform ) - vertex / fragment discolored with the same data used by the
  • Sampler - on behalf of the vertex shader unified special type of variable use of texture, usually IDtype, GLSLbased IDfind the texture tag

Element assembly primitives ( Primitive ): points, lines, triangle
primitives assembled: the calculated vertex data into one entity, at this stage performs clipping, and perspective divide Viewport transform operation. I.e., the vertex determination pattern is formed, or a triangular point or line.

For each primitive must determine primitive is located frustum (visible on the screen of the 3D space region):

  • Not entirely primitive in the view frustum may need to be cut.
  • Element completely outside the region, it will be abandoned

Rasterization rendering corresponding images (points, lines, triangles), the primitive is converted into a set of processes two-dimensional section, is the vertex data calculated as pictures into fragments, and these fragments processed by the fragment shader.

Vertex shader operations:

  • Matrix changing positions
  • Calculation formula generation color per vertex lighting
  • Generating / converting texture coordinates

Vertex Shader Code Case:

// 属性 -- 顶点坐标 四维向量
attribute vec4 position;
// 属性 -- 纹理坐标 二维向量
attribute vec2 textCoordinate; 
// uniform 旋转矩阵
uniform mat4 rotateMatrix; 
// 通道 可利用该值传递值到片元着色器
varying lowp vec2 varyTextCoord; 
void main()
{
    varyTextCoord = textCoordinate; 
    vec4 vPos = position;
    vPos = vPos * rotateMatrix; 
    // 输出
    gl_Position = vPos;
}
复制代码

Fragment shader

Fragment shader or fragment shader called pixel shader.

Fragment shader input:

  • Shader program - fragment shader program source code for performing operations on a description fragment / executables.
  • Input variables - rasterizing unit for each segment by interpolation of vertex shader output generated
  • Unified variable ( Uniform ) - vertex or constant data used by fragment shader
  • Sampler - Uniform variables represent particular fragment shader using textures

Interpolation (Interpolation):
rasterizer interpolating (or through another line by line interpolation technique) between the vertices of a triangle and three fragment shader execution through each pixel of the triangle. Fragment shader returns color buffer pixel color values exist for displaying the rasterizer (after other additional checks, such as: depth test depth test and the like)

Fragment shader operations:

  • Computing color
  • Obtaining texture values
  • To fill color pixel value (texture value / color value)

It can be selectively used in FIG still pictures / video / graphic fills each color pixel (for example, to add filters to the video, the video is actually the color of each image pixel points modified filled.)

Fragment shader Code Case:

// 纹理坐标 从顶点着色器传递过来 命名、类型要一致
varying lowp vec2 varyTextCoord; 
// 纹理采样器 
uniform sampler2D colorMap; 
void main()
{
    // 输出值 -- gl_FragColor
    // texture2D(纹理采样器, 纹理坐标) -- 获取纹理像素
    gl_FragColor = texture2D(colorMap, varyTextCoord); 
}
复制代码

Operation fragment by:

  • Pixel Home Test: determining a frame buffer position (Xw, Yw) of the pixel current is not attributable to OpenGL ES . All e.g., if ⼀ of display OpenGL ES frame buffer View is additionally ⼀ a View . Obscured by the window system may determining shaded pixel does not belong OpenGL ES vertical files. Thus incomplete display pixels. Home testing is the pixel OpenGL ES part, which help to open the developer human control, but by OpenGL ES internally.
  • Test Crop: Cutting test determines (Xw, Yw) is located as OpenGL ES within a portion of a cropping rectangle range states. If the release segment located outside of the crop area, were abandoned.
  • Test Depth: Depth value of progressive input START fragment, and determines whether to reject the segment test
  • Mixing: Mixed release segment newly generated color value stored in the color and position of the frame buffer are combined
  • Jitter: jitter can be used to minimize the use of limited accuracy because the color value stored ⽽ artifacts generated in the frame buffer.

EGL (Embedded Graphics Library )

  • OpenGL ESCommand requires rendering context and draw the surface to complete the painting graphics and images.
  • Rendering context: storage-related OpenGL EScondition.
  • Drawing surface: the surface is used to draw primitives, which specifies the type of buffer required to render such a color buffer, depth buffer, and stencil buffer.
  • OpenGL ES APIHow to create a rendering does not provide the file up and down up and down the file or how to connect to the native windowing system. EGLIs Khronos rendering API(e.g., OpenGL ESthe interface between a) and the original ⽣ window system. The only ⽀ who OpenGL ESdo not hold ⽀ EGLplatform is iOS. Apple provides automatically own EGL APIthe iOS implementation, called EAGL.
  • Because each system has a different definition window, it EGLprovides substantially opaque type EGLDisplay, the type that encapsulates all of the relevant system, and for the native window system interface.

Because OpenGL ESa C-based API, so it comes in handy portable and widely supported. As the C API, it Objective-C Cocoa Touch⽆ seamless integration of the applications. OpenGL ESSpecification does not define a window layer; contrary, hosted operating system must provide a function to receive commands to create the OpenGL ESrendering context and a frame buffer, wherein writing result any drawing commands. On iOS use OpenGL ESrequires Use iOS class and rendering the drawing surface, and the use of platform-neutral APIto render its contents.

Reproduced in: https: //juejin.im/post/5cf3d29ff265da1b667bc3d0

Guess you like

Origin blog.csdn.net/weixin_33849215/article/details/91472325