RichCanvasContainer Overview
RichCanvasContainer it's a ContentPresenter that can hold any representation defined for types of items added to the RichCanvas ItemsSource.
By default, RichCanvasContainer has set RenderTransform to a TransformGroup holding: ScaleTransform and TranslateTransform (in this exact order). These are used for dragging and drawing the items in any direction.
Warning
Without those 2 transforms the container can't be flipped while drawing and can't be moved.
As ScaleTransform influences how the item is positioned relative to the Canvas, by default RichCanvas changes the Top and Left properties to always be in the (Top, Left) corner, visually speaking, of the RichCanvasContainer. The image below shows what exactly this means.
Note
In the image the TopLeft corner is the red rectangle and as we can see, the Line has a ScaleTransform applied.
Important
Coming with v3.0.0 there's a new dependency property on RichCanvasContainer, AllowScaleChangeToUpdatePosition which, as the name suggests, lets RichCanvas to change the Top and Left properties relative to the applied ScaleTransform or not.
Default values:
-
AllowScaleChangeToUpdatePosition: true
As described above, in the Positioning section, RichCanvasContainer comes with a default value for RenderTransform.
The only way to overwrite the RenderTransform property of RichItemContainer is by using the AttachedProperty ApplyTransform.
<Rectangle.Style>
<Style>
<Setter Property="rc:RichCanvasContainer.ApplyTransform">
<Setter.Value>
<TransformGroup>
<RotateTransform Angle="30"></RotateTransform>
<ScaleTransform />
<TranslateTransform />
</TransformGroup>
</Setter.Value>
</Setter>
</Style>
</Rectangle.Style>Important
When overwriting the RenderTransform if ScaleTransform and/or TranslateTransform aren't provided this may result in loss of functionalities like Move or Scale(while drawing).
Tip
Scale Transform can be modified by setting the dependency property Scale. Also used to check the current ScaleTransform value to determine correct corners or a needed direction.
Selecting an RichCanvasContainer is done by clicking the bounding box of the drawn element.
Note
A container can be selected programmatically by setting the IsSelected dependency property to true. Selecting this way will not take the bounding box into consideration.
An RichCanvasContainer can only be selected if the IsSelectable dependency property is true.
Default values:
-
IsSelectable: true -
IsSelected: false
RichCanvas offers both single and multiple items dragging. This operation is decided by the CanSelectMultipleItems dependency property (see RichCanvas Selecting).
If multiple items are selected, dragging one will move all selected items.
Also, dragging optimization is implemented. RealTimeDraggingEnabled dependency property on RichCanvas tells if the Top and Left properties are updated while dragging or not. If is set to true the performance is impacted as it calls ArrangeOverride otherwise the PreviewLocationChanged event is raised when dragging to check the live location of the container.
A dragging operation can be started by holding the left mouse button on an RichCanvasContainer and moving the mouse. An RichCanvasContainer can be dragged only if its IsDraggable dependency property is set to true.
Note
RichCanvasContainers can be programmatically moved by setting their Top and Left dependency properties.
Default values:
-
RealTimeDraggingEnabled: false -
IsDraggable: true