WPF DiagramControl - Create Rotatable Containers with Shapes

This example allows users to rotate containers with shapes.

Implementation Details

Default diagram containers do not support rotation-related operations. These operations, however, are implemented in the base class. You can define a custom rotatable container in the following manner:

1. Create a DiagramContainer class descendant.

2. Override the CanRotate property.

   public class CustomDiagramContainer : DiagramContainer {
       static CustomDiagramContainer() {
           CanRotateProperty.OverrideMetadata(typeof(CustomDiagramContainer), new FrameworkPropertyMetadata(true, null, (d, v) => v));
       }
   }

3. Handle the DiagramControl.BeforeItemsRotating event and pass container child items to the e.Items collection:

   private void DiagramControl1_BeforeItemsRotating(object sender, DiagramBeforeItemsRotatingEventArgs e) {
       var containers = e.Items.OfType<CustomDiagramContainer>();
       foreach (var container in containers) {
           e.Items.Remove(container);
           foreach (var item in container.Items)
               e.Items.Add(item);
       }
   }

   In this instance, the DiagramControl rotates associated inner items instead of the parent container.

4. Handle the DiagramControl.ItemsRotating event and correct the container's position and size:

   private void DiagramControl1_ItemsRotating(object sender, DiagramItemsRotatingEventArgs e) {
       var groups = e.Items.GroupBy(x => x.Item.ParentItem);
       foreach (var group in groups) {
           if (group.Key is CustomDiagramContainer) {
               var container = (CustomDiagramContainer)group.Key;
               var containingRect = container.Items.Select(x => x.RotatedDiagramBounds().BoundedRect()).Aggregate(Rect.Empty, Rect.Union);
               container.Position = new Point(containingRect.X, containingRect.Y);
               container.Width = (float)containingRect.Width;
               container.Height = (float)containingRect.Height;
           }
       }
   }

Files to Review

• MainWindow.xaml.cs (VB: MainWindow.xaml.vb)

Documentation

• Containers and Lists
• Create Custom Diagram Items
• DiagramControl.BeforeItemsRotating
• DiagramControl.ItemsRotating

More Examples

• WPF DiagramControl - Create Custom Shapes Based on Diagram Containers
• WPF DiagramControl - Proportionally Resize Shapes Within the Parent Container