使用 ffmpeg 创建一个带有播放图标的缩略图答案

【问题标题】：Create a thumbnail with play icon inside with ffmpeg使用 ffmpeg 创建一个带有播放图标的缩略图
【发布时间】：2017-04-30 07:49:02
【问题描述】：

我想用 ffmpeg 创建一个缩略图，里面有一个播放（如上图；取自 Dan Meyer 网站），以显示它是视频而不是图像。

【问题讨论】：

【解决方案1】：

如果您的用例也适用于网站，您可以分两步完成 - 首先创建缩略图，然后使用 HTML5/CSS 在生成的图像上添加播放按钮的叠加层。

以下将在视频中创建 10 秒的缩略图（作为示例）：

ffmpeg -i video.mp4 -ss 00:00:10.0 -vframes 1 thumb1.png

您可以通过 CSS 添加一个播放按钮，参考您的视频元素：

.video a {
   position: absolute;
   background: url("path.../playButton.png");
   height: 20px;
   width: 20px;
   top: 20px;
   left: 20px;
}

让它具有响应性，因此它的位置正确值得考虑 - 这里有一篇关于此的帖子，其中包含更多详细信息：http://douglasgreen.com/demo/responsive-video-play-button/

这种方法的优点是允许您将 PlayButton 的外观与缩略图生成分开，并且与通过 FFMPEG 进行的处理相比，它的处理可能更少（尽管要确保这必须经过测试和计时，并且这是创建图像处理与浏览器处理之间的权衡）。

如果您的用例不适用于网站，或者您想一次性完成所有操作，那么以下内容（来自此答案：https://stackoverflow.com/a/25499933/334402）应该为您指明正确的方向：

ffmpeg -ss 30 -i movie.mp4 -i play.png -filter_complex \
"[0:v][1:v]overlay=main_w/2-overlay_w/2:main_h/2-overlay_h/2" \
-vframes 1 output.png

【讨论】：