Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/Baseflow/screenrecorder

Flutter package which can be used to record flutter widgets
https://github.com/Baseflow/screenrecorder

flutter flutter-widgets gifs hacktoberfest screen-capture screen-recorder screenrecorder

Last synced: about 3 hours ago
JSON representation

Flutter package which can be used to record flutter widgets

Awesome Lists containing this project

README

        




pub.dev

Sponsoring
likes
popularity
pub points

----

> 🚧 This is highly experimental! 🚧
>
> 🚧 API is subject to change! 🚧

This is a package to create recordings of Flutter widgets.
The recordings can be exported as GIFs.

This is pure Flutter/Dart implementation without any dependencies on native
or platform code. Thus it runs on all supported platforms.

Please note, that the encoding of the GIF takes a lot of time. On web it is basically useless because it takes so much time.

## 🚀 Getting Started

### Setup

First, you will need to add `screen_recorder` to your `pubspec.yaml`:

```yaml
dependencies:
flutter:
sdk: flutter
screen_recorder: x.y.z # use the latest version found on pub.dev
```

Then, run `flutter packages get` in your terminal.

## Example

Wrap your widget which should be recorded in a `ScreenRecorder`:

```dart
ScreenRecorder(
height: 200,
width: 200,
background: Colors.white,
controller: ScreenRecorderController(
pixelRatio: 0.5,
skipFramesBetweenCaptures: 2,
),
child: // child which should be recorded
);
```

Then use `ScreenRecorderController.start()` to start recording and
`ScreenRecorderController.stop()` to stop the recording.
`final gif = await ScreenRecorderController.export()` gives you the result which can be written to disk.

A complete example can be found [here](https://pub.dev/packages/screen_recorder/example).

## ⚠️ Known issues and limitations

- Platform views are invisible in screenshots (like [webview](https://pub.dev/packages/webview_flutter) or [Google Maps](https://pub.dev/packages/google_maps_flutter)). For further details, see this [Flutter issue](https://github.com/flutter/flutter/issues/25306) and [this issue](https://github.com/flutter/flutter/issues/102866). Please give a 👍 to those issues in order to raise awareness and the prio of those issues.
- Web only works with Flutter's CanvasKit Renderer, for more information see [Flutter Web Renderer docs](https://flutter.dev/docs/development/tools/web-renderers).
- This package does not and will not support audio until it is possible in a pure Dart/Flutter environment.
- This package does not and will not support exporting as a video until it is possible in a pure Dart/Flutter environment.

## Convert gif to video

In order to convert the gif to a video, you can try one of the following libraries. Please note, that compatibility was not tested.

| Library | Stats |
|---------|-------|
| [ffmpeg_kit_flutter](https://pub.dev/packages/ffmpeg_kit_flutter) | likes popularity pub points |
| [flutter_video_compress](https://pub.dev/packages/flutter_video_compress) | likes popularity pub points |
| [video_editor](https://pub.dev/packages/video_editor) | likes popularity pub points |
| [video_trimmer](https://pub.dev/packages/video_trimmer) | likes popularity pub points |
| [video_compress](https://pub.dev/packages/video_compress) | likes popularity pub points |

## 📣 About the author

[![GitHub followers](https://img.shields.io/github/followers/ueman?style=social)](https://github.com/ueman)
[![Twitter Follow](https://img.shields.io/twitter/follow/ue_man?style=social)](https://twitter.com/ue_man)

## Contributors