WinForms - Picture Edit - Image Editor Dialog (v19.1)

WinForms Team Blog
19 June 2019

Using the WinForms PictureEdit control, you can display images on your forms. Not long ago we implemented DirectX rendering support for the control, so that large high-DPI images are handled easily. For v19.1 we added another new feature: an embedded Image Editor dialog.

To bring up this dialog users can right-click an image and select Edit. The operations supported by the Editor are simple but useful: crop, rotate, flip, and changes to brightness, contrast and saturation values.

Note that the option ShowEditMenuItem disables access to the editor when it’s set to False.

Image Editor

When the user clicks the Save button in the Image Editor, the event ImageEditorDialogClosed is raised, so you can implement custom change handling as required.

Custom Actions

We anticipate that you may have custom requirements for image editing operations, so we made the Image Editor extensible. You can add additional commands to the editor in a handler for the event ImageEditorDialogShowing, which appear as buttons in the UI. Commands are classes that implement a simple interface and execute your own editing functionality, possibly using your own UI elements.

1
2
3
4
5
6
7
8
9
public class WatermarkCommand : IGraphicCommand {
public SvgImage Image { get; set; }
public string ToolTip {
get { return "Add Watermark"; }
}
public void Execute(ImageEditorControl editorControl) {
editorControl.SetActiveTool(new WatermarkToolControl());
}
}

Watermark

The watermark feature shown in the image is fully implemented in this GitHub example, which is a great starting point for your own custom Image Editor actions. It demonstrates a custom button that invokes a dialog where users can add text-based watermarks to an image.

What Do You Think?

Please let us know any thoughts you have about this new feature. We are particularly interested to hear your ideas for additional editor actions – we would like to implement more common actions and reduce the need for custom additions. Please leave your comments below and let us know.

8 comment(s)
Debeściak
Debeściak

is possible o integrate it into xaf ? How?

19 June, 2019
Christopher Jay
Christopher Jay

Awesome.  I had built something similar but it is nice to have this integrated and has more options than mine.  Thanks!

19 June, 2019
Oleg Mironov (dbc)
Oleg Mironov (dbc)

I love it. For many years I have my own little editor in app for the same purpose. I would be happy to replace it by this "out of the box" solution and know that I can expand functionality if needed in a simple way.

Thank you.

19 June, 2019
ZacW
ZacW

would it be possible to allow us to place the control on a page with a specific brush tool ?

I would like to place this on a web page where the image has been pulled from SQL then a user can blur parts of image that contain a person (this is for GDPR purposes) then re-save it back to a database

19 June, 2019
Christopher Jay
Christopher Jay

Any way to add this to the RepositoryItemImageEdit?

19 June, 2019
Mark Bissett 1
Mark Bissett 1

If you could add the ability to select a pen and draw on op of the image and allow the user to draw arrows on top of it, it would be perfect, but great work so far and much appreciated.

20 June, 2019
Dmitry (DevExpress)
Dmitry (DevExpress)

@ZacW

We haven't tested it, but most likely yes. The only thing worth noting is that most likely you'll have to make a filter applied to a selection, rather than a brush-based tool. In other words, instead of "painting" the blur effect on top of an image with a free-hand brush, it would be easier to select a part of an image (same as you do with the embedded "Crop" command), and apply an effect to this selected area. Not only this approach seems easier to implement, but it's also more flexible - you can select a part of an image and choose an effect to apply: Blur, Sharpen, etc.

We're going to research this request, stay tuned for updates :)

@Christopher Jay

We don't have any immediate plans to do this because we'd like to study the feedback first to understand if there's any demand for it, and if yes, what's the exact user scenario.

20 June, 2019
Jean-Francois
Jean-Francois

Our users seem to like this new feature very much.  Our developer who implemented it in our application very much as well as she just had to enable it to make it work :-)

I'd like to second the two ideas submitted above:

- possibility to blur parts of the image

- possibility to add (very) simple drawing

21 June, 2019

Please login or register to post comments.