Flutter: How to use flutter_ffmpeg to add overlays like watermarks and texts to a video?

Question

I try to implement the video_editing feature to my app, and I'd tried the Tapioca Package and the Video_Manipulation package but found that they both do not meet my criteria, so I put my last hope on the flutter_ffmpeg package.

But as I read through its official doc on pub.dev, not a thing on my mind but "WHAT THE HECK", I can't understand what those commands are used for, and though I can't find anything related to add widget overlays to a video. And almost no tutorial on the web that explains how to use it.

So if you successfully implemented adding watermarks/texts to a video with the ffmpeg package, please show me how. Thanks!~

Answer 1

ffmpeg -i video.mp4 -i logo.png -filter_complex "[0:v][1:v]overlay=5:5,drawtext=text=:x=(w-0)/8:y=(h-4)/10:fontsize=64:fontcolor=white:ryanwangTV" -c:a copy -movflags +faststart output.mp4

ffmpeg -i video.mp4 -i logo.png

there are the video in cuestion to work and the png image that we want to apply how watermark

1. the video.mp4 has two "parts" a video and a audio file, remember it

2. the logo.png is a one image, but it consederer a "video" the duration is miliseconds.

how you call parts of video.mp4 and logo.png?

using mapping, for file 1) you will called [0] and for file 2 (logo.png) you will used [1]

if you want to use the video of video.mp4 you will call [0:v] and the video of png is [1:v]

for watermark use filter complex, to "mix" the image on the video

"[0:v][1:v]overlay=5:5,drawtext=text=:x=(w-0)/8:y=(h-4)/10:fontsize=64:fontcolor=white:ryanwangTV

[0:v][1:v] is the video of video.mp4 and image of logo.png overlay=5:5 the first 5 is the main video, and the second 5 is the image to put on of the video.

x=(w-0)/8 : is the coordenada x y=(h-4)/10 : the coordenada y

fontsize=64 fontcolor=white and the ultimate word is text that you

want to draw in video

-c:a copy its mean: copy the audio of file 1

-movflags +faststart : is to fast start for users of internet on browsers

output.mp4 is the name final

Answer 2

//audio replace on video
- String commandToExecute ='-r 15 -f mp4 -i ${AllUrl.VIDEO_PATH} -f mp3 -i ${AllUrl.AUDIO_PATH} -c:v copy -c:a aac -map 0:v:0 -map 1:a:0 -t $timeLimit -y ${AllUrl.OUTPUT_PATH}';



//To combine audio with image
 String commandToExecute = '-r 15 -f mp3 -i ${AllUrl.AUDIO_PATH} -f image2 -i ${AllUrl.IMAGE_PATH} -pix_fmt yuv420p -t $timeLimit -y ${AllUrl.OUTPUT_PATH}';

//overlay Image on video
  String commandToExecute = "-i ${AllUrl.VIDEO_PATH} -i ${AllUrl.IMAGE_PATH} -filter_complex overlay=10:10 -codec:a copy ${AllUrl.OUTPUT_PATH}";


 /// To combine audio with gif
   String commandToExecute = '-r 15 -f mp3 -i ${AllUrl.AUDIO_PATH} -f gif -re -stream_loop 5 -i ${AllUrl.GIF_PATH} -y ${AllUrl.OUTPUT_PATH}';




/// To combine audio with sequence of images
        String commandToExecute = '-r 30 -pattern_type sequence -start_number 01 -f image2 -i ${AllUrl.IMAGES_PATH} -f mp3 -i ${AllUrl.AUDIO_PATH} -y ${AllUrl.OUTPUT_PATH}';