做网站时点击显示百度广告收费标准

最近遇到一个需求，希望可以将素材视频的绿幕背景替换为指定的颜色，然后通过裁剪，拼接等处理制作一个新的视频。所以替换背景色成为了重要的一环，看能否通过ffmpeg来实现。通过一番搜索尝试，发现方案可行。下面我整理一下实现方法。

功能实现

本文的测试视频我在B站上随便找了一个，菜虚坤拍篮球绿幕视频素材。截图如下：

首先需要将视频中的绿色改为透明，类似把人物抠出来，这样才能便于修改背景颜色。因为mov格式视频支持透明通道，所以第一步需要在去除背景色的同时将视频保存为mov格式。所以需要使用到chromakey滤镜。

ffmpeg -i input.mp4 -vf "chromakey=#3fff08:0.1:0.04" -c:v qtrle -c:a copy output.mov

• #3fff08是绿幕的颜色，也就是需要替换为透明的颜色。
• 0.1是相似度(similarity)参数。这个参数决定了颜色匹配的严格程度。值越小，匹配的颜色范围越窄，也就是说，只有非常接近指定颜色的像素才会被视为透明。值越大，匹配的颜色范围越宽，也就是说，即使颜色和指定颜色有一些差距，也会被视为透明。
• 0.04是混合度(blend)参数。这个参数决定了边缘像素的处理方式。值越小，边缘像素的处理越严格，可能会导致边缘部分出现锐利的边缘。值越大，边缘像素的处理越宽松，可能会导致边缘部分出现柔和的过渡。

然后修改颜色：

ffmpeg -i output.mov -vf "color=color=#2B2D30:size=1920x1080 [bg]; [bg][0:v] overlay=shortest=1" output2.mp4

• #2B2D30是需要修改的视频背景色。
• 1920x1080是视频的分辨率，也就是给视频一个这么大的背景。

我们以上面0.1和0.04的参数处理后，效果如下：

因为指定的相似度精度高，所以人物边缘绿色未去除。因为边缘色值或许不是#3fff08。所以我尝试将0.1改为0.18，效果如下：

效果好了许多，按照这个思路，我尝试到0.3，感觉效果就已经比较好了。

需要注意的是，这两个参数不是越大越好，过高的值会匹配更多的颜色，会导致整个视频都透明了。比如我试了0.3和0.1的组合，效果如下：

发现画面整个变暗了，因为背景是灰色，混合度过高，所以就像是蒙了一层灰色。所以这两个参数的具体值取决于视频和绿幕的特定情况。需要根据实际效果进行调整，以获得最佳的绿幕去除效果。

工具制作

如果只是功能实现，那么上面的两条命令基本已经够了。但是要将这一功能做成工具，就需要更近一步。

首先命令中的参数都需要动态获取。

• 获取原视频的背景色。
• 获取原视频的分辨率，帧率。
• 两个阈值参数可以输入。

为什么需要获取帧率，因为转换后视频默认转为了25帧，如果你不想影响原视频帧率，就需要指定帧率，例如指定30帧：

ffmpeg -i output.mov -vf "color=color=#2B2D30:size=1920x1080 [bg]; [bg][0:v] overlay=shortest=1" -r 30 output2.mp4

另外，码率也是类似。

获取背景色

ffmpeg -ss 0.1 -i input.mp4 -vframes 1 output.jpg

首先通过命令获取一张视频的截图，这里取0.1s的位置。

然后获取图片中颜色最多的色值。我这里是用flutter实现的，代码如下：

  /// 获取图片数据Future<ui.Image?> loadImage(File file) async {final Completer<ui.Image> completer = Completer();ImageProvider imageProvider = FileImage(file);ImageStreamListener listener = ImageStreamListener((info, _) async {completer.complete(info.image);});final ImageStream stream = imageProvider.resolve(const ImageConfiguration());stream.addListener(listener);try {await completer.future;} catch (e) {debugPrint("Error loading image: $e");} finally {stream.removeListener(listener);}return completer.isCompleted ? completer.future : null;}/// 获取图片中颜色最多的色值Future<Color?> getMostCommonColor(ui.Image? image) async {if (image == null) {return null;}Uint8List bytes = await image.toByteData().then((data) => data!.buffer.asUint8List());final colorCount = <Color, int>{};for (int i = 0; i < bytes.lengthInBytes; i += 4) {final red = bytes[i];final green = bytes[i + 1];final blue = bytes[i + 2];final alpha = bytes[i + 3];final key = Color.fromARGB(alpha, red, green, blue);if (colorCount.containsKey(key)) {colorCount[key] = colorCount[key]! + 1;} else {colorCount[key] = 1;}}Color? mostCommonColor;int maxCount = 0;colorCount.forEach((color, count) {if (count > maxCount) {mostCommonColor = color;maxCount = count;}});return mostCommonColor;}

这是一种思路，当然也可以获取指定位置的颜色，毕竟背景色都是一致的，如果不一致，那么替换的效果也会打折扣，所以这种方法相对比较简单一些。

Future<Color?> getPixelColor(ui.Image? image, int x, int y) async {if (image == null) {return null;}final byteData = await image.toByteData();if (byteData == null) {return null;}final width = image.width;final pixelOffset = (y * width + x) * 4;final r = byteData.getUint8(pixelOffset);final g = byteData.getUint8(pixelOffset + 1);final b = byteData.getUint8(pixelOffset + 2);final a = byteData.getUint8(pixelOffset + 3);return Color.fromARGB(a, r, g, b);}

这里我获取到的色值是16进制的，例如Color(0xff14ff09)，我需要转成字符#14ff09。

Color color = Color(0xff14ff09);
String colorStr = '#${color.value.toRadixString(16).substring(2)}';

获取视频的分辨率，帧率

获取命令：

ffprobe -v error -select_streams v:0 -show_entries stream=width,height,r_frame_rate -of csv=p=0 input.mp4

这里使用csv=p=0让结果用逗号拼接返回，例如：1920,1080,30/1

然后我们用代码处理这个字符串，获取最终想要的 1920x1080和30就行了，这里就贴代码了。

阈值参数

最后页面上加两个输入框，输入这两个阈值参数就万事具备了。

---

最后结合上面的两条核心命令，将这些参数传入进去就可以了。看似一句话的需求，实际上细节还是比较多的。

参考

• ffmpeg绿幕抠图原理解析