PPAPI中使用OpenGL ES绘图

在PPAPI中使用Chromium的3D图形接口一文中我们介绍了怎么使用PPB_Graphics3D接口，提供了一个简单示例，单机鼠标可以变换插件颜色。

foruok原创，如需转载请关注foruok的微信订阅号“程序视界”联系foruok。

PPB_Graphics3D是Chromium暴露给PPAPI的3D图形接口，类似衔接Open GL和本地窗口系统的EGL。我们使用PPB_Graphics3D的Create方法来创建context，然后使用PPB_Instance的BindGraphics将得到的OpenGL Context和插件实例绑定，再接下来，就可以使用OpenGL来绘图了。在这个过程中，PPB_Graphics3D替代了EGL。

Chromium使用的应该是WebGL，也就是OpenGL ES 2.0 for the Web，它暴露给PPAPI的gl接口是C结构体加函数指针的形式，有PPB_OpenGLES2、PPB_OpenGLES2FramebufferBlit、PPB_OpenGLES2ChromiumEnableFeature等，搜索ppb_opengles2*.h即可查看对应的接口定义。

关于OpenGL ES，可以看这里：https://www.khronos.org/opengles/。

PPAPI中使用OpenGL ES2

在PPAPI中使用Chromium的3D图形接口一文中我们提到了glInitializePPAPI和glSetCurrentContextPPAPI两个方法，解释一下。

• glInitializePPAPI

glInitializePPAPI做的事情就是把浏览器暴露给PPAPI的各种gl相关的接口都拿到（通过PPB_GetInterface），保存在全局变量中（参看gl2ext_ppapi.c），后续我们使用glXXX（参看gles2.c）函数时，实际上是通过保存下来的接口（结构体+函数指针），调用函数指针来实现的。我们用到的glXXX是宏定义，看起来和OpenGL的API一致，用起来方便。

我在ppapi_hello_gles.c的PPP_InitializeModule方法中添加了下面的代码：

if (GL_TRUE != glInitializePPAPI(get_browser_interface))
    return -1;

上面的代码初始化PPAPI相关的gl接口。

• glSetCurrentContextPPAPI

PPB_Graphics3D的Create方法创建一个图形上下文，OpenGL就用它绘图。glSetCurrentContextPPAPI方法（参看gl2ext_ppapi.c）需要的参数就是PPB_Graphics3D接口Create出来的那个context。

ppapi_hello_gles.c中的MakeAndBindGraphics3D函数创建了Graphics3D context，并调用glSetCurrentContextPPAPI来传递给封装gl C接口的模块：

PP_Resource MakeAndBindGraphics3D(PP_Instance instance,
    const struct PP_Size* size) {
    PP_Resource graphics;
    int32_t attribs[] = { PP_GRAPHICS3DATTRIB_WIDTH, 800,
        PP_GRAPHICS3DATTRIB_HEIGHT, 800,
        PP_GRAPHICS3DATTRIB_NONE };
    graphics = g_graphics_3d_interface->Create(instance, 0, attribs);
    if (!graphics)
        return 0;

    if (!g_instance_interface->BindGraphics(instance, graphics)) {
        g_core_interface->ReleaseResource(graphics);
        return 0;
    }

    glSetCurrentContextPPAPI(graphics);

    return graphics;
}

好啦，我们对PPAPI中使用Chromium的3D图形接口一文做了一些补充说明，了解了在PPAPI中可以使用OpenGL ES 2.0的接口来进行3D绘图，这种方式比基于软件和共享内存的Graphics 2D接口效率要高，它利用了GPU加速。接下来看看怎么使用gl接口来绘制一个简单的三角形。

绘制三角形

修改了ppapi_hello_gles实例，添加了glTriangle.h和glTriangle.c两个文件，它们实现了三角形绘制。大部分代码是我从《OpenGL ES 2.0 Programming Guide》一书中摘出来的，针对PPAPI做了修改。

glTriangle.h如下：

#ifndef GLTRIANGLE_DRAW_H
#define GLTRIANGLE_DRAW_H
#include "ppapi/lib/gl/include/GLES2/gl2.h"

GLboolean InitTriangle(void **userData);
void DrawTriangle(void *userData);

#endif

声明了两个函数，ppapi_hello_gles.c中会用到。

glTriangle.c如下：

/* Copyright (c) 2016 foruok. All rights reserved.
* 欢迎关注我的微信订阅号程序视界
* see: 《OpenGL ES 2.0 Programming Guide》
*/
#include "glTriangle.h"
#include <Windows.h>
#include "ppapi/lib/gl/include/GLES2/gl2.h"
#include "ppapi/lib/gl/gles2/gl2ext_ppapi.h"
#include "ppapi/lib/gl/include/GLES2/gl2ext.h"
#include <tchar.h>

typedef struct
{
    GLuint programObject;
} UserData;

/*
 * create a