close

OpenGL(Open Graphics Library)是用於渲染2D、3D矢量圖形的跨語言、跨平台的應用程序編程接口(API),它由數百個不同的函數調用組成,用來呈現複雜的三維景象。下面介紹的實例實現了使用OpenGL在可轉動的立方體的各個表面上設置不同的背景圖像。此實例在Android Studio開發環境中編寫且運行在Android手機上。


01

實例功能


此實例主要通過使用GLSurfaceView控件加載自定義OpenGL渲染器Renderer,並在該Renderer中調用texImage2D()、glDrawArrays()方法等,從而實現為立方體表面設置不同的圖像。當實例運行之後,使用手指在立方體上朝不同方向滑動,即可展示立方體六個面的不同圖像,效果分別如圖1的左圖和右圖所示。

■圖1


02

實現代碼

publicclassMyRendererimplementsGLSurfaceView.Renderer{float[] myVerticesCoord = { }; //此處數值被省略,具體數值看源代碼float[] myTexturesCoord = { }; //此處數值被省略,具體數值看源代碼Context myContext;FloatBuffer myVerticesBuffer,myTexturesBuffer;ArrayList<Bitmap> myBitmaps=newArrayList<>();int[] myTextures =newint[6];floatmyRotationX =0.0f, myRotationY =0.0f;publicMyRenderer(Context context){myContext=context;myVerticesBuffer=createFloatBuffer(myVerticesCoord);myTexturesBuffer=createFloatBuffer(myTexturesCoord);//加載多幅圖像資源Bitmap myBitmap1= BitmapFactory.decodeResource(myContext.getResources(),R.mipmap.myimage1);Bitmap myBitmap2=BitmapFactory.decodeResource(myContext.getResources(),R.mipmap.myimage2);Bitmap myBitmap3=BitmapFactory.decodeResource(myContext.getResources(),R.mipmap.myimage3);Bitmap myBitmap4=BitmapFactory.decodeResource(myContext.getResources(),R.mipmap.myimage4);Bitmap myBitmap5=BitmapFactory.decodeResource(myContext.getResources(),R.mipmap.myimage5);Bitmap myBitmap6=BitmapFactory.decodeResource(myContext.getResources(),R.mipmap.myimage6);//將多幅圖像封裝至集合myBitmaps.add(myBitmap1);myBitmaps.add(myBitmap2);myBitmaps.add(myBitmap3);myBitmaps.add(myBitmap4);myBitmaps.add(myBitmap5);myBitmaps.add(myBitmap6);}@OverridepublicvoidonSurfaceCreated(GL10 gl,EGLConfig config){gl.glEnable(GL10.GL_CULL_FACE);gl.glEnable(GL10.GL_TEXTURE_2D);//生成指定數量的紋理gl.glGenTextures(myTextures.length,myTextures,0);for(inti=0;i<myTextures.length;i++){//綁定至指定紋理gl.glBindTexture(GL10.GL_TEXTURE_2D,myTextures[i]);//設置紋理過濾模式gl.glTexParameterf(GL10.GL_TEXTURE_2D,GL10.GL_TEXTURE_MIN_FILTER,GL10.GL_LINEAR);gl.glTexParameterf(GL10.GL_TEXTURE_2D,GL10.GL_TEXTURE_MAG_FILTER,GL10.GL_LINEAR);//將指定圖像資源加載至對應的紋理GLUtils.texImage2D(GL10.GL_TEXTURE_2D,0,myBitmaps.get(i),0);}}@OverridepublicvoidonSurfaceChanged(GL10 gl,intwidth,intheight){gl.glViewport(0,0,width,height);gl.glMatrixMode(GL10.GL_PROJECTION);gl.glLoadIdentity();floatmyRatio=(float)width/height;gl.glFrustumf(-myRatio,myRatio,-1,1,1,10);}@OverridepublicvoidonDrawFrame(GL10 gl){gl.glClearColor(1.0f,1.0f,1.0f,1.0f);gl.glClear(GL10.GL_COLOR_BUFFER_BIT);gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);gl.glEnableClientState(GL10.GL_TEXTURE_COORD_ARRAY);gl.glMatrixMode(GL10.GL_MODELVIEW);gl.glLoadIdentity();gl.glTranslatef(0f,0.0f,-2.0f);gl.glRotatef(myRotationX,1,0,0);gl.glRotatef(myRotationY,0,1,0);gl.glVertexPointer(3,GL10.GL_FLOAT,0,myVerticesBuffer);gl.glTexCoordPointer(2,GL10.GL_FLOAT,0,myTexturesBuffer);for(inti=0;i<myTextures.length;i++){ gl.glBindTexture(GL10.GL_TEXTURE_2D,myTextures[i]); //綁定至指定紋理gl.glDrawArrays(GL10.GL_TRIANGLES,i*6,6); //繪製指定圖像}}privateFloatBuffer createFloatBuffer(float[] floats){FloatBuffer myBuffer=ByteBuffer.allocateDirect(floats.length * 4).order(ByteOrder.nativeOrder()).asFloatBuffer();myBuffer.put(floats).position(0);returnmyBuffer;}}

03

代碼說明


上面這段代碼在MySampleO33\app\src\main\java\com\bin\luo\mysample\ MyRenderer.java文件中。在OpenGL中,有下列三種方式指定紋理:glTexImage1D()、 glTexImage2D()和 glTexImage3D(), 這三種方式對應於相應維數的紋理。在上面這段代碼中,GLUtils.texImage2D(GL10.GL_TEXTURE_2D,0,myBitmaps.get(i),0)使用的是 2D 版本,該方法的語法聲明如下:

staticvoidtexImage2D(inttarget, intlevel, Bitmap bitmap, intborder)

其中,參數int target表示操作的目標類型,設為 GL_TEXTURE_2D 即可。參數int level表示紋理的級別,設為 0 即可。參數Bitmap bitmap表示圖像。參數int border表示邊框,一般設為0。

關於MyRenderer類和MainActivity類的其他內容請參考此實例的對應源代碼。


04

補充說明


此文檔內容根據清華大學出版社出版的圖書《Android App開發超實用代碼集錦》 的「143 為立方體各面設置圖像」改寫,內容略有變動。


05

源代碼下載

關注微信公眾號,後台回復關鍵詞「立方體」即可獲得完整源代碼。


實例講解


Android-App開發超實用代碼集錦


精彩回顧



Android App開發超實用實例

jQuery Mobile在Android手機上實現抽屜式側滑菜單

OpenCV在圖像中查找人臉




06

參考書籍


掃碼優惠購書

《Android App開發超實用代碼集錦——jQuery Mobile+OpenCV+O》

ISBN:9787302589358

作者:羅帥、羅斌

定價:99元



問題描述+解決方案+真實源碼+效果截圖

介紹jQuery Mobile、OpenCV、OpenGL等在Android平台運行的應用

300個實例,提供完整源代碼,邊看邊做邊學


內容簡介

本書以「問題描述+解決方案」的模式,用300個實例介紹了在Android移動端極具商業開發價值的編程技術。

全書分為5章:

第1章介紹了使用jQuery Mobile創建導航按鈕、過渡動畫、彈窗、側滑面板、摺疊塊、表格過濾、響應式用戶界面(UI)布局等實例。

第2章介紹了使用OpenCV在圖像上執行頂帽運算、黑帽運算、開運算、閉運算,以及使用拉普拉斯算子、LoG算子、Prewitt算子、Sobel方法、absdiff方法、Scharr方法、Canny方法檢測圖像的輪廓邊緣,在圖像中查找霍夫圓、人臉、人眼、行人、文字塊等實例。

第3章介紹了使用OpenGL在場景上繪製圓柱體、圓錐體、三稜柱、三稜錐,縮放立方體,創建各種濾鏡等實例。

第4章介紹了在騰訊地圖上添加圖像標記、文本標記、透明度動畫、降落動畫,根據起點和終點查詢步行線路、騎行線路、公交線路、駕車線路,在指定行政區中查詢興趣點(POI),查詢街景,自定義熱力圖等實例。

第5章介紹了在高德地圖上添加覆蓋層、彈跳動畫、生長動畫、多幀動畫、多段動畫,查詢指定地點周邊實時路況,根據實時路況繪製駕車線路,查詢駕車線路沿途的加油站、洗手間、汽修點,搜索公交站點,查詢公交線路的開收班信息,在限定的範圍中搜索POI,查詢指定城市的天氣預報等實例。

本書適於作為廣大Android移動端開發人員的案頭參考書,無論對於編程初學者,還是編程高手,本書都極具參考價值和收藏價值。


目 錄



向上滑動閱覽

第1章jQuery Mobile實例

001創建圖文結合的導航按鈕

002自定義導航欄的按鈕圖標

003移除默認按鈕圖標的圓圈

004隱藏或顯示頁眉和頁腳

005在頁眉的兩端布局按鈕

006居中對齊頁腳的多個按鈕

007強制使頁腳與屏幕底部靠齊

008使用過渡動畫跳轉頁面

009自定義過渡動畫的方向

010在頁面跳轉時禁止動畫

011自定義淡出淡入過渡動畫

012使用多種過渡動畫組合

013使用過渡動畫顯示彈窗

014自定義圓角風格的彈窗

015自定義黑色主題的彈窗

016在彈窗右上角添加按鈕

017在彈窗邊線上添加箭頭

018將彈窗定位在元素上方

019強制使用按鈕關閉彈窗

020在側滑面板創建抽屜菜單

021根據輸入框內容過濾文本

022在輸入框中設置提示文本

023在輸入框中添加清空按鈕

024根據兩個選項創建滑塊開關

025設置和獲取滑塊的取值範圍

026創建支持上下限設置的滑塊

027動態摺疊或展開摺疊塊

028自定義摺疊塊的圖標位置

029自定義摺疊圖標和展開圖標

030實現多個摺疊塊互斥展開

031創建多層嵌套的摺疊塊

032創建圖文結合的列表項

033自定義列表項的圖標大小

034根據首字分組顯示列表項

035為列表項添加氣泡計數器

036自定義選擇框右端箭頭圖標

037設置選擇框的選項不可選擇

038一次全選或全不選複選框

039禁用單選按鈕的部分選項

040預置和獲取單選按鈕的值

041動態指定表格顯示哪些列

042通過搜索框過濾表格內容

043通過響應式UI布局表格

044通過響應式UI布局文本塊

045通過網格UI均分圖文塊

046使用字段容器響應屏幕切換

047監聽手機橫屏或豎屏切換

048使用圓角UI對圖像進行圓角處理

049使用陰影UI為圖像添加陰影

050使用兩指手勢實現縮放圖像

051使用兩指手勢實現旋轉圖像

052為圖像添加下拉回彈功能

053監聽手指左滑或右滑圖像

054通過雙擊操作實現縮放圖像

055以拖動方式實現圖像移動

056以動畫方式滾動超長圖像

057在滾動圖像時實現標題置頂

058瀏覽在存儲卡上的圖像文件

059將當前圖像保存到手機存儲卡上

060選擇並播放手機存儲卡上的視頻

061在頁面中開啟和關閉WiFi

第2章OpenCV實例

062在圖像上繪製文本

063在圖像上繪製箭頭線

064在圖像上繪製弧線

065在圖像上繪製折線

066在圖像上繪製凸折線

067在圖像上繪製五邊形

068在圖像上繪製橢圓

069在圖像上繪製標記

070在圖像上添加水印

071在圖像上添加噪點

072以凸包方式摳取圖像

073以五角星形狀摳取圖像

074以圓形形狀摳取圖像

075以字母形狀摳取圖像

076按照比例縮放圖像

077按照角度旋轉圖像

078在垂直方向翻轉圖像

079為圖像添加反色特效

080為圖像添加腐蝕特效

081為圖像添加膨脹特效

082為圖像添加素描特效

083為圖像添加羽化特效

084為圖像添加漩渦特效

085為圖像添加強光特效

086為圖像添加亮色特效

087為圖像添加霧氣特效

088為圖像添加美顏特效

089為圖像添加白平衡特效

090為圖像添加梯度特效

091在圖像邊緣添加鏡像

092在圖像邊緣添加邊框

093使用中值濾波模糊圖像

094使用方框濾波模糊圖像

095使用金字塔採樣模糊圖像

096使用高斯方法模糊圖像

097使用均值方法模糊圖像

098在圖像上執行頂帽運算

099在圖像上執行黑帽運算

100在圖像上執行開運算

101在圖像上執行閉運算

102使用拉普拉斯算子檢測邊緣

103使用LoG算子檢測邊緣

104使用Prewitt算子檢測邊緣

105使用Sobel方法檢測邊緣

106使用absdiff方法檢測邊緣

107使用Scharr方法檢測邊緣

108使用Canny方法檢測邊緣

109在圖像中查找霍夫圓

110在圖像中查找人臉

111在圖像中查找人眼

112在圖像中查找行人

113在圖像中查找前景物體

114在圖像中查找文字塊

115以閾值化方式調整圖像

116對圖像進行光照補償

117對圖像進行細節強化

118根據圖像生成鉛筆圖

119使用雙邊濾波清除噪點

120對圖像進行Gamma校正

121對圖像的缺陷進行修復

122以CLAHE方式強化圖像

123判斷點與圖形的位置關係

124計算多邊形的面積

125計算多邊形的周長

126使用直方圖均衡調整飽和度

127使用直方圖均衡化提高對比度

128比較兩幅圖像的相似度

129按照權重值混合疊加兩幅圖像

130以差值混合模式疊加兩幅圖像

131以點光算法疊加兩幅圖像

132自定義攝像頭的預覽畫面

133使用攝像頭拍攝照片

134讀取手機存儲卡上的圖像文件

135將圖像保存到手機存儲卡上

第3章OpenGL實例

136在場景中繪製五角星

137在場景中繪製圓柱體

138在場景中繪製圓錐體

139在場景中繪製三稜柱

140在場景中繪製三稜錐

141在場景中繪製隨機噪點

142在場景中添加PNG格式的圖像

143為立方體各面設置圖像

144根據指定係數縮放立方體

145圍繞X軸旋轉立方體

146通過手勢控制立方體旋轉

147通過傳感器控制立方體旋轉

148沿着圓軌跡平移立方體

149啟用漫射光照射立方體

150在立方體上添加霧化特效

151在圖像上添加黃色遮罩

152在圖像的四周添加邊框

153創建自定義的懷舊濾鏡

154創建自定義的曝光濾鏡

155創建自定義的強光濾鏡

156創建自定義的高光濾鏡

157創建自定義的點光濾鏡

158創建自定義的X光濾鏡

159創建自定義的Gamma濾鏡

160創建自定義的HDR濾鏡

161創建自定義的色階調節濾鏡

162創建自定義的水彩畫濾鏡

163創建自定義的雙邊濾波濾鏡

164創建自定義的均值模糊濾鏡

165創建自定義的羽化濾鏡

166創建自定義的暗紋濾鏡

167創建自定義的二值化濾鏡

168創建自定義的色溫調節濾鏡

169創建自定義的刺蝟特效濾鏡

170創建自定義的雕刻特效濾鏡

171創建自定義的素描特效濾鏡

172創建自定義的內部梯度濾鏡

173創建自定義的外部梯度濾鏡

174創建自定義的縱向拉伸濾鏡

175創建自定義的色相調節濾鏡

176創建自定義的馬賽克濾鏡

177創建自定義的同心圓濾鏡

178創建自定義的邊框濾鏡

179創建自定義的凸面鏡濾鏡

180創建自定義的哈哈鏡濾鏡

181創建自定義的漩渦濾鏡

182創建自定義的裁剪橢圓濾鏡

183創建自定義的異形裁剪濾鏡

184創建自定義的異形摳圖濾鏡

185創建自定義的圓角濾鏡

186創建自定義的切角濾鏡

187創建自定義的左右分鏡濾鏡

188創建自定義的上下分鏡濾鏡

189創建自定義的三層分鏡濾鏡

190創建自定義的四分鏡濾鏡

191創建自定義的水平鏡像濾鏡

192創建自定義的正片疊加濾鏡

193創建自定義的差值疊加濾鏡

194創建自定義的排他疊加濾鏡

195創建自定義的濾色疊加濾鏡

196創建自定義的雪花飄舞濾鏡

197創建自定義的圖像漸變濾鏡

198創建自定義的點乘運算濾鏡

199創建自定義的黑帽運算濾鏡

200創建自定義的頂帽運算濾鏡

201創建自定義的LoG算子濾鏡

202將圖像保存在手機存儲卡上

203通過手指滑動瀏覽全景圖

204播放手機存儲卡上的視頻文件

205以全景模式播放全景視頻

206使用濾鏡調節視頻的亮度

207使用濾鏡調整攝像頭對比度

208使用濾鏡調整攝像頭飽和度

第4章騰訊地圖實例

209設置騰訊地圖的中心地點

210在騰訊地圖上繪製實心圓

211在騰訊地圖上繪製多邊形

212在騰訊地圖上添加文本標記

213在騰訊地圖上添加圖像標記

214在騰訊地圖上添加平移動畫

215在騰訊地圖上添加淡入淡出透明度動畫

216在騰訊地圖上添加旋轉動畫

217在騰訊地圖上添加縮放動畫

218在騰訊地圖上添加降落動畫

219在騰訊地圖上疊加多種動畫

220根據起點和終點查詢步行線路

221根據起點和終點查詢騎行線路

222根據起點和終點查詢公交線路

223根據起點和終點查詢駕車線路

224模擬小車在駕車線路上行駛

225在騰訊地圖上顯示實時路況

226在指定矩形範圍中查詢POI

227在指定圓形範圍中查詢POI

228在指定行政區中查詢POI

229根據省名查詢該省的省會

230查詢手機所在位置經緯度

231在騰訊地圖上查詢經緯度

232根據緯度和經度值查詢城市

233根據緯度和經度值查詢街景

234在輸入框中實現地名匹配

235計算兩地之間的直線距離

236以指定角度旋轉騰訊地圖

237以衛星模式瀏覽騰訊地圖

238以3D視角瀏覽騰訊地圖

239在騰訊地圖上自定義熱力圖

240將騰訊地圖保存為圖像文件

第5章高德地圖實例

241在高德地圖上繪製箭頭線

242在高德地圖上繪製圓弧線

243在高德地圖上繪製實心多邊形

244在高德地圖上繪製空心多邊形

245自定義紋理設置多邊形的邊線

246在高德地圖上添加覆蓋層

247在高德地圖上添加自定義文本

248清空高德地圖上的文字

249在高德地圖上添加自定義標記

250使用自定義布局文件添加標記

251在自定義標記上響應單擊事件

252在高德地圖上添加放大動畫

253在高德地圖上添加淡入動畫

254在高德地圖上添加彈跳動畫

255在高德地圖上添加生長動畫

256在高德地圖上添加多幀動畫

257在高德地圖上添加多段動畫

258查詢指定地點周邊實時路況

259根據道路名稱查詢實時路況

260根據實時路況繪製駕車線路

261查詢駕車線路沿途的加油站

262查詢駕車線路沿途的洗手間

263查詢駕車線路沿途的汽修點

264動態模擬駕車過程及其提示

265將駕車線路短串分享到微信

266根據起點和終點查詢駕車距離

267啟用高德地圖App查詢線路

268啟用高德地圖App執行導航

269將步行線路短串分享到微信

270根據起點和終點查詢騎行線路和距離

271根據起點和終點啟用騎行導航

272搜索在某地停靠的公交站點

273查詢公交線路的開收班信息

274繪製指定公交線路及其站點

275將公交線路短串分享到微信

276自動匹配輸入框的輸入內容

277根據多種類別組合搜索POI

278在列表中顯示POI搜索結果

279在限定的圓形範圍中搜索POI

280將POI地址短串分享到微信

281啟用高德地圖App搜索POI

282根據區縣名稱查詢管轄範圍

283使用室內高德地圖瀏覽樓層

284自定義高德地圖的顯示樣式

285在高德地圖上顯示指定範圍

286計算多邊形代表的實際面積

287使用動畫相機移動高德地圖

288使用動畫相機縮放高德地圖

289使用動畫相機旋轉高德地圖

290在三維方向上旋轉高德地圖

291查詢指定城市的當前天氣

292查詢指定城市的天氣預報

293根據地名查詢該地的經緯度

294根據緯度和經度值查詢詳細地址

295查詢當前手機位置的詳細地址

296自定義高德地圖的定位圓圈

297將當前高德地圖分享到微信

298在高德地圖上禁用手勢操作

299根據起點和終點查詢火車班次

300將高德地圖保存為圖像文件


07

精彩推薦


微信小程序遊戲開發│猜數字小遊戲(附源碼+視頻)
Flink編程基礎│Scala編程初級實踐
Flink編程基礎│FlinkCEP編程實踐
Flink編程基礎│DataStream API編程實踐
Flink編程基礎│DataSet API編程實踐
數據分析實戰│客戶價值分析
數據分析實戰│價格預測挑戰
數據分析實戰│時間序列預測
數據分析實戰│KaggleTitanic生存預測


arrow
arrow
    全站熱搜
    創作者介紹
    創作者 鑽石舞台 的頭像
    鑽石舞台

    鑽石舞台

    鑽石舞台 發表在 痞客邦 留言(0) 人氣()