[- 多媒體 -] OpenGLES3.0 接入視訊實現特效 - 引言

1.開篇

龍少:最近在寫什麼bug呢？
捷特:會用OpenGL播放視訊之後，感覺個很多知識都串到一起了。很多shader都是OpenGLES2.0，我順便用3.0的規範重塑了一下。
龍少:真是閒著沒事，播個視訊還要OpenGL, 哥VideoView一把梭你信不信?
捷特:少年，你對於力量一無所知，難到你以為視訊播放都是這樣的？

---

龍少:不然呢？還能這麼播？
捷特:縮放了解一下。
龍少:對View的變換也行啊，so easy

原始碼:com.toly1994.tolygl.gl.shape.player.VideoDrawer
shader: 頂點: video.vsh     片段:video_simple.fsh
複製程式碼

---

捷特:透視呢?
龍少:對View的變換...，應該也可以...

原始碼:com.toly1994.tolygl.gl.shape.player.VideoDrawer
shader: 頂點: video.vsh     片段:video_simple.fsh
複製程式碼

---

捷特:旋轉呢?
龍少:對View的變換......不知道行不行...

原始碼:com.toly1994.tolygl.gl.shape.player.VideoDrawer
shader: 頂點: video.vsh     片段:video_simple.fsh
複製程式碼

---

捷特:黑白呢?
龍少:控制View顯示時的RGB的值....

---

捷特:色效呢?
龍少:我......

原始碼:com.toly1994.tolygl.gl.shape.player.VideoDrawer
shader: 頂點: video.vsh     片段:video_gray.fsh
複製程式碼

---

捷特:負片呢?
龍少:我......

原始碼:com.toly1994.tolygl.gl.shape.player.VideoDrawer
shader: 頂點: video.vsh     片段:video_fupian.fsh
複製程式碼

---

捷特:六邊形馬賽克呢?
龍少:我......

原始碼:com.toly1994.tolygl.gl.shape.player.VideoDrawer
shader: 頂點: video.vsh     片段:video_mask.fsh
複製程式碼

---

捷特:分屏呢?
龍少:我......

原始碼:com.toly1994.tolygl.gl.shape.player.VideoDrawer
shader: 頂點: video.vsh     片段:video_split.fsh
複製程式碼

---

捷特:色動呢?
龍少:我......

原始碼:com.toly1994.tolygl.gl.shape.player.VideoDrawer2
shader: 頂點: video.vsh     片段:video_offset.fsh
複製程式碼

---

捷特:縮放顫動呢?
龍少:我......

原始碼:com.toly1994.tolygl.gl.shape.player.VideoDrawer2
shader: 頂點: video_scale.vsh     片段:video_scale.fsh
複製程式碼

---

捷特:靈魂出竅呢?
龍少:我......

原始碼:com.toly1994.tolygl.gl.shape.player.VideoDrawer2
shader: 頂點: video.vsh     片段:video_gost.fsh
複製程式碼

---

捷特:毛刺呢?
龍少:我......

原始碼:com.toly1994.tolygl.gl.shape.player.VideoDrawer2
shader: 頂點: video.vsh     片段:video_ci.fsh
複製程式碼

---

捷特:渦旋呢?
龍少:我......

原始碼:com.toly1994.tolygl.gl.shape.player.VideoDrawer
shader: 頂點: video.vsh     片段:video_rotate.fsh
複製程式碼

---

---

2.導言

不知從何說起，知識點挺多的。OpenGL是塊難啃的骨頭，但是一旦啃碎了，就會覺得真香。這把石中劍你拔不拔得起不是問題，關鍵在於你肯不肯拔。

OpenGLES2.0已成為歷史，以前寫了6篇ES2.0入門文章，雖然有略微的變化，但是核心思想還是不變的。不會玩矩陣，不瞭解三維相機，不明白顏色構造，懶得計算，只想CV,學啥都是白搭。

吾想要寫幾篇OpenGLES3.0的文章，直接開撕視訊，總感覺雲裡霧裡的。先寫些基礎的知識鋪墊一下，作為OpenGLES3.0最佳實踐。再結合視屏的播放特效來說說實際使用。可能的話後面會接入FFmpeg，讓編解碼大佬和渲染大佬並肩作戰。下面是一些入門OpenGLES的過程:

---

2.1 紅屏

相當於用顏色來說:"Hello World"

---

2.2 點

無中生有，萬物起源。在此將介紹著色器的使用，與圖形渲染流程。

---

2.3 視點與透視投影

雖然你是三維物體，但你的眼睛只能看到二維面，只是通過變動參考位置來感受三維物體。人們的日常生活，僅需要二維就足夠了。OpenGL為你開啟了一扇通往三維的大門它只是二維面上的模擬三維。

---

2.4 線與座標系

地心說，日心說？在我的世界(0,0,0)就是中心。紅色x軸向，藍色z軸向，綠色y軸向。瞭解世界座標是創造世界的第一步：

---

2.5 網格線

如何通過迴圈來收錄座標，是件挺重要的事。

---

2.6 繪製三角形

---

2.7 四邊形和五邊形

---

2.8 貼圖

---

2.9 操作和變換

手勢操作：

旋轉展示：

---

到這來就可以接入視訊了，視訊也就是一個貼圖而已，你完全可以將視訊貼在空間的任何位置。此後花分兩朵，各表一枝：

其一是視訊/相機的接入和特效、FFmpeg的接入，專注多媒體；
其二是複雜的空間立體圖形的繪製及環境渲染，專注圖形學。
複製程式碼

更多的細節也會慢慢說吧，畢竟不是一兩句就能說清的。不過以後沒那麼多空閒，可能更新的就比較慢了。日更變月更吧，有生之年系列，隨著更新會補連結，介意收藏此文。也會在長滿草的公眾號程式設計之王上收錄，歡迎除草。 如有興趣，可以先看先了解一些基礎知識，也就是萬變不離的宗。以前的2.0系列：

Android多媒體之GL-ES2戰記第一集--勇者集結
Android多媒體之GL-ES2戰記第二集--謎團立方
Android多媒體之GL-ES2戰記第三集--聖火之光
Android多媒體之GL-ES2戰記第四集--移形換影
Android多媒體之GL-ES2戰記第五集--宇宙之光
Android多媒體之GL-ES2戰記第六集--九層之臺

---

小結

馬上到2019年的最後一個月了，緬懷一下吧。今年的成長也很多，最起碼把Flutter的框架撕的差不多了，音視訊的知識也逐漸聯絡起來。拓撲、離散數學和量子力學作為茶餘飯後的科普知識基本瞭解一些；微積分忘得差不多了，有必要還得撿起來。總的看來，並沒有完成預期的目標。畢竟上半年算是廢了...... 不過也算對得起今年的標籤。
未來嘛，很遠，遠到我看不見。只是耳邊迴響那靈魂三問:我是誰，我來自何方，我終歸何處......

2017年標籤:"海的彼岸，有我未曾見證的風采"
2018年標籤:"海的彼岸，吾在征途"
2019年標籤:"向那些曾經無法跨越的鴻溝敬上——君臨"
2020年標籤:"封神之路,漫漫修遠"
複製程式碼

---

@張風捷特烈 2019.11.30 未允禁轉
我的公眾號:程式設計之王
~ END ~