Render to video - Flutter

Question

Description :

I'm working on slide show app. Where I can import a video , add on it sound + text (subtitles and stuff) Then render it & save it locally or share it on social media. I've managed doing the first part with this package.

But I have 3 problems :

First: However I'm just putting text widgets overlaid onto the video player.

Second : How can I input a certain sound on the video?

Third : After all that , How can I render the output video which I can save it locally or share it?

Have you found a rendering engine that can buffer video straight from Skia ? — Adrian Moisa, May 04 '22 at 20:27

score 0 · Accepted Answer · answered May 13 '20 at 21:19

I think you could theoretically make it seem like you are combining video and audio based on how you render them, however to do the third it looks like you would need to get into video editing. Doing it from scratch could be quite a task, and I know in java there is ffmeg but not sure about dart. Here is another stackoverflow discussion that has more on the matter

Video Editor in Flutter using dart

score 0 · Answer 2 · answered Jan 26 '23 at 21:22

There is now a high-level render package that heavily optimizes the approach of repaint boundary capturing.

Wrap you widget with Renderwidget:

import 'package:render/render.dart';

final controller = RenderController();

@override
Widget build(BuildContext context) {
   return Render(
      controller: controller,
      child: Container(),
   );
}

And then capture the motion with the controller:

final result = await renderController.captureMotion(
     duration,
     format: Format.gif,
);

final file = result.output;

Render to video - Flutter

2 Answers2