flutter_gpu_video_filters 0.0.15

Image filters based on OpenGL fragment shaders with useful video preview widgets

A flutter package for Android for applying OpenGL filters to video.

Usage

How to generate and use a bunch of filters

How to add custom filters

Export & save video

import 'package:flutter_gpu_video_filters/flutter_gpu_video_filters.dart';

final inputSource = AssetInputSource('demo.mp4');
final output = File('result.mp4');
final configuration = GPUGrayScaleConfiguration();
final processStream =  configuration.exportVideoFile(VideoExportConfig(AssetInputSource(asset), output));
await for (final progress in processStream) {
  debugPrint('Exporting file ${(progress * 100).toInt()}%');
}

GPUVideoNativePreview example

import 'package:flutter_gpu_video_filters/flutter_gpu_video_filters.dart';

class PreviewPage extends StatefulWidget {
  const PreviewPage({Key? key}) : super(key: key);

  @override
  State<PreviewPage> createState() => _PreviewPageState();
}

class _PreviewPageState extends State<PreviewPage> {
  late GPUVideoPreviewController configuration;
  late final GPUGrayScaleConfiguration controller;
  late final GPUVideoPreviewParams previewParams;
  bool paramsReady = false;

  @override
  void initState() {
    super.initState();
    _prepare().whenComplete(() {
      setState(() {});
    });
  }

  Future<void> _prepare() async {
    configuration = GPUGrayScaleConfiguration();
    previewParams = await GPUVideoPreviewParams.create(configuration);
    paramsReady = true;
  }

  @override
  void dispose() {
    controller.dispose();
    configuration.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return paramsReady
        ? GPUVideoNativePreview(
      params: previewParams,
      configuration: configuration,
      onViewCreated: (controller, outputSizeStream) async {
        this.controller = controller;
        await this.controller.setVideoAsset(_assetPath);
        await for (final size in outputSizeStream) {
          setState(() {});
        }
      },
    )
        : const Offstage();
  }
}

Additional information

Support status of GPUImage for Android shaders

Status	Name	Display Name
✅	GPU3x3ConvolutionConfiguration	3x3 Convolution
✅	GPUAddBlendConfiguration	Add Blend
✅	GPUAlphaBlendConfiguration	Alpha Blend
❌	GPUBilateralConfiguration	Bilateral
❌	GPUBoxBlurConfiguration	Box Blur
✅	GPUBrightnessConfiguration	Brightness
✅	GPUBulgeDistortionConfiguration	Bulge Distortion Configuration
✅	GPUCGAColorspaceConfiguration	CGA Colorspace
✅	GPUChromaKeyBlendConfiguration	Chroma Key Blend
✅	GPUColorBalanceConfiguration	Color Balance
✅	GPUColorBlendConfiguration	Color Blend
✅	GPUColorBurnBlendConfiguration	Color Burn Blend
✅	GPUColorDodgeBlendConfiguration	Color Dodge Blend
✅	GPUColorInvertConfiguration	Color Invert
✅	GPUColorMatrixConfiguration	Color Matrix
✅	GPUContrastConfiguration	Contrast
✅	GPUCrosshatchConfiguration	Crosshatch
✅	GPUDarkenBlendConfiguration	Darken Blend
✅	GPUDifferenceBlendConfiguration	Difference Blend
✅	GPUDirectionalSobelEdgeDetectionConfiguration	Directional Sobel Edge Detection
✅	GPUDissolveBlendConfiguration	Dissolve Blend
✅	GPUDivideBlendConfiguration	Divide Blend
✅	GPUEmbossConfiguration	Emboss
✅	GPUExposureConfiguration	Exposure
✅	GPUFalseColorConfiguration	False Color
✅	GPUGammaConfiguration	Gamma
❌	GPUGaussianBlurConfiguration	Gaussian Blur
✅	GPUGlassSphereConfiguration	Glass Sphere
✅	GPUGrayScaleConfiguration	Gray Scale
✅	GPUHALDLookupTableConfiguration	HALD Lookup Table
✅	GPUHalftoneConfiguration	Halftone
✅	GPUHardLightBlendConfiguration	Hard Light Blend
✅	GPUHazeConfiguration	Haze
✅	GPUHighlightShadowConfiguration	Highlight Shadow
✅	GPUHueBlendConfiguration	Hue Blend
✅	GPUHueConfiguration	Hue
✅	GPUInvertConfiguration	Invert
✅	GPUKuwaharaConfiguration	Kuwahara
✅	GPULaplacianConfiguration	Laplacian
✅	GPULevelsConfiguration	Levels
✅	GPULightenBlendConfiguration	Lighten Blend
✅	GPULinearBurnBlendConfiguration	Linear Burn Blend
✅	GPULuminanceThresholdConfiguration	Luminance Threshold
✅	GPULuminanceConfiguration	Luminance
✅	GPULuminosityBlendConfiguration	Luminosity Blend
✅	GPUMonochromeConfiguration	Monochrome
✅	GPUMultiplyBlendConfiguration	Multiply Blend
✅	GPUNonMaximumSuppressionConfiguration	Non Maximum Suppression
✅	GPUNormalBlendConfiguration	Normal Blend
⁉️	GPUOpacityConfiguration	Opacity
✅	GPUOverlayBlendConfiguration	Overlay Blend
✅	GPUOverlayConfiguration	Overlay
✅	GPUPixelationConfiguration	Pixelation
✅	GPUPosterizeConfiguration	Posterize
✅	GPURGBConfiguration	RGB
✅	GPUSaturationBlendConfiguration	Saturation Blend
✅	GPUSaturationConfiguration	Saturation
✅	GPUScreenBlendConfiguration	Screen Blend
✅	GPUSepiaToneConfiguration	Sepia Tone
✅	GPUSepiaConfiguration	Sepia
✅	GPUSharpenConfiguration	Sharpen
✅	GPUSobelThresholdConfiguration	Sobel Threshold
✅	GPUSoftLightBlendConfiguration	Soft Light Blend
✅	GPUSolarizeConfiguration	Solarize
✅	GPUSourceOverBlendConfiguration	Source Over Blend
✅	GPUSphereRefractionConfiguration	Sphere Refraction
✅	GPUSquareLookupTableConfiguration	Square Lookup Table
✅	GPUSubtractBlendConfiguration	Subtract Blend
✅	GPUSwirlConfiguration	Swirl
✅	GPUToneCurveConfiguration	Tone Curve
✅	GPUToonConfiguration	Toon
✅	GPUVibranceConfiguration	Vibrance
✅	GPUVignetteConfiguration	Vignette
✅	GPUWatermarkConfiguration	Watermark
✅	GPUWeakPixelInclusionConfiguration	Weak Pixel Inclusion
✅	GPUWhiteBalanceConfiguration	WhiteBalance
✅	GPUZoomBlurConfiguration	Zoom Blur

Examples

• Big Flutter Filters Demo - big example of how to use filters and.

Maintainers

• Nikolay Dymura
• Egor Terekhov
• Nataliia Zabiiaka