美文网首页Flutter
Flutter基于纹理集成视频插件

Flutter基于纹理集成视频插件

作者: 84f344315794 | 来源:发表于2019-02-17 13:52 被阅读875次

    前言:

    第一次写文章,写得好嗨哦。大神就掠过。

    欢迎喷我,我好改正。哈哈

    Flutter集成原生UI组件官方提供了两个方法:

    一种是基于纹理(Texture),这种方法一般用于集成视频插件,该方法是通过OpenGL进行渲染

    另一种则是基于PlatformView方式,flutter通过UiKitView(IOS)或 AndroidView(Android)进行原生组件的渲染,这种方式在性能上有较大的开销。

    纹理方式:

    IOS:

    1. 继承FlutterTexture

    2.  管理已注册textures集合

    _registry = [registrar textures]

    3. 通过_registry注册registerTexture获得一个_textureId

    _textureId=[_registry registerTexture]

    4. 重写

    - (CVPixelBufferRef)copyPixelBuffer

     返回你的CVPixelBufferRef

    5. 通知Texture去获取CVPixelBufferRef

     [_registry textureFrameAvailable:_textureId];

    Android:

    1. 管理已注册textures集合

    TextureRegistry textures = registrar.textures();

    2. 创建一个SurfaceTextureEntry 实例

     TextureRegistry.SurfaceTextureEntry textureEntry= textures.createSurfaceTexture();

        textureId=textureEntry.id() //这个就是们在flutter Textrue中要用到的id

    3. 实例化一个surface

    surface = new Surface(textureEntry.surfaceTexture());

    4.XXXX.setSurface(surface);//XXXX就是要封装的插件,要支持surface

    至此就是整个flutter基于纹理(Texture)集成的简要过程,具体细节可参考flutter官方插件 video_player代码

    了解了整个处理过程,我封装的了ijkplayer组件,支持Android/IOS 支持直播流和点播,地址:Flutter_IJKPlayer

    结语:

    在封装的过程中走了很多坑,其中一个最要的就是在IOS端集成的时候,由于从未做IOS视频开发,在初始化pixelBufferRef的时候没有为CVPixelBufferRef加kCVPixelBufferIOSurfacePropertiesKey属性,导致在flutter端一直渲染不出画面来,加断点查看又有图像,但始终没有视频画面。这一坑让我整个人都觉得好嗨哦。Android方面还进行得很顺利

    #插件截图


    相关文章

      网友评论

        本文标题:Flutter基于纹理集成视频插件

        本文链接:https://www.haomeiwen.com/subject/kldtlqtx.html