【随笔】安卓平台YUV数据(NV12/I420)渲染
作者：互联网
【场景】
为安卓应用增加解码h264和显示YUV的功能。解码用的是AMediacodec，此处不展开。
渲染用的是GLES 2.0，网上很多方案，包括webRTC的渲染都是针对I420（YUV420 三平面数据），比较少针对NV12的（可能我搜索能力比较辣鸡），
花了两天时间才找到正确的办法，特此记录。
【方案描述】
Opengl ES渲染 NV12的过程：
创建两个surface，分别代表Y平面和UV平面；
在shader中实现NV12转RGB，经过GPU渲染，最终呈现到安卓GLSurfaceView上面。
Opengl ES 渲染 I420的过程：
创建三个surface，分别代表Y平面，U平面，和V平面；
在shader中实现 I420转RGB，经过GPU渲染，最终呈现到安卓GLSurfaceView上面。
* 关于GLSurfaceView如何使用，这里不展开，仅仅记录jni层的render如何编写。
【代码】
代码基于安卓源码WebRTC的YUV渲染部分，加了YUV数据类型的判断和NV12相关的逻辑(标红)。
/*
* Copyright (c) 2012 The WebRTC project authors. All Rights Reserved.
*
* Use of this source code is governed by a BSD-style license
* that can be found in the LICENSE file in the root of the source
* tree. An additional intellectual property rights grant can be found
* in the file PATENTS. All contributing project authors may
* be found in the AUTHORS file in the root of the source tree.
*/
#include <GLES2/gl2.h>
#include <GLES2/gl2ext.h>
#include <stdio.h>
#include <stdlib.h>
#include <stdint.h>
#include <stdio.h>
extern "C" {
#include "w_log.h"
}
#include "render_init.h"
#include "render_opengles20.h"
int32_t localColorFMT;
const char RenderOpenGles20::g_indices[] = { 0, 3, 2, 0, 2, 1 };
const char RenderOpenGles20::g_vertextShader[] = {
"attribute vec4 aPosition;\n"
"attribute vec2 aTextureCoord;\n"
"varying vec2 vTextureCoord;\n"
"void main() {\n"
" gl_Position = aPosition;\n"
" vTextureCoord = aTextureCoord;\n"
"}\n" };
// The fragment shader.
// Do YUV to RGB565 conversion.
const char RenderOpenGles20::g_fragmentShader[] = {
"precision mediump float;\n"
"uniform sampler2D Ytex;\n"
"uniform sampler2D Utex,Vtex;\n"
"varying vec2 vTextureCoord;\n"
"uniform int colorFMT;"
"void main(void) {\n"
" float nx,ny,r,g,b,y,u,v;\n"
" mediump vec4 txl,ux,vx;"
" nx=vTextureCoord[0];\n"
" ny=vTextureCoord[1];\n"
" if (colorFMT == 21){"
" y=texture2D(Ytex,vec2(nx,ny)).r;\n"
" u=texture2D(Utex,vec2(nx,ny)).r;\n"
" v=texture2D(Utex,vec2(nx,ny)).a;\n"
" }"
" else {"
" y=texture2D(Ytex,vec2(nx,ny)).r;\n"
" u=texture2D(Utex,vec2(nx,ny)).r;\n"
" v=texture2D(Vtex,vec2(nx,ny)).r;\n"
" }"
//" y = v;\n"+
" y=1.1643*(y-0.0625);\n"
" u=u-0.5;\n"
" v=v-0.5;\n"
" r=y+1.5958*v;\n"
" g=y-0.39173*u-0.81290*v;\n"
" b=y+2.017*u;\n"
" gl_FragColor=vec4(r,g,b,1.0);\n"
"}\n" };
RenderOpenGles20::RenderOpenGles20() :
_id(0),
_textureWidth(-1),
_textureHeight(-1),
_colorFMT(-1)
{
LOGI("%s: id %d", __FUNCTION__, (int) _id);
const GLfloat vertices[20] = {
// X, Y, Z, U, V
1, -1, 0, 1, 0, // Bottom Left
-1, -1, 0, 0, 0, //Bottom Right
-1, 1, 0, 0, 1, //Top Right
1, 1, 0, 1, 1 }; //Top Left
memcpy(_vertices, vertices, sizeof(_vertices));
}
RenderOpenGles20::~RenderOpenGles20() {
glDeleteTextures(3, _textureIds);
}
int32_t RenderOpenGles20::SetRotateMode(){
int32_t zOrder = 0;
GLfloat left = 1;
GLfloat right = 0;
GLfloat top = 0;
GLfloat bottom = 1; // rotate
LOGI("Should rotate");
SetCoordinates(zOrder, left, top, right, bottom);
// set the vertices array in the shader
// _vertices contains 4 vertices with 5 coordinates.
// 3 for (xyz) for the vertices and 2 for the texture
glVertexAttribPointer(_positionHandle, 3, GL_FLOAT, false,
5 * sizeof(GLfloat), _vertices);
checkGlError("glVertexAttribPointer aPosition");
glEnableVertexAttribArray(_positionHandle);
checkGlError("glEnableVertexAttribArray positionHandle");
// set the texture coordinate array in the shader
// _vertices contains 4 vertices with 5 coordinates.
// 3 for (xyz) for the vertices and 2 for the texture
glVertexAttribPointer(_textureHandle, 2, GL_FLOAT, false, 5
* sizeof(GLfloat), &_vertices[3]);
checkGlError("glVertexAttribPointer maTextureHandle");
glEnableVertexAttribArray(_textureHandle);
checkGlError("glEnableVertexAttribArray textureHandle");
LOGI("Rotate Done");
}
int32_t RenderOpenGles20::SetFlags(uint32_t flags){
LOGI("Flags: %d", flags);
if (0 == (flags & FLAG_ROTATE)){
SetRotateMode();
}
}
int32_t RenderOpenGles20::Setup(int32_t width, int32_t height) {
LOGE("%s: width %d, height %d", __FUNCTION__, (int) width,
(int) height);
printGLString("Version", GL_VERSION);
printGLString("Vendor", GL_VENDOR);
printGLString("Renderer", GL_RENDERER);
printGLString("Extensions", GL_EXTENSIONS);
int maxTextureImageUnits[2];
int maxTextureSize[2];
glGetIntegerv(GL_MAX_TEXTURE_IMAGE_UNITS, maxTextureImageUnits);
glGetIntegerv(GL_MAX_TEXTURE_SIZE, maxTextureSize);
LOGE("%s: number of textures %d, size %d", __FUNCTION__,
(int) maxTextureImageUnits[0], (int) maxTextureSize[0]);
_program = createProgram(g_vertextShader, g_fragmentShader);
if (!_program) {
LOGE("%s: Could not create program", __FUNCTION__);
return -1;
}
int positionHandle = glGetAttribLocation(_program, "aPosition");
checkGlError("glGetAttribLocation aPosition");
if (positionHandle == -1) {
LOGE("%s: Could not get aPosition handle", __FUNCTION__);
return -1;
}
_positionHandle = positionHandle;
int textureHandle = glGetAttribLocation(_program, "aTextureCoord");
checkGlError("glGetAttribLocation aTextureCoord");
if (textureHandle == -1) {
LOGE("%s: Could not get aTextureCoord handle", __FUNCTION__);
return -1;
}
_textureHandle = textureHandle;
// set the vertices array in the shader
// _vertices contains 4 vertices with 5 coordinates.
// 3 for (xyz) for the vertices and 2 for the texture
glVertexAttribPointer(positionHandle, 3, GL_FLOAT, false,
5 * sizeof(GLfloat), _vertices);
checkGlError("glVertexAttribPointer aPosition");
glEnableVertexAttribArray(positionHandle);
checkGlError("glEnableVertexAttribArray positionHandle");
// set the texture coordinate array in the shader
// _vertices contains 4 vertices with 5 coordinates.
// 3 for (xyz) for the vertices and 2 for the texture
glVertexAttribPointer(textureHandle, 2, GL_FLOAT, false, 5
* sizeof(GLfloat), &_vertices[3]);
checkGlError("glVertexAttribPointer maTextureHandle");
glEnableVertexAttribArray(textureHandle);
checkGlError("glEnableVertexAttribArray textureHandle");
glUseProgram(_program);
int i = glGetUniformLocation(_program, "Ytex");
checkGlError("glGetUniformLocation");
glUniform1i(i, 0); /* Bind Ytex to texture unit 0 */ // 给shader里面的Ytex变量赋值
checkGlError("glUniform1i Ytex");
i = glGetUniformLocation(_program, "Utex");
checkGlError("glGetUniformLocation Utex");
glUniform1i(i, 1); /* Bind Utex to texture unit 1 */ // 给shader里面的Utex变量赋值
checkGlError("glUniform1i Utex");
i = glGetUniformLocation(_program, "Vtex");
checkGlError("glGetUniformLocation");
glUniform1i(i, 2); /* Bind Vtex to texture unit 2 */ // 给shader里面的Vtex变量赋值
checkGlError("glUniform1i Vtex");
glViewport(0, 0, width, height);// 视窗大小，只在setup函数的时候执行一次。
LOGE("ViewPort:%d %d", width , height);
checkGlError("glViewport");
return 0;
}
// SetCoordinates
// Sets the coordinates where the stream shall be rendered.
// Values must be between 0 and 1.
int32_t RenderOpenGles20::SetCoordinates(int32_t zOrder,
const float left,
const float top,
const float right,
const float bottom) {
if ((top > 1 || top < 0) || (right > 1 || right < 0) ||
(bottom > 1 || bottom < 0) || (left > 1 || left < 0)) {
LOGE("%s: Wrong coordinates", __FUNCTION__);
return -1;
}
// X, Y, Z, U, V
// -1, -1, 0, 0, 1, // Bottom Left
// 1, -1, 0, 1, 1, //Bottom Right
// 1, 1, 0, 1, 0, //Top Right
// -1, 1, 0, 0, 0 //Top Left
// Bottom Left
_vertices[0] = (left * 2) - 1;
_vertices[1] = -1 * (2 * bottom) + 1;
_vertices[2] = zOrder;
//Bottom Right
_vertices[5] = (right * 2) - 1;
_vertices[6] = -1 * (2 * bottom) + 1;
_vertices[7] = zOrder;
//Top Right
_vertices[10] = (right * 2) - 1;
_vertices[11] = -1 * (2 * top) + 1;
_vertices[12] = zOrder;
//Top Left
_vertices[15] = (left * 2) - 1;
_vertices[16] = -1 * (2 * top) + 1;
_vertices[17] = zOrder;
return 0;
}
GLuint RenderOpenGles20::loadShader(GLenum shaderType, const char* pSource)
{
GLuint shader = glCreateShader(shaderType);
if (shader) {
glShaderSource(shader, 1, &pSource, NULL);
glCompileShader(shader);
GLint compiled = 0;
glGetShaderiv(shader, GL_COMPILE_STATUS, &compiled);
if (!compiled) {
GLint infoLen = 0;
glGetShaderiv(shader, GL_INFO_LOG_LENGTH, &infoLen);
if (infoLen) {
char* buf = (char*) malloc(infoLen);
if (buf) {
glGetShaderInfoLog(shader, infoLen, NULL, buf);
LOGE("%s: Could not compile shader %d: %s",
__FUNCTION__, shaderType, buf);
free(buf);
}
glDeleteShader(shader);
shader = 0;
}
}
}
return shader;
}
GLuint RenderOpenGles20::createProgram(const char* pVertexSource,
const char* pFragmentSource) {
GLuint vertexShader = loadShader(GL_VERTEX_SHADER, pVertexSource);
if (!vertexShader) {
return 0;
}
GLuint pixelShader = loadShader(GL_FRAGMENT_SHADER, pFragmentSource);
if (!pixelShader) {
return 0;
}
GLuint program = glCreateProgram();
if (program) {
glAttachShader(program, vertexShader);
checkGlError("glAttachShader");
glAttachShader(program, pixelShader);
checkGlError("glAttachShader");
glLinkProgram(program);
GLint linkStatus = GL_FALSE;
glGetProgramiv(program, GL_LINK_STATUS, &linkStatus);
if (linkStatus != GL_TRUE) {
GLint bufLength = 0;
glGetProgramiv(program, GL_INFO_LOG_LENGTH, &bufLength);
if (bufLength) {
char* buf = (char*) malloc(bufLength);
if (buf) {
glGetProgramInfoLog(program, bufLength, NULL, buf);
LOGE("%s: Could not link program: %s",
__FUNCTION__, buf);
free(buf);
}
}
glDeleteProgram(program);
program = 0;
}
}
return program;
}
void RenderOpenGles20::printGLString(const char *name, GLenum s) {
const char *v = (const char *) glGetString(s);
LOGI("GL %s = %s\n", name, v);
}
void RenderOpenGles20::checkGlError(const char* op) {
#ifdef ANDROID_LOG
for (GLint error = glGetError(); error; error = glGetError()) {
LOGE("after %s() glError (0x%x)\n", op, error);
}
#else
return;
#endif
}
static void InitializeTexture(int name, int id, int width, int height, uint32_t format) {
glActiveTexture(name);
glBindTexture(GL_TEXTURE_2D, id);
glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);
glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE);
glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE);
glTexImage2D(GL_TEXTURE_2D, 0, format, width, height, 0,
format, GL_UNSIGNED_BYTE, NULL);
}
// Uploads a plane of pixel data, accounting for stride != width*bpp.
// 没用到的函数
static void GlTexSubImage2D(GLsizei width, GLsizei height, int stride,
const uint8_t* plane) {
if (stride == width) {
// Yay! We can upload the entire plane in a single GL call.
glTexSubImage2D(GL_TEXTURE_2D, 0, 0, 0, width, height, GL_LUMINANCE,
GL_UNSIGNED_BYTE,
static_cast<const GLvoid*>(plane));
} else {
// Boo! Since GLES2 doesn't have GL_UNPACK_ROW_LENGTH and Android doesn't
// have GL_EXT_unpack_subimage we have to upload a row at a time. Ick.
for (int row = 0; row < height; ++row) {
glTexSubImage2D(GL_TEXTURE_2D, 0, 0, row, width, 1, GL_LUMINANCE,
GL_UNSIGNED_BYTE,
static_cast<const GLvoid*>(plane + (row * stride)));
}
}
}
int32_t RenderOpenGles20::Render(void * data, int32_t widht, int32_t height)
{
LOGI("%s: id %d", __FUNCTION__, (int) _id);
glUseProgram(_program);
checkGlError("glUseProgram");
if (_colorFMT != localColorFMT || _textureWidth != (GLsizei) widht || _textureHeight != (GLsizei) height) {
SetupTextures(widht, height);
}
UpdateTextures(data, widht, height);
glDrawElements(GL_TRIANGLES, 6, GL_UNSIGNED_BYTE, g_indices);
checkGlError("glDrawArrays");
return 0;
}
void RenderOpenGles20::SetupTextures(int32_t width, int32_t height)
{
glDeleteTextures(3, _textureIds);
glGenTextures(3, _textureIds); //Generate the Y, U and V texture
InitializeTexture(GL_TEXTURE0, _textureIds[0], width, height, GL_LUMINANCE);
GLint i = glGetUniformLocation(_program, "colorFMT");
checkGlError("glGetUniformLocation colorFMT");
glUniform1i(i, localColorFMT); // 给shader里面的coloFMT变量赋值
checkGlError("glUniform1i colorFMT");
_colorFMT = localColorFMT;
LOGI("localColorFMT:%d", localColorFMT);
if (localColorFMT == COLOR_FormatYUV420Planar){
InitializeTexture(GL_TEXTURE1, _textureIds[1], width / 2, height / 2, GL_LUMINANCE);
InitializeTexture(GL_TEXTURE2, _textureIds[2], width / 2, height / 2, GL_LUMINANCE); //注意这里体现了I420三平面
}
else if (localColorFMT == COLOR_FormatYUV420SemiPlanar) {
InitializeTexture(GL_TEXTURE1, _textureIds[1], width / 2, height / 2, GL_LUMINANCE_ALPHA); // 这里体现了NV12两平面
}
/* 与直接使用RBGA数据不同，这里的参数采用的是GL_LUMINANCE，与GL_LUMINANCE_ALPHA，
GL_RGBA单独保存R、G、B、A四个数据，而GL_LUMINANCE将这四个数据合并成一个，
因为这样1个Y就可以与1个RGBA对应。GL_LUMINANCE_ALPHA代表首先是亮度，然后是alpha值，
这样我们就能将U值与V值分别取出。参考[2]*/
checkGlError("SetupTextures");
_textureWidth = width;
_textureHeight = height;
}
void RenderOpenGles20::UpdateTextures(void* data, int32_t widht, int32_t height)
{
glActiveTexture(GL_TEXTURE0);
glBindTexture(GL_TEXTURE_2D, _textureIds[0]);
glTexSubImage2D(GL_TEXTURE_2D, 0, 0, 0, widht, height, GL_LUMINANCE, GL_UNSIGNED_BYTE,
data);
LOGI("localColorFMT:%d", localColorFMT);
if (localColorFMT == COLOR_FormatYUV420Planar){
glActiveTexture(GL_TEXTURE1);
glBindTexture(GL_TEXTURE_2D, _textureIds[1]);
glTexSubImage2D(GL_TEXTURE_2D, 0, 0, 0, widht / 2, height / 2, GL_LUMINANCE,
GL_UNSIGNED_BYTE, (char *)data + widht * height);
glActiveTexture(GL_TEXTURE2);
glBindTexture(GL_TEXTURE_2D, _textureIds[2]);
glTexSubImage2D(GL_TEXTURE_2D, 0, 0, 0, widht / 2, height / 2, GL_LUMINANCE,
GL_UNSIGNED_BYTE, (char *)data + widht * height * 5 / 4);
}
else if (localColorFMT == COLOR_FormatYUV420SemiPlanar){
glActiveTexture(GL_TEXTURE1);
glBindTexture(GL_TEXTURE_2D, _textureIds[1]);
glTexSubImage2D(GL_TEXTURE_2D, 0, 0, 0, widht / 2, height / 2, GL_LUMINANCE_ALPHA,
GL_UNSIGNED_BYTE, (char *)data + widht * height);
}
checkGlError("UpdateTextures");
}
【参考】
[1] 关于shader的编写，这部分可以参考： https://www.jianshu.com/p/39cde80d60e2 （这份资料的 glTexImage2D 似乎不正确，这部分并未参考）
[2] 关于 glTexImage2D 的操作，NV12和I420是不一样的，这篇讲渲染NV12的文章讲的很清楚：https://www.cnblogs.com/jukan/p/6994048.html（shader部分则未用作参考）
标签：program,YUV,I420,安卓,vertices,height,shader,checkGlError,GL 来源： https://www.cnblogs.com/i-am-normal/p/11973512.html