on_image_matrix

on_image_matrix is a Flutter Package used to 'edit' basics aspects [Brightness, Contrast, Saturation, etc...] from a widget or image. Using OnImageFilters you can get some default filters.

Help:

Any problem? Issues
Any suggestion? Pull request

Translations:

NOTE: Feel free to help with readme translations

• English
• Portuguese

Topics:

• How to Install
• How to use
• Examples
• Color Matrix
• License

How to Install:

Add the following code to your pubspec.yaml:

dependencies:
  on_image_matrix: ^1.0.0+1

TODO:

• Fix bugs.
• Add more [Features]

How to use:

OnImageMatrixWidget() // The main widget to start using the package.

All types of parameters on this plugin:

Parameters	Arguments	Description
blur	double?	Used to define the postion of effect based effectType.
blurMode	TileMode?	Used to define the postion of effect based effectType.
colorFilter	ColorFilter?	Used to define the postion of effect based effectType.

To be able to save this widget as a image, use the builder.

OnImageMatrixWidget.builder() // The main widget to start using the package

All types of parameters on this plugin:

Parameters	Arguments	Description
blur	double?	Used to apply a blur effect on the widget/image.
blurMode	TileMode?	Used to define the blur mode.
colorFilter	ColorFilter?	Used to define/apply the effect or filter.
controller	Widget	Used to save, delete or get the widget bytes as image
imageKey	Widget	Used to find the widget and convert into image
imageFormat	double?	Used to define format of widget when converting to a image .

Example:

OnImageMatrixWidget

OnImageMatrixWidget.builder(
  controller: _controller,
  imageKey: GlobalKey(),
  blur: 2.0,
  blurMode: TileMode.decal,
  // You can use some default filters
  colorFilter: OnImageFilters.gray,
  // Modifiy using your style
  // colorFilter: OnImageMatrix.matrix(
  //   brightnessAndContrast: 0.0,
  //   exposure: 0.0,
  //   saturation: 1.0,
  //   visibility: 1.0,
  // ),
  // Or create your own filter using color matrix.
  // OnImageMatrix.custom([
  //  1, 0, 0, 0, 0,
  //  0, 1, 0, 0, 0,
  //  0, 0, 1, 0, 0,
  //  0, 0, 0, 1, 0,
  // ])
  imageFormat: ImageByteFormat.rawRgba,
  child: Image.network(
  'https://source.unsplash.com/j0QOYiYwIYE/1600x900',
  ),
),

After modifiy you widget/image use the [OnImageController] to save it.

  OnImageController _imageController = OnImageController();

  Uint8List? saveImage() {
    _imageController.save();
    return _imageController.imageBytes;
  }

Color Matrix

Try yourself:

• SVG Color Matrix Mixer
• SVG Color Filter Playground

See more:

• rn-color-matrices
• finessing-fecolormatrix
• colormatrix-guide
• image-filters-in-flutter

LICENSE:

• LICENSE

• Back to top