Rectangle (Interactive)

The Rectangle (Interactive) Control provides an environment to display or draw a rectangle by clicks. Mainly, the control is used within the Image Watch control; however, it can also be used stand-alone. Thus, for example, image regions can be selected to mark objects or define ROIs. In addition to a rectangle, you can also draw squares, circles or ellipses. To do this, the StrokeShape and AspectRatio attributes must be adjusted accordingly.

	For all the following attributes, the control has a getter and a setter method. All further attributes, events and permissions provided by the base class Controls can be found in the TwinCAT HMI documentation.

Category: Colors

Attribute	Type	Description
`StrokeColor`	`SolidColor`	Color of the contours of the drawn rectangle.
`HandleColor`	`SolidColor`	Color of the handles of the drawn rectangle.

Category: Common

Attribute	Type	Description
`ShapeData`	`TcVnRotatedRectangle`	Contains the description of the rectangle. Can be used both to retrieve a drawn rectangle and to set a specific rectangle.
`AspectRatio`	`Number`	Specifies the aspect ratio that is enforced when drawing the rectangle. The `0` value does not force a specific aspect ratio.

Function	Description
`clear`	Deletes the drawn rectangle and description from the `ShapeData` attribute.

Category: Usage

Attribute	Type	Description
`InitialSelection`	`InitialSelection`	Specifies whether the rectangle can be drawn with two clicks or with a sweeping motion, or using both options.
`CenterHandle`	`Boolean`	Displays an element in the center of the rectangle to move it.
`CornerHandles`	`Boolean`	Displays elements at the corners of the rectangle to change its size.
`EdgeHandles`	`Boolean`	Displays elements on the edges of the rectangle to resize it.
`RotationHandle`	`Boolean`	Displays an element on the outside of the rectangle to rotate it.
`ShapeDragging`	`Boolean`	Determines whether the rectangle can be moved at the edges.
`AngleInterval`	`Number`	Specifies the steps in which the rectangle can be rotated. At 0, the rectangle can be rotated as desired.
`Boundary`	`Boundary`	Defines an area in which the shape can be drawn and edited using the five properties "X", "Y", "Width", "Height" and "IsActive". The shape cannot leave this area.
`DataUpdate`	`DataUpdate`	Specifies whether ShapeData should be updated during "onChanged" or at the end "onConfirmed" of a graphical interaction.

Category: Appearance

Attribute	Type	Description
`StrokeThickness`	`MeasurementValue`	Line thickness of the rectangle.
`HandleSize`	`MeasurementValue`	Size of the elements to move and change the rectangle.
`StrokeShape`	`StrokeShape`	Specifies whether a rectangle or an ellipse is painted. The description is identical for both. To get a square or a circle, the AspectRatio can be set to 1.
`ClickableSize`	`MeasurementValue`	Size of the clickable area around above elements to move and change the rectangle. This can simplify touch screen use without changing the appearance.
`Offset`	`Vector2`	Specifies the offset with which the shape is to be displayed.
`Scale`	`Number`	Specifies the scaling in which the shape is to be displayed. The value 1 corresponds to 100%.

Events

Event	Description
`.onShapeChanged`	This event is triggered as soon as the attribute `ShapeData` changes.
`.onShapeConfirmed`	This event is triggered when a shape is set or an interaction with it is completed.