Skip to content

Commit 31a2ee3

Browse files
CharonChuiCharonChui
committed
update
1 parent a4e7ce7 commit 31a2ee3

10 files changed

+66
-96
lines changed

‎VideoDevelopment/OpenGL/1.OpenGL简介.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -224,7 +224,7 @@ Android 框架中有如下两个基本类，用于通过 OpenGL ES API 来创建
224224

225225

226226

227-
参考
227+
### 参考
228228

229229
---
230230

‎VideoDevelopment/OpenGL/10.GLSurfaceView+MediaPlayer播放视频.md‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ GLSurfaceView -> setRender -> onSurfaceCreated回调方法中构造一个Surface
1717

1818
- 顶点着色器
1919

20-
```xml
20+
```glsl
2121
#version 300 es
2222
in vec4 vPosition;
2323
in vec2 vCoordPosition;
@@ -33,7 +33,7 @@ GLSurfaceView -> setRender -> onSurfaceCreated回调方法中构造一个Surface
3333

3434
这里需要注意一下，就是做相机预览和视频播放的话，纹理的类型需要使用samplerExternalOES，而不是之前渲染图片的sampler2D。这是因为相机和视频的数据是YUV的，而OpenGL ES是RGB的，samplerExternalOES内部会进行处理。#extension用于启用和设置扩展的行为。格式为#extension all : behavior。behavior的可选值有: require、enable、warn、disable。
3535

36-
```xml
36+
```glsl
3737
#version 300 es
3838
#extension GL_OES_EGL_image_external_essl3 : require
3939
precision mediump float;

‎VideoDevelopment/OpenGL/11.OpenGL ES滤镜.md‎

Lines changed: 14 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -38,20 +38,6 @@ void main(){
3838

3939

4040

41-
42-
43-
44-
45-
滤镜的编写主要是靠基类。
46-
47-
- 先抽取BaseFilter类，封装好每个滤镜的着色器及onDraw等方法
48-
- 不同的滤镜集成该BaseFilter类
49-
- 在Renderder接口的实现类中去创建不同的Filter类，然后在onDrawFrame方法中去调用该filter.onDraw方法
50-
51-
滤镜的不同大部分只需要修改片元着色器就可以了。
52-
53-
54-
5541
### 反色滤镜
5642

5743
RGB三个通道的颜色取反，而alpha通道不变。
@@ -64,7 +50,7 @@ RGB三个通道的颜色取反，而alpha通道不变。
6450

6551
纹理默认传入的读取范围是(0,0)到(1,1)内的颜色值。如果对读取的位置进行调整修改，那么就可以做出各种各样的效果，例如缩放动画就是让读取的范围改成(-1,-1)到(2,2)。
6652

67-
## 看完了疯了是不是，要做个滤镜效果，各种计算我实在弄不明白
53+
### 看完了疯了是不是，要做个滤镜效果，各种计算我实在弄不明白
6854

6955
最简单的方法就是通过LUT方法，通过设计师提供的LUT文件来实现预定的滤镜效果。基本思路如下：
7056

@@ -86,9 +72,22 @@ RGB三个通道的颜色取反，而alpha通道不变。
8672

8773

8874

75+
## 视频播放滤镜实现
8976

77+
滤镜的编写主要是靠基类。
78+
79+
- 先抽取BaseFilter类，封装好每个滤镜的着色器及onDraw等方法。
80+
- 不同的滤镜都继承该BaseFilter类，然后实现有区别的部分。其实每个不同滤镜的区别就是着色器的不同。
81+
- 在Renderder接口的实现类中去创建不同的Filter类，然后在onDrawFrame方法中去调用该filter.onDraw方法。
82+
83+
滤镜的不同大部分只需要修改片元着色器就可以了。
9084

85+
### 滤镜的基类
9186

87+
- onCreate()：创建
88+
- onSizeChange()：滤镜尺寸改变
89+
- onDraw()：绘制每一帧
90+
- onDestroy()：销毁，用于资源回收。
9291

9392

9493

‎VideoDevelopment/OpenGL/3.GLSurfaceView源码解析.md‎

Lines changed: 17 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
我感觉还是先看一下源码，了解一下内部的流程，再接着学习其他的OpenGL部分会更合适。
44

5-
从上一篇文章中GLSurfaceView的使用中可以看到入口是setRenderer()方法，这里就卡一下setRenderder(Renderer renderer)方法的实现:
5+
从上一篇文章中GLSurfaceView的使用中可以看到入口是setRenderer()方法，这里就看一下setRenderder(Renderer renderer)方法的实现:
66

77
- Renderer接口
88

@@ -50,7 +50,7 @@ public void setRenderer(Renderer renderer) {
5050
super();
5151
mWidth = 0;
5252
mHeight = 0;
53-
// 连续渲染模式下是true，如果是按需渲染模式就为false，然后通过requesetRender()方法来修改它的值
53+
// 连续渲染模式下是true，如果是按需渲染模式就为false，然后通过requesetRender()方法来修改它的值
5454
mRequestRender = true;
5555
// 默认的渲染模式
5656
mRenderMode = RENDERMODE_CONTINUOUSLY;
@@ -74,7 +74,7 @@ public void setRenderer(Renderer renderer) {
7474
sGLThreadManager.threadExiting(this);
7575
}
7676
}
77-
// GLSurfaceView的onPause方法会调用到这里
77+
// GLSurfaceView的onPause方法会调用到这里
7878
public void onPause() {
7979
synchronized (sGLThreadManager) {
8080
if (LOG_PAUSE_RESUME) {
@@ -97,7 +97,7 @@ public void setRenderer(Renderer renderer) {
9797
}
9898
}
9999
}
100-
// GLSurfaceView的onResume方法会调用到这里
100+
// GLSurfaceView的onResume方法会调用到这里
101101
public void onResume() {
102102
synchronized (sGLThreadManager) {
103103
if (LOG_PAUSE_RESUME) {
@@ -135,7 +135,7 @@ public void setRenderer(Renderer renderer) {
135135

136136
```java
137137
private void guardedRun() throws InterruptedException {
138-
//GL帮助类，内部建立GL环境
138+
//GL帮助类，内部建立GL环境
139139
mEglHelper = new EglHelper(mGLSurfaceViewWeakRef);
140140
mHaveEglContext = false;
141141
mHaveEglSurface = false;
@@ -159,16 +159,15 @@ public void setRenderer(Renderer renderer) {
159159
while (true) {
160160
synchronized (sGLThreadManager) {
161161
while (true) {
162-
// 外部请求退出
162+
// 外部请求退出
163163
if (mShouldExit) {
164164
return;
165-
}
166-
// 如果还有GL线程中要处理的事件没处理完，就先处理事件
165+
// 如果还有GL线程中要处理的事件没处理完，就先处理事件
167166
if (! mEventQueue.isEmpty()) {
168167
event = mEventQueue.remove(0);
169168
break;
170169
}
171-
// 更新onResume和onPause时的状态变化
170+
// 更新onResume和onPause时的状态变化
172171
// Update the pause state.
173172
boolean pausing = false;
174173
if (mPaused != mRequestPaused) {
@@ -180,7 +179,7 @@ public void setRenderer(Renderer renderer) {
180179
Log.i("GLThread", "mPaused is now " + mPaused + " tid=" + getId());
181180
}
182181
}
183-
// 需要释放EGLContext
182+
// 需要释放EGLContext
184183
// Do we need to give up the EGL context?
185184
if (mShouldReleaseEglContext) {
186185
if (LOG_SURFACE) {
@@ -191,22 +190,22 @@ public void setRenderer(Renderer renderer) {
191190
mShouldReleaseEglContext = false;
192191
askedToReleaseEglContext = true;
193192
}
194-
// 如果EGLContext丢失，需要销毁EGLSurface和EGLContext
193+
// 如果EGLContext丢失，需要销毁EGLSurface和EGLContext
195194
// Have we lost the EGL context?
196195
if (lostEglContext) {
197196
stopEglSurfaceLocked();
198197
stopEglContextLocked();
199198
lostEglContext = false;
200199
}
201-
// 如果onPause了并且当前GLSurface已经存在了，就销毁EGLSurface
200+
// 如果onPause了并且当前GLSurface已经存在了，就销毁EGLSurface
202201
// When pausing, release the EGL surface:
203202
if (pausing && mHaveEglSurface) {
204203
if (LOG_SURFACE) {
205204
Log.i("GLThread", "releasing EGL surface because paused tid=" + getId());
206205
}
207206
stopEglSurfaceLocked();
208207
}
209-
// 接受了onPuase信号，并且当前EGLContext存在时，需要根据用户的设置来决定是否销毁EGLContext
208+
// 接受了onPuase信号，并且当前EGLContext存在时，需要根据用户的设置来决定是否销毁EGLContext
210209
// When pausing, optionally release the EGL Context:
211210
if (pausing && mHaveEglContext) {
212211
GLSurfaceView view = mGLSurfaceViewWeakRef.get();
@@ -256,10 +255,10 @@ public void setRenderer(Renderer renderer) {
256255
finishDrawingRunnable = mFinishDrawingRunnable;
257256
mFinishDrawingRunnable = null;
258257
}
259-
// readyToDraw()方法内部会判断是否已经pause或者mRequestRender是否是true以及是否是主动渲染模式。如果是被动渲染的模式mRequestRender就会是false，只有调用requestRender()方法后才会是true，如果是主动渲染模式readyToDraw()就不用根据mRequestRender来判断。
258+
// readyToDraw()方法内部会判断是否已经pause或者mRequestRender是否是true以及是否是主动渲染模式。如果是被动渲染的模式mRequestRender就会是false，只有调用requestRender()方法后才会是true，如果是主动渲染模式readyToDraw()就不用根据mRequestRender来判断。
260259
// Ready to draw?
261260
if (readyToDraw()) {
262-
// 没有EGLContext就去调用EGLHelper来创建，第一次会走到这里先创建EGLContext
261+
// 没有EGLContext就去调用EGLHelper来创建，第一次会走到这里先创建EGLContext
263262
// If we don't have an EGL context, try to acquire one.
264263
if (! mHaveEglContext) {
265264
if (askedToReleaseEglContext) {
@@ -332,7 +331,7 @@ public void setRenderer(Renderer renderer) {
332331
}
333332

334333
if (createEglSurface) {
335-
// EglHelper创建EglSurface
334+
// EglHelper创建EglSurface
336335
if (mEglHelper.createSurface()) {
337336
synchronized(sGLThreadManager) {
338337
mFinishedCreatingEglSurface = true;
@@ -554,7 +553,7 @@ public void setRenderer(Renderer renderer) {
554553
*/
555554
GLSurfaceView view = mGLSurfaceViewWeakRef.get();
556555
if (view != null) {
557-
// 也是通过EGLWindowSurfaceFactory来创建EGLSurface，如果没有设置就会调用默认的DefaultWindowSurfaceFactory。后面说一下这里
556+
// 也是通过EGLWindowSurfaceFactory来创建EGLSurface，如果没有设置就会调用默认的DefaultWindowSurfaceFactory。后面说一下这里
558557
mEglSurface = view.mEGLWindowSurfaceFactory.createWindowSurface(mEgl,
559558
mEglDisplay, mEglConfig, view.getHolder());
560559
} else {
@@ -619,7 +618,7 @@ public void setRenderer(Renderer renderer) {
619618
EGL10.EGL_NO_CONTEXT);
620619
GLSurfaceView view = mGLSurfaceViewWeakRef.get();
621620
if (view != null) {
622-
// EGLWindowSurfaceFactory除了创建EGLSurface还有销毁的功能
621+
// EGLWindowSurfaceFactory除了创建EGLSurface还有销毁的功能
623622
view.mEGLWindowSurfaceFactory.destroySurface(mEgl, mEglDisplay, mEglSurface);
624623
}
625624
mEglSurface = null;

‎VideoDevelopment/OpenGL/4.GLTextureView实现.md‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -12,14 +12,14 @@
1212
```
1313

1414
- ```java
15-
@Override
16-
public void setSurfaceTextureListener(SurfaceTextureListener listener) {
17-
if (mRenderer == null) {
18-
// 与普通TextureView一样
19-
super.setSurfaceTextureListener(listener);
20-
}
21-
Log.e(TAG, "setSurfaceTextureListener preserved, setRenderer() instead?");
15+
@Override
16+
public void setSurfaceTextureListener(SurfaceTextureListener listener) {
17+
if (mRenderer == null) {
18+
// 与普通TextureView一样
19+
super.setSurfaceTextureListener(listener);
2220
}
21+
Log.e(TAG, "setSurfaceTextureListener preserved, setRenderer() instead?");
22+
}
2323
```
2424

2525
```java

‎VideoDevelopment/OpenGL/5.OpenGL ES绘制三角形.md‎

Lines changed: 4 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -152,17 +152,6 @@ Preferences -> Plugins -> 搜GLSL Support安装就可以了。
152152

153153

154154

155-
### 编写GLSurfaceView.Render类
156-
157-
主要有以下功能:
158-
159-
1. 声明绘制图形的坐标和颜色数据
160-
2. 为顶点位置及颜色申请本地内存
161-
3. 加载编译顶点着色器和片段着色器
162-
4. 创建program，连接顶点和片段着色器并链接program
163-
5. 设置窗口大小
164-
6. 完成绘制
165-
166155
```java
167156
public class TriangleActivity extends Activity {
168157
private GLSurfaceView mGlSurfaceView;
@@ -438,7 +427,7 @@ public class TriangleRender implements GLSurfaceView.Renderer {
438427

439428
效果如下:
440429

441-
![](https://raw.githubusercontent.com/CharonChui/Pictures/master/opengl_es_tri.jpg)
430+
<img src="https://raw.githubusercontent.com/CharonChui/Pictures/master/opengl_es_tri.jpg" style="zoom:20%;" />
442431

443432
我们设置的是数据来看，应该是等腰三角形，但是实际效果并不是，这是因为前面说到的OpenGL ES使用的是虚拟坐标导致的。如果想让绘制一个等腰三角形该怎么做呢？
444433

@@ -499,8 +488,7 @@ int rmOffset, //变换矩阵的起始位置（偏移量）
499488
float eyeX,float eyeY, float eyeZ, //相机位置
500489
float centerX,float centerY,float centerZ, //观测点位置
501490
float upX,float upY,float upZ) //up向量在xyz上的分量) {
502-
503-
------------省略代码-------------
491+
...
504492
}
505493
```
506494

@@ -537,7 +525,7 @@ Android OpenGL ES的投影分为两种:
537525
float top,//相对观察点近面的上边距
538526
float near,//相对观察点近面距离
539527
float far) //相对观察点远面距离{
540-
---------------省略代码--------------
528+
...
541529
}
542530
```
543531

@@ -569,7 +557,7 @@ Android OpenGL ES的投影分为两种:
569557
float top, //相对观察点近面的上边距
570558
float near, //相对观察点近面距离
571559
float far) //相对观察点远面距离 {
572-
---------------省略代码--------------
560+
...
573561
}
574562
```
575563

‎VideoDevelopment/OpenGL/6.OpenGL ES绘制矩形及圆形.md‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -422,8 +422,7 @@ public class CircleRender extends BaseGLSurfaceViewRenderer {
422422
}
423423
```
424424

425-
426-
[上一篇: 5.OpenGL ES绘制三角形](https://github.com/CharonChui/AndroidNote/blob/master/VideoDevelopment/OpenGL/5.OpenGL%20ES%E7%BB%98%E5%88%B6%E4%B8%89%E8%A7%92%E5%BD%A2.md)
425+
[上一篇: 5.OpenGL ES绘制三角形](https://github.com/CharonChui/AndroidNote/blob/master/VideoDevelopment/OpenGL/5.OpenGL%20ES%E7%BB%98%E5%88%B6%E4%B8%89%E8%A7%92%E5%BD%A2.md)
427426
[下一篇: 7.OpenGL ES着色器语言GLSL](https://github.com/CharonChui/AndroidNote/blob/master/VideoDevelopment/OpenGL/7.OpenGL%20ES%E7%9D%80%E8%89%B2%E5%99%A8%E8%AF%AD%E8%A8%80GLSL.md)
428427

429428
---

‎VideoDevelopment/OpenGL/7.OpenGL ES着色器语言GLSL.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -203,7 +203,7 @@ GLSL的类型转换与C不同。在GLSL中类型不可以自动提升，比如fl
203203
- radians(x)：角度转弧度
204204
- degrees(x)：弧度转角度
205205
- sin(x)：正弦函数，传入值为弧度。相同的还有cos余弦函数、tan正切函数、asin反正弦、acos反余弦
206-
- atan反正切
206+
- atan()：反正切
207207
- pow(x,y)：xy
208208
- exp(x)：ex
209209
- exp2(x)：2x

0 commit comments

Comments
 (0)