[Feature request] Add Skewing Support to Image Transformations

[tobiasht]

Platforms

Linux, macOS, Windows, iOS, Android, Web

Description

Currently, the image editor supports basic transformations like rotate and flip, which are great for general-purpose editing. However, it lacks skewing (perspective correction or freeform transform), which is essential for tasks such as straightening a document photo or aligning text blocks during document scanning.

I’m requesting the addition of skewing as a supported transformation. This would allow users to adjust corner points of an image to correct perspective distortion — a common need in document editing, scanning, and similar workflows.

Reference:
The croppy package offers a good example of how skewing can be implemented and integrated smoothly. Their iOS demo (accessible in the web demo) showcases an intuitive UI for adjusting skew via corner handles.

Summary:
Adding skewing would make the image editor significantly more useful, especially for apps focused on documents and scanning. It would eliminate the need for an additional dependency, and provide a more complete and user-friendly experience in a single package.

Why

• Skewing is a common requirement for document scanning apps where photos of documents are taken at an angle.
• It significantly improves the quality and legibility of scanned documents by allowing users to correct distortions.
• While other packages like croppy already support this (see iOS demo), I would prefer not to introduce a second image editor dependency into my project just to gain this one feature.
• Consolidating features into one editor would reduce maintenance, complexity, and app size.

[hm21]

Thanks for creating the feature request.

I completely agree that this feature would be helpful. The only potential issue is with video editing, as some native platforms don’t support rotations other than quarter turns (90°).

Right now, I don’t have time to implement the feature myself, but I’ll mark it as “in progress” so it doesn’t auto-close. If you or anyone else wants to contribute and needs some guidance, feel free to reach out.

[hm21]

Update:

I’ve started implementing that feature in this branch: feat/skewing. The design will look different from Croppy’s since I’m aligning it with the editor’s base design. However, it will be possible to customize the UI in the configs to match Croppy’s style, or any other design you prefer.

The only things still missing are:

• Ensuring the crop area stays within image bounds when transformed. The method _setOffsetLimits needs to be rewritten using the new variables: tiltRotate, tiltHorizontal, and tiltVertical.
• Updating the overlay shadow so it correctly darkens the area outside the crop when transformed. This involves adjusting the method _drawDarkenOutside.
• Tweaking some animations.
• Adding a few unit/widget tests.

Only the first two points are time-consuming cuz of the more complex math involved. The rest is pretty straightforward. Not sure when I’ll get to continue, but most of the work is definitely done.

If anyone wants to contribute, just let me know, it's mostly a "math" thing at this point, so I can quickly guide you through it if you're interested.

[hm21]

Good news! I finally had some time to work more on the feature. It’s now available in the beta branch and can be used directly via the beta version on pub.dev. If you’d like to test it, just update your pubspec.yaml like this:
pro_image_editor: 11.6.0-beta.1

I appreciate any feedback!

What’s still missing is properly limiting the crop box when using the round cropper, and some things still don’t look smooth when reaching the crop boundaries.

[semanticist21]

Would it be included in future releases? I see the version now is on 11.15.2 but seems still not implemented yet..
I am using version 11.6.0-beta.1 in production code and not received any crashes yet

[hm21]

@semanticist21 Yes, I’ll include it in a future release, but right now I’ve prioritized the video editor since the people who sponsor me have been asking a lot about extending that feature. Once I’m done with that and have some time, I’ll come back to this :)

FYI: The version 11.6.0-beta.1 actually shouldn’t crash, I just didn’t release it cuz I feel it doesn’t smoothly block the user when they hit the “border” of the image. But if that’s not a concern for you, you can safely use it.