Configure Stickers

VideoEditor SDK supports several configuration options for the sticker tool via the configuration.sticker option - allowing flexible adaptation to different needs and use cases. For a detailed explanation of how to configure different editor views, refer to this guide.

`personalStickers`#

The default configuration does not allow users to add custom stickers. In this example, we enable users to add stickers from the device by setting personalStickers to true.

`defaultPersonalStickerTintMode`#

By default, the default tint mode for personal stickers is set to TintMode.none. For this example, this is set to TintMode.solid

`colors`#

By default, a lot of colors are enabled. For this example, we only enable a ColorPalette with a small selection of colors.

`canvasActions`#

By default, all available canvas actions are enabled. In our example, the user is only allowed to undo and redo the changes. For a complete list of available canvas actions for the sticker tool consult the API docs.

`actions`#

By default, all available sticker actions are enabled. In our example, the user is only allowed to replace the stickers and change the color. For a complete list of available sticker actions consult the API docs.


import 'dart:ui';

import 'package:catalog/models/code_example.dart';
import 'package:imgly_sdk/imgly_sdk.dart';
import 'package:video_editor_sdk/video_editor_sdk.dart';

class VideoStickerConfigurationExample extends CodeExample {
  @override
  void invoke() async {
    // Add a video from the assets directory.
    final video = Video("assets/Skater.mp4");

    // Create [StickerOptions] to customize the sticker tool.
    final stickerOptions = StickerOptions(
        // By default, the user is not allowed to add
        // custom stickers from the local library. For
        // this example, this option is enabled.
        personalStickers: true,

        // By default, the default tint mode for personal stickers
        // is set to `TintMode.none`. For this example, this is set
        // to `TintMode.solid`
        defaultPersonalStickerTintMode: TintMode.solid,

        // By default, a lot of colors are enabled.
        // For this example, only a small selection
        // is enabled.
        colors: ColorPalette(colors: [
          NamedColor(const Color.fromARGB(255, 255, 255, 255), "White"),
          NamedColor(const Color.fromARGB(0, 0, 0, 255), "Black"),
        ]),

        // By default, all available canvas actions are enabled.
        // For this example, the user is only allowed to undo
        // and redo changes.
        canvasActions: [StickerCanvasAction.undo, StickerCanvasAction.redo],

        // By default, all available sticker actions are enabled.
        // For this example, only a few tools are enabled.
        actions: [StickerAction.color, StickerAction.replace]
        );

    // Create a [Configuration] instance.
    final configuration = Configuration(sticker: stickerOptions);

    try {
      // Open the video editor and handle the export as well as any occurring errors.
      final result =
          await VESDK.openEditor(video, configuration: configuration);

      if (result != null) {
        // The user exported a new video successfully and the newly generated video is located at `result.video`.
        print(result.video);
      } else {
        // The user tapped on the cancel button within the editor.
        return;
      }
    } catch (error) {
      // There was an error generating the video.
      print(error);
    }
  }
}

Configure Stickers

personalStickers#

defaultPersonalStickerTintMode#

colors#

canvasActions#

actions#

`personalStickers`#

`defaultPersonalStickerTintMode`#

`colors`#

`canvasActions`#

`actions`#