How to add an image or text (Watermark) on a video/image - Flutter/Dart

For videos:

• https://github.com/tanersener/flutter-ffmpeg, though I couldn’t find anything that explicitly documents a way to edit the video, such as a watermark. But it should be possible according to others https://stackoverflow.com/a/57847155/6668797.

• https://pub.dev/packages/video_manipulation

  Adding still frames to an existing video, e.g. watermarks

  .generateVideo(List<String> paths, String filename, int fps, double speed).

  Parameters paths list of input file paths. Can be images (.jpg or .png) or video files (.mp4) that are used to generate the new video. E.g.: ["documents/input.mp4", "documents/watermark.jpg]

For images:

• https://pub.dev/packages/image

  load, save and manipulate images in a variety of different file formats.

  https://github.com/brendan-duncan/image/wiki/Examples

  drawString(image, arial_24, 0, 0, 'Hello World');

As for other services, I don't know, but Firebase does not offer this service.

Otherwise, client/app-side, there’s currently not much else for videos, but there's more available for images, you can search https://pub.dev/flutter/packages?q=image+editor. However, for more options, you’ll have to seek out native Android/iOS libraries and custom integrate them through the platform channels.

I am not sure about adding watermark over video. But to help people who are looking for watermark over the image can refer to the simple article written by me.

Add Watermark over Image in Flutter

In this article, I have used Image package to apply watermark text or image over Image.There is well explained example program also written about this topic.

For watermark images:

import 'package:extended_image/extended_image.dart';import 'package:image/image.dart' as ui;import 'package:path_provider/path_provider.dart';Future<File> watermarkPicture( File picture, File watermark, String fileName) async {  ui.Image originalImage = ui.decodeImage(picture.readAsBytesSync());  ui.Image watermarkImage = ui.decodeImage((watermark.readAsBytesSync()));  ui.Image image = ui.Image(originalImage.width, originalImage.height);  ui.drawImage(image, watermarkImage);  // Easy customisation for the position of the watermark in the next two lines  final int positionX = (originalImage.width / 2 - watermarkImage.width / 2).toInt();  final int positionY = (originalImage.height - watermarkImage.height * 1.15).toInt();  ui.copyInto(    originalImage,    image,    dstX: positionX,    dstY: positionY,  );  final File watermarkedFile = File('${(await getTemporaryDirectory()).path}/$fileName');  await watermarkedFile.writeAsBytes(ui.encodeJpg(originalImage));  return watermarkedFile;}

This is an customisation of this medium article. Because the original solution was not working for me.