我的OpenGL学习进阶之旅学习OpenGL ES 3.0 的实战 Awsome Demo （中）

Posted 2022-01-29 字节卷动

上一篇文章 【我的OpenGL学习进阶之旅】学习OpenGL ES 3.0 的实战 Awsome Demo （上） 介绍了一下项目和部分案例效果展示，这篇接着介绍其他的案例效果展示。

三篇完整版链接：

• 【我的OpenGL学习进阶之旅】学习OpenGL ES 3.0 的实战 Awsome Demo （上）
• 【我的OpenGL学习进阶之旅】学习OpenGL ES 3.0 的实战 Awsome Demo （中）
• 【我的OpenGL学习进阶之旅】学习OpenGL ES 3.0 的实战 Awsome Demo （下）之 图片转场和轮播特效专场

一、介绍

最近在学习OpenGL ES 3.0 相关技术，写了一个Demo工程，记录学习。

1.1 项目地址：

• https://github.com/ouyangpeng/OpenGLESDemo
  

1.2 项目介绍

主要是将下面来源的特效，自己手动敲一遍，熟悉OpenGL ES相关API和GLSL语法以及C++语法

1. 《OpenGL ES 3.0编程指南》 这本书
2. 【Learn OpenGL ES】 网站的一些示例
3. 字节流动的 NDK_OpenGLES_3_0 项目代码
4. 部分ShaderToy网站和 GLSL SANDBOX 网站上的特效移植到android端
5. 转场动画GLTransitions网站上的特效移植到android端

1.3 相关链接

关于 OpenGL ES的相关知识，
可以参考下面的博客查看：

1. 字节卷动 的 OpenGL ES 专栏
2. 字节流动 的 Android OpenGLES 3.0 专栏
3. 【Learn OpenGL ES】
4. ShaderToy
5. GLSL SANDBOX
6. 转场动画 https://gl-transitions.com/gallery

二、案例效果展示

接下来几个案例都是ShaderToy上的案例，移植到Android端来展示

40 展示一段 ShaderToy的特效：跳动的心

41 展示一段 ShaderToy的特效：不断漂浮的云朵

42 展示一段 ShaderToy的特效：时光隧道

43 展示一段 ShaderToy的特效：燃烧的旋转的主序星

44 展示一段 ShaderToy的特效：天路

45 展示一段 ShaderToy的特效：A Day

46 展示一段 ShaderToy的特效：Atmosphere system test

47 展示几段 贝塞尔曲线 绘制的曲边扇形 混合而成的效果

学习如何绘制 贝塞尔曲线

48 展示一个随着时间变化逐渐放大眼睛的效果

学习如何实现 大眼效果

49 展示一个随着时间变化逐渐瘦脸的效果

学习如何实现 瘦脸效果

50 展示 一个随着时间变化头部逐渐放大的效果

学习如何实现 大头效果

51 展示 一个随着时间变化头部跟着晃动的效果

学习如何实现 头部晃动效果

52 展示 一个 可视化实时音频 的效果

学习如何实现 可视化实时音频 效果

53 展示 一个 刮刮卡 的效果

学习如何实现 刮刮卡 效果

54 展示 一个 3D 阿凡达（Avatar）效果

学习如何实现 3D 阿凡达（Avatar）效果

55 展示 动态（水波纹）涟漪 效果

学习如何实现 动态（水波纹）涟漪 效果

• 实现效果1
  
• 实现效果2
  

56 又见MRT

再一次学习 MRT(多重渲染目标) 技术

57 OpenGL ES 帧缓冲区位块传送（Blit）

学习 FBO Blit 技术

58 使用uniform 缓冲区对象，即UBO来展示图片

学习uniform 缓冲区对象，即 UBO技术

59 使用OpenGL实现RGB到YUV的图像格式转换

学习 OpenGL实现RGB到YUV的图像格式转换技术

60 展示 OpenGL ES 共享上下文 多线程绘制 技术

学习 MULTI THREAD RENDER 技术

61 展示 OpenGL 使用 FreeType 渲染文字

学习 OpenGL ES 文字渲染 技术

62 展示 人像留色

学习 人像留色技术：人体区域保留彩色，人体区域之外灰度化。

63 展示 3D模型

学习如何使用模型加载库Assimp来加载3D模型

未完待续。。。