ItemContainer Overview

Table of contents

• Overview
• Transform
• Selecting
• Moving

Overview

RichItemContainer represents the 'BoundingBox' of any element rendered inside it's ContentPresenter.

Top and Left properties of RichItemContainer are relative to the Canvas and will be always in the TopLeft corner, no matter which transformation is applied on the container or child.

In the image the TopLeft corner is the red rectangle and as we can see it has a ScaleTransform applied.

All the DependencyPropertys can be found in the API Reference.

Transform

By default any RichItemContainer has a TransformGroup which contains ScaleTransform and TranslateTransform in this order. Without those 2 transforms the container can't be flipped while drawing and can't be moved.

Note: Scale Transform can be modified by setting the dependency property Scale. Also used to check the current Scale to determine correct corners or a needed direction or to invert scale on Adorners for example (Adorner Usage here you can check how I implemented Adorners for resize)

The only way to overwrite the RenderTransform property of RichItemContainer is by using the AttachedProperty ApplyTransform.

<Rectangle.Style>
 <Style>
  <Setter Property="richCanvas:RichItemContainer.ApplyTransform">
   <Setter.Value>
    <TransformGroup>
     <RotateTransform Angle="30"></RotateTransform>
     <ScaleTransform></ScaleTransform>
     <TranslateTransform></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).

Selecting

Selecting an ItemContainer is done by releasing the left mouse button over 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 ItemContainer can only be selected if the IsSelectable dependency property is true.

Currently selection is in real-time, which means that while moving the mouse over items and selecting, the selection is cleared and items that intersect with the SelectionRectangle are added to SelectedItems.

Default values:

• IsSelectable: true
• IsSelected: false

Moving

A dragging operation can be started by holding the left mouse button on an ItemContainer and moving the mouse. An ItemContainer can be dragged only if its IsDraggable dependency property is set to true.

RealTimeDraggingEnabled property 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 the check the live location of the container.

Note: ItemContainers can be programmatically moved by setting their Top and Left dependency properties.

If multiple items are selected, dragging one will move all selected items.

Default values:

• RealTimeDraggingEnabled: false

---