image_editor 0.6.0

Rotate ,flip, crop your image. Use objc/kotlin to handle it.

image_editor

Support android ios, use the native way to flip, crop, rotate pictures.

The version of readme pub and github may be inconsistent, please refer to github.

• image_editor
  • Screenshot
  • Platform of support
  • ImageEditor Usage
    • ImageEditor method params
    • ImageEditorOption
    • Option
      • Flip
      • Clip
      • Rotate
      • Color
      • ScaleOption
      • AddTextOption
      • MixOption
        • BlendMode
    • OutputFormat
  • ImageMerge
  • Common issue
    • iOS
      • Privacy of camera
  • LICENSE
    • Third party

Screenshot

Platform of support

Android, iOS.

ImageEditor Usage

dependencies:
  image_editor: ^0.6.0

Import

import 'package:image_editor/image_editor.dart';

Method list:

ImageEditor.editImage();
ImageEditor.editFileImage();
ImageEditor.editFileImageAndGetFile();
ImageEditor.editImageAndGetFile();

Example used alone

Example of extended_image

ImageEditor method params

Name	Description
image	dart.typed_data.Uint8List
file	dart.io.File
imageEditorOption	flutter_image_editor.ImageEditorOption

ImageEditorOption

final editorOption = ImageEditorOption();
editorOption.addOption(FlipOption());
editorOption.addOption(ClipOption());
editorOption.addOption(RotateOption());
editorOption.addOption(); // and other option.

editorOption.outputFormat = OutputFormat.png(88);

Option

Flip

FlipOption(horizontal:true, vertical:false);

Clip

ClipOption(x:0, y:0, width:1920, height:1920);

Rotate

RotateOption(degree: 180);

Color

ColorOption();

In android, it's use 5x4 matrix : https://developer.android.google.cn/reference/android/graphics/ColorMatrix.html

a, b, c, d, e,
f, g, h, i, j,
k, l, m, n, o,
p, q, r, s, t

---

In iOS, it's use 4x4 matrix. The last of line will be ignored.

a, b, c, d,
f, g, h, i,
k, l, m, n,
p, q, r, s

ScaleOption

ScaleOption(width,height);

After specifying the width and height, it is not clipped, but stretched to the specified width and height (Does not maintain the aspect ratio of the image).

AddTextOption

All of unit is pixel.

final textOption = AddTextOption();
textOption.addText(
  EditorText(
    offset: Offset(0, 0),
    text: this._controller.text,
    fontSizePx: size,
    color: Colors.red,
  ),
);

MixOption

BlendMode

Support next BlendMode, other will be ignored.

iOS	android(PorterDuff.Mode)	flutter(BlendMode)
kCGBlendModeClear	CLEAR	clear
	SRC	src
	DST	dst
kCGBlendModeNormal	SRC_OVER	srcOver
kCGBlendModeDestinationOver	DST_OVER	dstOver
kCGBlendModeSourceIn	SRC_IN	srcIn
kCGBlendModeDestinationIn	DST_IN	dstIn
kCGBlendModeSourceOut	SRC_OUT	srcOut
kCGBlendModeDestinationOver	DST_OUT	dstOut
kCGBlendModeSourceAtop	SRC_ATOP	srcATop
kCGBlendModeDestinationAtop	DST_ATOP	dstATop
kCGBlendModeXOR	XOR	xor
kCGBlendModeDarken	DARKEN	darken
kCGBlendModeLighten	LIGHTEN	lighten
kCGBlendModeMultiply	MULTIPLY	multiply
kCGBlendModeScreen	SCREEN	screen
kCGBlendModeOverlay	OVERLAY	overlay

OutputFormat

var outputFormat = OutputFormat.png();
var outputFormat = OutputFormat.jpeg(95);

ImageMerge

    final slideLength = 180.0;
    final option = ImageMergeOption(
      canvasSize: Size(slideLength * count, slideLength * count),
      format: OutputFormat.png(),
    );

    final memory = await loadFromAsset(R.ASSETS_ICON_PNG);
    for (var i = 0; i < count; i++) {
      option.addImage(
        MergeImageConfig(
          image: MemoryImageSource(memory),
          position: ImagePosition(
            Offset(slideLength * i, slideLength * i),
            Size.square(slideLength),
          ),
        ),
      );
    }
    for (var i = 0; i < count; i++) {
      option.addImage(
        MergeImageConfig(
          image: MemoryImageSource(memory),
          position: ImagePosition(
            Offset(
                slideLength * count - slideLength * (i + 1), slideLength * i),
            Size.square(slideLength),
          ),
        ),
      );
    }

    final result = await ImageMerger.mergeToMemory(option: option);
    provider = MemoryImage(result);
    setState(() {});

Common issue

iOS

Privacy of camera

Because, I include GPUImage to handle image data, and the library have Camera api, so you must add next Usage String in info.plist. It was introduced in version 0.3.x, if you don't need the new features added after 0.3, you can keep using the old version.

Why need add it by apple
How to add it by apple

LICENSE

MIT Style.

Third party

Under BSD3 style: GPUImage

Under Apache 2.0 style: Some martix code come from android sdk.