在WPF中使用VisualCollection创建复杂Adorner详解

什么是Adorner？

Adorner是WPF中一种特殊的UI装饰元素，它可以叠加在其他UI元素上提供额外的视觉效果或交互功能，而不会影响原有元素的布局。常见的应用场景包括：

选择框（当选中元素时出现的边框）
调整大小手柄
拖放指示器
注释标记

VisualCollection简介

VisualCollection是WPF中用于管理一组Visual对象的集合类。在创建复杂Adorner时，它特别有用，因为：

可以高效管理多个可视化子元素
自动处理视觉树的添加和移除
提供对子元素的索引访问

创建复杂Adorner的步骤

1. 创建自定义Adorner类

首先需要从Adorner基类派生自己的类：

public class ComplexAdorner : Adorner
{private VisualCollection _visualChildren;public ComplexAdorner(UIElement adornedElement) : base(adornedElement){_visualChildren = new VisualCollection(this);// 初始化你的装饰元素InitializeAdorner();}private void InitializeAdorner(){// 在这里创建和添加你的可视化元素}// 必须重写的方法protected override int VisualChildrenCount => _visualChildren.Count;protected override Visual GetVisualChild(int index) => _visualChildren[index];protected override Size ArrangeOverride(Size finalSize){// 在这里布局你的子元素return finalSize;}
}

2. 添加可视化元素

在InitializeAdorner方法中，我们可以添加各种可视化元素：

private void InitializeAdorner()
{// 添加一个半透明矩形背景var background = new Rectangle{Fill = new SolidColorBrush(Color.FromArgb(50, 0, 0, 255)),RadiusX = 5,RadiusY = 5};_visualChildren.Add(background);// 添加一个文本标签var textBlock = new TextBlock{Text = "Adorner Text",Foreground = Brushes.White,Background = Brushes.Black,Padding = new Thickness(5)};_visualChildren.Add(textBlock);// 添加一个关闭按钮var closeButton = new Button{Content = "X",Width = 20,Height = 20,Background = Brushes.Red,Foreground = Brushes.White};closeButton.Click += CloseButton_Click;_visualChildren.Add(closeButton);
}

3. 实现布局逻辑

在ArrangeOverride方法中定义子元素的布局：

protected override Size ArrangeOverride(Size finalSize)
{// 背景覆盖整个装饰元素var background = _visualChildren[0] as Rectangle;background.Arrange(new Rect(finalSize));// 文本标签放在左上角var textBlock = _visualChildren[1] as TextBlock;textBlock.Arrange(new Rect(10, 10, textBlock.DesiredSize.Width, textBlock.DesiredSize.Height));// 关闭按钮放在右上角var closeButton = _visualChildren[2] as Button;closeButton.Arrange(new Rect(finalSize.Width - 30, 10, 20, 20));return finalSize;
}

4. 添加交互逻辑

可以为Adorner添加交互功能，例如上面的关闭按钮：

private void CloseButton_Click(object sender, RoutedEventArgs e)
{var layer = AdornerLayer.GetAdornerLayer(AdornedElement);if (layer != null){layer.Remove(this);}
}

5. 使用Adorner

在代码中使用自定义Adorner：

// 获取要装饰的元素
var elementToAdorn = myControl; // 替换为你的UI元素// 获取或创建AdornerLayer
var layer = AdornerLayer.GetAdornerLayer(elementToAdorn) ?? new AdornerLayer();
if (layer.GetAdorners(elementToAdorn) == null)
{// 创建并添加Adornervar adorner = new ComplexAdorner(elementToAdorn);layer.Add(adorner);
}

完整示例：可调整大小的Adorner

下面是一个更复杂的示例，创建一个可以调整大小的Adorner：

public class ResizableAdorner : Adorner
{private VisualCollection _visualChildren;private Thumb _topLeft, _topRight, _bottomLeft, _bottomRight;private Rectangle _border;public ResizableAdorner(UIElement adornedElement) : base(adornedElement){_visualChildren = new VisualCollection(this);BuildAdorner();}private void BuildAdorner(){_border = new Rectangle{Stroke = Brushes.Blue,StrokeThickness = 2,StrokeDashArray = new DoubleCollection(new double[] { 2, 2 })};_visualChildren.Add(_border);BuildThumb(ref _topLeft, Cursors.SizeNWSE);BuildThumb(ref _topRight, Cursors.SizeNESW);BuildThumb(ref _bottomLeft, Cursors.SizeNESW);BuildThumb(ref _bottomRight, Cursors.SizeNWSE);_bottomLeft.DragDelta += HandleBottomLeft;_bottomRight.DragDelta += HandleBottomRight;_topLeft.DragDelta += HandleTopLeft;_topRight.DragDelta += HandleTopRight;}private void BuildThumb(ref Thumb thumb, Cursor cursor){thumb = new Thumb{Width = 10,Height = 10,Background = Brushes.Blue,Cursor = cursor};_visualChildren.Add(thumb);}private void HandleBottomLeft(object sender, DragDeltaEventArgs e){var element = AdornedElement as FrameworkElement;if (element != null){element.Width = Math.Max(0, element.Width - e.HorizontalChange);element.Height = Math.Max(0, element.Height + e.VerticalChange);}}// 其他Handle方法类似...protected override Size ArrangeOverride(Size finalSize){_border.Arrange(new Rect(finalSize));_topLeft.Arrange(new Rect(-5, -5, 10, 10));_topRight.Arrange(new Rect(finalSize.Width - 5, -5, 10, 10));_bottomLeft.Arrange(new Rect(-5, finalSize.Height - 5, 10, 10));_bottomRight.Arrange(new Rect(finalSize.Width - 5, finalSize.Height - 5, 10, 10));return finalSize;}protected override int VisualChildrenCount => _visualChildren.Count;protected override Visual GetVisualChild(int index) => _visualChildren[index];
}