image_editor

The image_editor_ohos package is the OpenHarmony implementation of the image_editor library. It provides image manipulation capabilities specifically for the OpenHarmony platform.

Currently, the package supports the following operations:

• Flip
• Crop
• Rotate
• Scale

The image_editor package uses native code (Objective-C for iOS, Kotlin for Android, and ArkTS for OpenHarmony) to process image data efficiently. This allows for high-performance image manipulation that can be used for saving, uploading, or previewing images.

To use the library, you typically create an ImageEditorOption, add one or more specific transformation options (like FlipOption, RotateOption, or ScaleOption) to it, and then call one of the ImageEditor static methods.

The image_editor_platform_interface is a low-level library intended for plugin implementers. For standard application development, you should use the main image_editor package instead. Add image_editor to your pubspec.yaml file to access the image editing capabilities.

dependencies:
  image_editor: ^1.3.0

If you are developing a new platform implementation for the image editor, you must extend the ImageEditorPlatform class. To make your implementation active, you must register it by assigning your instance to ImageEditorPlatform.instance during plugin registration.

Follow this pattern:

1. Create a class that extends ImageEditorPlatform.
2. Implement the required platform-specific methods.
3. Call ImageEditorPlatform.instance = YourImplementation() to set it as the default.

import 'dart:io';
import 'dart:typed_data';

import 'package:image_editor_platform_interface/image_editor_platform_interface.dart';

class MyImageEditor extends ImageEditorPlatform {
  static void registerWith() {
    ImageEditorPlatform.instance = MyImageEditor();
  }

  // ... implement required methods
}

Add image_editor to your Flutter project's dependencies in pubspec.yaml.

dependencies:
  image_editor: $latest

To change the launch screen image for the iOS version of the application, you can either replace the image files directly in the image_editor/example/ios/Runner/Assets.xcassets/LaunchImage.imageset/ directory or use Xcode to manage the assets.

To use Xcode:

1. Open the iOS workspace using open ios/Runner.xcworkspace.
2. In the Xcode Project Navigator, navigate to Runner/Assets.xcassets.
3. Drag and drop your desired images into the asset catalog.

To add text, use AddTextOption and EditorText.

Important: If you use a custom font, you must first register it using FontManager.registerFont(File fontFile) to obtain a fontName. If fontName is an empty string, the system default font is used.

// 1. Register a font
File fontFile = File(path);
final String fontName = await FontManager.registerFont(fontFile);

// 2. Create the text option
final textOption = AddTextOption();
textOption.addText(
  EditorText(
    offset: Offset(0, 0),
    text: 'Hello World',
    fontSizePx: 40,
    color: Colors.red,
    fontName: fontName, // Use the registered name
  ),
);
editorOption.addOption(textOption);

The MixImageOption allows you to overlay one image onto another using a BlendMode.

Supported BlendModes: Supports standard Flutter BlendMode values (e.g., srcOver, dstIn, multiply, screen, overlay, darken, lighten).

final optionGroup = ImageEditorOption();
optionGroup.addOption(
  MixImageOption(
    x: 300,
    y: 300,
    width: 150,
    height: 150,
    target: MemoryImageSource(srcBytes),
    blendMode: BlendMode.srcOver,
  ),
);

final result = await ImageEditor.editImage(image: dstBytes, imageEditorOption: optionGroup);

Use these options to flip, crop, or rotate the image.

• Flip: FlipOption(horizontal: bool, vertical: bool)
• Clip (Crop): ClipOption(x: int, y: int, width: int, height: int)
• Rotate: RotateOption(degree: int)

// Flip horizontally
editorOption.addOption(FlipOption(horizontal: true, vertical: false));

// Crop to a specific area
editorOption.addOption(ClipOption(x: 0, y: 0, width: 1920, height: 1920));

// Rotate 180 degrees
editorOption.addOption(RotateOption(degree: 180));

The ColorOption uses a 5x4 matrix (similar to Android's ColorMatrix) to manipulate colors. It includes factory constructors to easily adjust brightness, saturation, and contrast.

editorOption.addOption(ColorOption());

You can specify the output image format and quality using OutputFormat.

• OutputFormat.png()
• OutputFormat.jpeg(int quality) (where quality is 0-100)

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

The ImageEditor class provides several static methods to perform edits using either raw bytes (Uint8List) or files.

Available Methods:

• ImageEditor.editImage({required Uint8List image, required ImageEditorOption imageEditorOption})
• ImageEditor.editFileImage({required File file, required ImageEditorOption imageEditorOption})
• ImageEditor.editFileImageAndGetFile({required File file, required ImageEditorOption imageEditorOption})
• ImageEditor.editImageAndGetFile({required Uint8List image, required ImageEditorOption imageEditorOption})

import 'package:image_editor/image_editor.dart';

final editorOption = ImageEditorOption();
editorOption.addOption(FlipOption(horizontal: true, vertical: false));
editorOption.outputFormat = OutputFormat.png(88);

final result = await ImageEditor.editImage(
  image: myUint8List,
  imageEditorOption: editorOption,
);