Flutter+Metal實(shí)現(xiàn)圖像處理詳細(xì)流程
背景
在之前自制的圖像處理App中，使用了OpenGL處理圖片，這次使用Metal替代OpenGL，來(lái)達(dá)到更好的性能，順便熟悉一下Metal的渲染流程
基本思路
Flutter使用CVPixelBuffer和iOS交互，我們可以直接使用CVPixelBuffer創(chuàng)建MTLTexture，然后將MTLTexture設(shè)置為渲染目標(biāo)。這樣Metal框架可以直接將渲染結(jié)果寫入CVPixelBuffer，達(dá)到更加高效的目的。
Metal環(huán)境設(shè)置
主要初始化Device，PipelineState，CommandQueue三個(gè)對(duì)象。我們需要依賴Device分配各種Metal資源，PipelineState管理著渲染流水線的各個(gè)環(huán)節(jié)的配置，比如vertex shader，fragment shader，輸出像素格式等。CommandQueue用于管理執(zhí)行的繪制命令。
_device = MTLCreateSystemDefaultDevice(); id<MTLLibrary> lib = [_device newDefaultLibrary]; id<MTLFunction> vertexFunc = [lib newFunctionWithName:vertexFuncName]; id<MTLFunction> fragFunc = [lib newFunctionWithName:fragFuncName]; MTLRenderPipelineDescriptor *renderPipelineDesc = [MTLRenderPipelineDescriptor new]; renderPipelineDesc.vertexFunction = vertexFunc; renderPipelineDesc.fragmentFunction = fragFunc; renderPipelineDesc.colorAttachments[0].pixelFormat = MTLPixelFormatBGRA8Unorm; _pipelineState = [_device newRenderPipelineStateWithDescriptor:renderPipelineDesc error:nil]; _commandQueue = [_device newCommandQueue];
從CVPixelBuffer創(chuàng)建MTLTexture紋理
首先創(chuàng)建一個(gè)CVPixelBuffer對(duì)象
NSDictionary *pixelAttributes = @{( id )kCVPixelBufferIOSurfacePropertiesKey : @{}};
CVPixelBufferCreate(
kCFAllocatorDefault,
imageWidth,
imageHeight,
kCVPixelFormatType_32BGRA,
(__bridge CFDictionaryRef)pixelAttributes,
&_renderTargetPixelBuffer);利用CVMetalTextureCacheCreateTextureFromImage從CVPixelBuffer創(chuàng)建MTLTexture
CVReturn ret = CVMetalTextureCacheCreate(kCFAllocatorDefault, nil, _mtContext.device, nil, &_textureCache); CVMetalTextureRef renderTargetMetalTextureRef; ret = CVMetalTextureCacheCreateTextureFromImage(kCFAllocatorDefault, _textureCache, _renderTargetPixelBuffer, nil, MTLPixelFormatBGRA8Unorm, imageWidth, imageHeight, 0, &renderTargetMetalTextureRef); id<MTLTexture> mtlTexture = CVMetalTextureGetTexture(renderTargetMetalTextureRef);
渲染到紋理
從CommandQueue獲得一個(gè)CommandBuffer，用于保存需要執(zhí)行的繪制命令
_activeCmdBuffer = [_commandQueue commandBuffer];
創(chuàng)建MTLRenderPassDescriptor設(shè)置本次繪制的相關(guān)配置，比如繪制到哪里，這里指定通過(guò)CVPixelBuffer創(chuàng)建出來(lái)的MTLTexture，是否清除當(dāng)前內(nèi)容，清除的顏色
MTLRenderPassDescriptor *renderPassDesc = [MTLRenderPassDescriptor new]; renderPassDesc.colorAttachments[0].texture = target; renderPassDesc.colorAttachments[0].loadAction = MTLLoadActionClear; renderPassDesc.colorAttachments[0].clearColor = MTLClearColorMake(0, 0, 0, 1);
通過(guò)CommandBuffer和MTLRenderPassDescriptor創(chuàng)建一個(gè)MTLRenderCommandEncoder
_activeEncoder = [_activeCmdBuffer renderCommandEncoderWithDescriptor:renderPassDesc];
指定MTLRenderCommandEncoder所在的PipelineState
[_activeEncoder setRenderPipelineState:_pipelineState];
使用MTLRenderCommandEncoder綁定Buffer和Texture，在Metal里，Uniform和Vertex Buffer 都是通過(guò)MTLBuffer綁定到Shader中
[_activeEncoder setVertexBuffer:vertexBuffer offset:0 atIndex:0]; [_activeEncoder setFragmentBuffer:uniformBuffer offset:0 atIndex:0]; [_activeEncoder setFragmentBuffer:texture offset:0 atIndex:0];
繪制圖形
[_activeEncoder drawPrimitives:MTLPrimitiveTypeTriangle vertexStart:0 vertexCount:vertexCount instanceCount:1];
顯式的結(jié)束MTLRenderCommandEncoder
[_activeEncoder endEncoding];
提交CommandBuffer
[_activeCmdBuffer commit];
等待繪制結(jié)束，如果你想要異步等待，需要在[_activeCmdBuffer commit]之前設(shè)置completedHandler
// 同步等待
[_activeCmdBuffer waitUntilCompleted];
// 異步等待
[_activeCmdBuffer addCompletedHandler:^(id<MTLCommandBuffer> _Nonnull buf) {
}];到此繪制的內(nèi)容就已經(jīng)在CVPixelBuffer中了，再將CVPixelBuffer提交給Flutter顯示即可。
到此這篇關(guān)于Flutter+Metal實(shí)現(xiàn)圖像處理的文章就介紹到這了,更多相關(guān)Flutter圖像處理內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
Android頂部工具欄和底部工具欄的簡(jiǎn)單實(shí)現(xiàn)代碼
Android頂部工具欄和底部工具欄的簡(jiǎn)單實(shí)現(xiàn)代碼，需要的朋友可以參考一下2013-05-05
這篇文章主要為大家介紹了基于Android?Kotlin高頻面試題解析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-07-07
AFURLSessionManager 上傳下載使用代碼說(shuō)明
本文通過(guò)代碼給大家介紹了AFURLSessionManager 上傳下載使用說(shuō)明，代碼簡(jiǎn)單易懂，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下吧2017-09-09
Android 軟鍵盤彈出隱藏?cái)D壓界面等各種問(wèn)題小結(jié)
這篇文章主要介紹了Android 軟鍵盤彈出隱藏?cái)D壓界面等各種問(wèn)題的相關(guān)知識(shí)，本文給大家介紹的非常詳細(xì)，具有參考借鑒價(jià)值，感興趣的朋友一起看看吧2016-11-11
Android實(shí)現(xiàn)系統(tǒng)級(jí)懸浮按鈕
這篇文章主要為大家詳細(xì)介紹了Android實(shí)現(xiàn)系統(tǒng)級(jí)懸浮按鈕的相關(guān)資料，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-03-03
Android 實(shí)現(xiàn)微信長(zhǎng)按菜單 -FloatMenu
在日常開(kāi)發(fā)中，長(zhǎng)按某個(gè)view出現(xiàn)個(gè)菜單是很常見(jiàn)的需求，下面小編給大家?guī)?lái)了Android 實(shí)現(xiàn)微信長(zhǎng)按菜單 -FloatMenu的實(shí)現(xiàn)思路及具體實(shí)現(xiàn)代碼，感興趣的朋友跟隨腳本之家小編一起看看吧2018-07-07
Android Bitmap和Drawable的對(duì)比
這篇文章主要介紹了Android Bitmap和Drawable的對(duì)比的相關(guān)資料,需要的朋友可以參考下2017-05-05
Android編程之文件讀寫操作與技巧總結(jié)【經(jīng)典收藏】
這篇文章主要介紹了Android編程之文件讀寫操作與技巧,結(jié)合實(shí)例形式總結(jié)分析了Android常見(jiàn)的文件與目錄的讀寫操作,及相關(guān)函數(shù)的使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2016-06-06
Material Design系列之自定義Behavior支持所有View
這篇文章主要為大家詳細(xì)介紹了Material Design系列之自定義Behavior支持所有View，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-09-09
Android自定義View仿QQ運(yùn)動(dòng)步數(shù)效果
這篇文章主要為大家詳細(xì)介紹了Android自定義View仿QQ運(yùn)動(dòng)步數(shù)效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-11-11