Flutter視頻渲染系列

第一章 Android使用Texture渲染視頻
第二章 Windows使用Texture渲染視頻
第三章 Linux使用Texture渲染視頻
第四章 全平臺FFI+CustomPainter渲染視頻
第五章 Windows使用Native窗口渲染視頻
第六章 桌面端使用texture_rgba_renderer渲染視頻（本章）

前言

前面幾章介紹了flutter使用texture渲染視頻的方法，但是有個問題就是在每個平臺都需要寫一套原生代碼去創(chuàng)建texture，這樣對于代碼的維護是比較不利的。最好的方法應該是一套代碼每個平臺都能運行，筆者最近剛好找到了pub上對texture封裝的插件，直接提供dart代碼調(diào)用texture進行rgba的渲染，當然只支持桌面端，即Windows、Linux、Macos，但依然是很方便了。

一、如何實現(xiàn)

1、添加插件

插件的地址是https://pub-web.flutter-io.cn/packages/texture_rgba_renderer。我們直接在pubspec.yaml添加依賴即可。
依賴

texture_rgba_renderer: ^0.0.16

引用

import 'package:texture_rgba_renderer/texture_rgba_renderer.dart';

2、創(chuàng)建texture

定義一個全局插件對象

final _textureRgbaRendererPlugin = TextureRgbaRenderer();

創(chuàng)建texture，得到textureId

//textureId，使用ValueNotifier方便刷新界面
ValueNotifier<int> _textureId = ValueNotifier<int>(-1);
//參數(shù)為唯一標識符，使用當前對象this的hashCode。
 _textureId.value = await _textureRgbaRendererPlugin.createTexture(hashCode);

3、關(guān)聯(lián)texture控件

//ValueListenableBuilder與ValueNotifier是配套使用的，方便界面刷新。
ValueListenableBuilder(
                      valueListenable: _textureId,
                      builder: (c, v, w) {
                        //關(guān)聯(lián)textureId
                        return Texture(textureId: _textureId.value);
                      })),

4、寫入bgra

數(shù)據(jù)格式為ffmpeg的AV_PIX_FMT_BGRA

//數(shù)據(jù)地址
int adress = msg[2];
//一行數(shù)據(jù)長度
int linesize = msg[3];
int width = msg[4];
int height = msg[5];
//將bgra數(shù)據(jù)寫入texture
final ptr = await _textureRgbaRendererPlugin.getTexturePtr(hashCode);
Native.instance.onRgba(
	Pointer.fromAddress(ptr),
	Pointer.fromAddress(adress),
	height* linesize,
	width,
	height,
	linesize);

二、效果預覽

基本的一個運行效果

三、問題分析

texture_rgba_renderer: 0.0.16，就目前的版本來看，cpu消耗比原生寫texture要高不少。主要原因是在dart寫入bgra數(shù)據(jù)時，插件底層先是拷貝了一次數(shù)據(jù)，然后對又數(shù)據(jù)進行第二次逐行掃描拷貝到新的緩沖區(qū)對齊數(shù)據(jù)，這些操作都是比較消耗cpu的，尤其是逐行掃描拷貝。

四、完整代碼

https://download.csdn.net/download/u013113678/88124430
示例代碼只有Windows、Linux的視頻渲染。
注：texture_rgba_renderer: 0.0.16的性能不算特別好，請根據(jù)需求下載。

總結(jié)

以上就是今天要講述的內(nèi)容，使用texture_rgba_renderer實現(xiàn)視頻渲染是筆者無意中發(fā)現(xiàn)的一個方法，本質(zhì)也是texture，只是有人將其封裝為了插件，很大程度上方便了使用，用于預覽小的視頻畫面是完全可以的。文章來源地址http://www.zghlxwxcb.cn/news/detail-617173.html

到了這里，關(guān)于Flutter 使用texture_rgba_renderer實現(xiàn)桌面端渲染視頻的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！