Skip to content

Video Effects SDK for Flutter (WebRTC)

Add background effects to a Flutter Web app that uses flutter_webrtc with the effects_sdk plugin.

The Flutter plugin wraps the Web SDK for Flutter Web apps built on flutter_webrtc: give it a MediaStream, get the processed MediaStream back.

Add the plugin#

Load the Web SDK in web/index.html:

<script src="https://effectssdk.ai/sdk/web/{VERSION}/tsvb-web.js"></script>

Add the dependency to pubspec.yaml:

dependencies:
  effects_sdk:
    git:
      url: https://github.com/EffectsSDK/flutter-plugin.git

Use it#

const customerID = String.fromEnvironment('CUSTOMER_ID');
final effectsSDK = EffectsSDK(customerID);

effectsSDK.useStream(inputStream);
final outputStream = effectsSDK.getStream();

effectsSDK.onReady = () {
  effectsSDK.run();
  effectsSDK.setBlur(60);
};

Run the example with your Customer ID from the Developer Portal:

flutter run --dart-define=CUSTOMER_ID=$CUSTOMER_ID

Next steps#

View as Markdown · Found a problem? Tell us.