The Edit class contains the properties and methods for editing and annotating images. For a list of all members of the Edit class, please refer to Edit Members
Explanation
The ImageKit.NET3 ImageKit control implements a number of editing and annotation functions. These functions allow annotation objects to be drawn using the mouse or by executing various Edit methods. The annotation objects implemented by the Edit class are listed below:
- Annotation objects include: Line (Arrow), Polyline (Arrow), Polygon, Rectangle, Round Rectangle, Ellipse, Pen, Text, Stamp and Image. These are the objects that can be drawn using the mouse or by executing various methods.
- Annotation objects can be selected individually, can selected as a group, or all annotation objects can be selected. Annotation objects can be selected using the mouse. Objects can be selected by executing methods.
- Annotation objects can be moved individually, as a group, or in their entirety. Annotation objects can be enlarged, reduced, and rotated (individually selected objects / multiple selected objects). This can be done on the control using the mouse or by changing property values. When Polyline, Polygon, or Pen objects are selected, it is possible to add, insert, or delete points using the mouse or by executing various methods.
- Annotation objects can be deleted, copied, and pasted (individually, as a group, or in their entirety). Annotation objects can be moved to front or moved to back. After annotation objects have been drawn, their properties can be accessed and changed (individually selected objects only). This can be done by right clicking on the control to display the context menu, by changing property values, or by executing various methods.
- Changes to annotation objects can be undone or redone. This is done by right clicking on the control to display the context menu or by executing various methods.
- Annotation objects can be saved in a seperate annotation file. The saved annotation file can be loaded on the same image or a different image. This can also be done by executing a method.
- Annotation objects drawn on the control can be rasterized and embedded into a raster image. This can be done by executing a method.
Using the mouse to draw annotation objects:
NOTE: Annotations are enabled only on the base image in the ImageKit control. For more information about using methods to draw annotation objects, please refer to explanation of those methods in the Help documentation under the Edit interface. For information about annotations and editing using various toolbar controls, please see the properties of these toolbar controls: Newtone.ImageKit.Win.ToolBarAnnotation, Newtone.ImageKit.Win.ToolBarSetUpLines, Newtone.ImageKit.Win.ToolBarSetUpObjects and Newtone.ImageKit.Win.ToolBarStandard.
- Line Object
-
- Set the following properties: PenWidth, ForeColor, ForeColorOpacity, DoubleLine, StartLineCap, EndLineCap, DashPattern, DashStyle, StartArrowCap, StartArrowCapFilled, StartArrowCapSize, EndArrowCap, EndArrowCapFilled, EndArrowCapSize.
- Set the EditKind property to KindOfEdit.Line.
- Set the starting point of the line by left-clicking the mouse in the appropriate location on the image and while holding down the left mouse button drag the mouse across the image to draw the line. The endpoint of the line will be the location where the left mouse button was released. Holding down the Shift key while dragging the mouse will force the line to be drawn at angles of 0, ±45 and ±90 degrees
- Polyline Object
-
- Set the following properties: PenWidth, ForeColor, ForeColorOpacity, StartLineCap, EndLineCap, DashPattern, DashStyle, LineJoin, StartArrowCap, StartArrowCapFilled, StartArrowCapSize, EndArrowCap, EndArrowCapFilled, EndArrowCapSize.
- Set the EditKind property to KindOfEdit.Polyline.
- Set the starting point of the polyline by left-clicking (and releasing) the mouse in the appropriate location on the image. Move the mouse to the location of the second point in the polyline. A line will be drawn connecting the starting point to the second point. Once the mouse is in the correct location for the second point, left-click the mouse again to draw the second point. Move the mouse to the location of the third point and left click the mouse to set that point. Continue in this way until all the points of the polyline have been drawn. When the endpoint of the polyline is determined, double click the left mouse button to stop drawing.
- When the ContextMenuEnable property is set to True, right-clicking will display the Context Menu which can be used to undo or redo line segments and return the annotation object to its prior state.
- Polygon Object
-
- Set the following properties: PenWidth , ForeColor, ForeColorOpacity, Fill, BackColor, BackColorOpacity, CustomBrushEnabled, BrushKind, HatchStyle, CustomBrushColor1, CustomBrushColor2, LinearGradientMode, CustomBrushImageFileName, DashPattern, DashStyle, and LineJoin.
- Set the EditKind property to KindOfEdit.Polygon.
- Set the starting point of the polygon by left-clicking (and releasing) the mouse in the appropriate location on the image. Move the mouse to the location of the second point in the polygon. A line will be drawn connecting the starting point to the second point. Once the mouse is in the correct location for the second point, left-click the mouse again to draw the second point. Move the mouse to the location of the third point and left click the mouse to set that point. Continue in this way until all the points of the polygon have been drawn. When the last point of the polygon is determined, double click the left mouse button to set the last point and to draw a line segment from the last point to the start point.
- When the ContextMenuEnable property is set to True, right-clicking will display the Context Menu which can be used to undo or redo line segments and return the annotation to its prior state.
- Rectangle, Round Rectangle, and Ellipse Objects
-
- Set the following properties: PenWidth, ForeColor, ForeColorOpacity, Fill, BackColor, BackColorOpacity, CustomBrushEnabled, BrushKind, HatchStyle, CustomBrushColor1, CustomBrushColor2, LinearGradientMode, CustomBrushImageFileName, RoundRectangleRadius.
- Set the EditKind property to KindOfEdit.Rectangle, to KindOfEdit.RoundRectangle, or to KindOfEdit.Ellipse as the case may be.
- Set the first corner of the rectangle that bounds the object by left-clicking the mouse in the appropriate location on the image. Hold the left mouse button down while dragging the mouse across the image. This will draw a rectangle that bounds the object. Releasing the left mouse button will set the opposite corner of the bounding rectangle. The rectangle object will be drawn on this bound rectangle, the round rectangle or ellipse objects will use this area as a bounding rectangle will be drawn within. Holding down the Shift key while drawing a rectangle or an ellipse, will make the object a square or circle respectively
- Pen Object
-
- Set the following properties: PenWidth, ForeColor, ForeColorOpacity, StartLineCap, EndLineCap, DashPattern, DashStyle, LineJoin, ClosePenLine, CustomBrushEnabled, BrushKind, HatchStyle, CustomBrushColor1, CustomBrushColor2, LinearGradientMode, CustomBrushImageFileName.
- Set the EditKind property to KindOfEdit.Pen.
- Set the starting point for the pen by left-clicking the mouse in the appropriate location on the image. While holding down the left mouse button, move the mouse over the image to draw with the pen. When the mouse button is released, the pen object is completed.
- Image Object
-
- Set the EditKind property to KindOfEdit.Image.
- Use the mouse to determine the location where the image will be pasted. Set one corner of the area by left-clicking the mouse in the appropriate location on the image and while holding down the left mouse button moving the mouse. When the left mouse button is released, the area where the image is pasted is determined and the "File" Dialog will be displayed.
- Select the image file that will be pasted and click the "Open"
button in the "File" Dialog. The selected image will be pasted in
the area determined in step 2. The image will be stretched to fit
within this area. If the AspectRatio property is True, the
pasted image will maintain the height to width ratio of the
original image.
NOTE: Only images that can be loaded into the ImageKit control can be pasted using Image annotation function. If an unsupported file is selected, the area drawn with the mouse in step 2 will be deleted and the annotation will be returned to the state prior to use of the Image object. Even if the selected image is of a supported format, if the area in which the image is to be pasted is too large and uses up available memory resources so the image cannot be displayed, a small image with a white background and red x will be displayed in its place. In this case, remove the Image object by selected "Delete" or "Undo" in the context menu and then create a small area to paste the image.
- Text and Stamp Objects
-
- Set the following properties: FontName, FontSize, FontBold, FontItalic, FontStrikeout, FontUnderline, ForeColor, ForeColorOpacity, Fill, BackColor, BackColorOpacity, CustomBrushEnabled, BrushKind, HatchStyle, CustomBrushColor1, CustomBrushColor2, LinearGradientMode, CustomBrushImageFileName, WordWrap, PenWidth, Border, BorderColor, BorderColorOpacity, BorderShape (Stamp object only), TextAlign (Text object only), VerticalText and RightToLeft.
- Set the EditKind property to KindOfEdit.Text or to KindOfEdit.Stamp.
- Set the upper left corner of the location where you want to draw the Text or Stamp object by left-clicking the mouse and then while holding down the left mouse button move the mouse down and to the right. When you release the left mouse button, the text input area will be created on the image. When the& Fill property is True, the area will be filled with the color set in the BackColor property. When the Fill property is False, the text area background color will be the reverse of the RGB values set in the ForeColor property property. The final size of the Text or Stamp objects is automatically determined by the coordinates of the upper left corner of the text area, the font settings, and the text content and the WordWrap property setting. If the size of the object is not correct, the text area can be selected and the size of the text changed.
- Use the keyboard to enter the text that you want to draw. The Enter key will allow you to enter multiple lines of text.
- Once the text has been entered into the text area, clicking the mouse outside of the text area will set the text and draw it on the image. (The text content entered in this way is automatically set into the Text property.) If the SetTextOnRightClick property is True, right clicking within the text box will set the text into the Text object. If the SetTextOnInvalidAreaClick property is true, clicking on the ImageKit control in the area where no image is displayed (the invalid area the has a hatched pattern), will set the text into the Text object. When the Fill property is True, the background color of the text will be the color set in the BackColor property, the text color will be the color set in the ForeColor property, and the width of the text is determined by the PenWidth property.
- Select
-
- Set the EditKind property to KindOfEdit.Select.
- Click on any of the annotation objects currently drawn on the
image (*) and that object will be selected. Selected objects can be
moved, their shape changed, content altered, etc. They can be
rotated, deleted, cut, or copied.
(*) The location that must be clicked in order for an annotation object to be selected is different depending on the object.
Line Objects: Click on the line to select it.
Polylines, Polygons, and Pen Objects: Click inside the object. Inside means within the area defined by the x coordinate of the left-most point, the y coordinated of the upper most point, the x coordinate of the right-most point and the y coordinate of the lowest point.
Rectangle, RoundRectangle and Ellipse Objects: Click inside these objects.
Text and Stamp Objects: Click inside these object's text area.
- MultiSelect
-
- Set the EditKind property to KindOfEdit.MultiSelect.
- Dragging the mouse will draw the selection area for MultiSelect. All objects that have ALL of their points within this selection area will automatically be selected. All objects selected can be moved, deleted, cut, or copied. Holding down the Ctrl key allows you to click the objects that you want to select. Likewise, if you hold down the Ctrl key and click on object among several that have been selected, that object will be deselected.
- The selected objects can be moved, rotated, deleted, copied, and cut.
- Note that the area containing multi-selected objects can be
enlarged or reduced in size while maintaining the relative
positional relationship of the selected objects. (See the MultiResizeMinWidthEachObject
property section.)
- * When reducing the multi-selection area, the minimum value of the area is the value of the MultiResizeMinHeight, MultiResizeMinWidth property, and the minimum size of each object is the value of the MultiResizeMinHeightEachObject, MultiResizeMinWidthEachObject property.
- * If the selected object contains a pasted image with
AspectRatio True or a text stamp with WordWrap False, it will be as
follows.
- -In case of enlargement / reduction by grasping the four corners: Enlargement / reduction is performed while maintaining the entire selection range and the aspect ratio of all selected objects.
- -In case of enlargement / reduction in the aspect ratio: The image text stamp that maintains the aspect ratio is enlarged / reduced in the drag direction while maintaining the aspect ratio.
- * If the selected object does not include a pasted image with AspectRatio True or a text stamp with WordWrap False, you can zoom in / out by grabbing the four corners in the entire selection range and in the drag direction for all selected objects. However, if you drag with the AspectRatio property set to True, it will be scaled while preserving the overall selection and the aspect ratio of all selected objects.
- SelectAll / DeseleteAll
-
- Set the EditKind property to KindOfEdit.MultiSelect.
- Set the ContextMenuEnable property to
True and then right-click anywhere in the ImageKit control to
display the Context menu. Choose the "Select All" item and all
annotation objects drawn on the image will automatically be
selected. These selected objects can then be moved, deleted, or
copied.
Note: If not all objects have been selected, choosing the "Select All" item in the Context menu will select all of the objects. When all objects have been selected, they can be deselected by selecting the "Deselect All Objects" item in the Context menu.
*When the SelectOnClick property is True, the Ctrl key cannot be used to multi-select objects. - When the CanDeselectAllSelect property is True, the "AllSelect" state can be removed with a mouse click or mouse drag and objects can be selected or multiselected.
- Moving Objects
-
- Set the EditKind property to KindOfEdit.Select or to KindOfEdit.MultiSelect.
- Moving the mouse cursor over an object that is in a selected state will cause the following pointer, , to be displayed on the annotation object. Placing the mouse cursor over that pointer and pressing the left mouse button will allow you to grab the object and drag the object while holding down the left button. Releasing the left mouse button will place the annotation object at that location. When the EditByPoint property is True and the selected object is a Polyline, Polygon, or Pen objects, specific points can be moved with the mouse.
- Changing Shapes of Objects
-
- Only single selected objects can have their shape changed. Set the& EditKind property to KindOfEdit.Select and select the object whose shape you want to change.
- Moving the mouse cursor over the selected object will change
the pointers to one of the following, , ,
, in different locations on the object. Placing the
mouse cursor on one of these locations and left clicking it with
the mouse will allow you to change the shape of the object by
dragging the mouse. When the EditByPoint property is True and the
selected object is a Polyline, Polygon, or Pen objects, specific
points can be moved with the mouse. When a point can be moved, the
mouse cursor will change to . Pressing the left mouse button will grasp the point
and moving the mouse while pressing the mouse button will allow the
point to be moved. Release the mouse button in the location where
you want to place the point. When both the EditByPoint property and the EditPolylinePointEnabled
property are true, it is possible to add, insert, or delete points
from Polyline, Polygon, or Pen objects. To add a point, move the
mouse over the last point in the object. When the cursor changes to
, right click to display
the context menu. Select "Add" in the context menu. The last point
of the object and the mouse position will be connected with a line
segment. Move the mouse to the location where you want to put the
point and double click the mouse. The new point will be added.
To insert a point, move the mouse over a point of the object. When the mouse cursors changes to , right click to display the context menu. Select "Insert" in the context menu. A point will be inserted midway between the selected point and the next point.
To delect a point, move the mouse over a point of the object. When the mouse cursors changes to , right click to display the context menu. Select "Delete" in the context menu. The selected point will be deleted.
Note: For Rectangle and Ellipse objects, when the AspectRatio property is True, holding the Shift key down while altering shape of the object will maintain the object's height/width ratio. When the AspectRatio property is False, holding the Shift key down while altering the shape of the object will restrict the Rectangle object to a square and will restrict the Ellipse object to a circle. When resizing an image, if the AspectRatio property is true, the original image's aspect ratio will be maintained while resizing.
For Text and Stamp objects, the values of the ResizeTextOnCenter and WordWrap properties will affect how the objects can be resized. For details, please refer to the ResizeTextOnCenter property.
- Rotating Objects
-
- Single and multiple selected objects can be rotated. Set the EditKind property to KindOfEdit.Select or KindOfEdit.MultiSelect and then select the object.
- Moving the mouse cursor over the corner of the selected object's selection area will change the pointer to one of the following, , , , . Placing the mouse cursor on one of these locations and left clicking the mouse will allow you to rotate the object. Releasing the mouse button set the rotated object.
- Setting The Rectangle For Area Selection
-
- To set the rectangle that defines the selected area on the image, when the EditEnabled property is True, you must set the EditKind property to KindOfEdit.None and the ImageKit.RectDraw property to True. Then use a mouse drag to define the selected area or set the appropriate values directly into the ImageKit.Rect property. The rectangle selecting an area on the image can be retrieved by accessing the ImageKit.Rect property values.
- If the EditEnabled property is True and the EditKind property is set to any value other than KindOfEdit.None then an area on the image cannot be selected, even when the ImageKit.RectDraw property is True.
- When the EditEnabled property is False, simply setting the ImageKit.RectDraw property to True allows you to select an area on the image using a mouse drag or by setting values directly into the ImageKit.Rect property.
IMPORTANT: While editing, all annotation objects will be cleared if the EditEnabled property is set to False, or a new image is loaded into the ImageKit control, or the Image property changes. To save any annotation objects, execute the SaveAnnotationFile method to save the annotation information to XML file or execute the DrawEditedObjectsToImage method to rasterize the annotations and embed them into the image.
If the image displayed is larger than the ImageKit control and a Line, Rectangle, Ellipse, Pen, or Text object is selected, moved, changed, etc and the mouse is dragged beyond the ImageKit control, the image will automatically be scrolled according to the mouse movement.
For more information about the Context menu, please refer to the ContextMenuEnable property.
See Also