WPF FAQ - Adorners

1. Call the static method ‘GetAdornerLayer()’, to get the AdornerLayer associated with the UIElement.

2. Call the ‘Add()’ method to bind the Adorner to the target UIElement.

[C#]

        AdornerLayer adornerLayer = AdornerLayer.GetAdornerLayer(myTextBox);
        adornerLayer.Remove(new ControlAdorner(myTextBox));

To bind an adorner to a particular UI element, the following things needs to be done.

[C#]

        AdornerLayer adornerLayer = AdornerLayer.GetAdornerLayer(myTextBox);
        adornerLayer.Add(new ControlAdorner(myTextBox));

The common way of implementing the rendering of visual element is to override the ‘OnRenderSizeChanged’ method and use one or more ‘DrawingContext’ objects to render the adorner’s visuals as needed.

Given below is a simple code snippet for adding rounded corners around the adorned element.

[C#]

protected override void OnRender(DrawingContext drawingContext)
        {
            Rect adornedElementRect = new Rect(this.AdornedElement.DesiredSize);

            // Some arbitrary drawing implements.
            SolidColorBrush renderBrush = new SolidColorBrush(Colors.Green);
            renderBrush.Opacity = 0.2;
            Pen renderPen = new Pen(new SolidColorBrush(Colors.Navy), 1.5);
            double renderRadius = 5.0;

            // Draw a circle at each corner.
            drawingContext.DrawEllipse(renderBrush, renderPen, adornedElementRect.TopLeft, renderRadius, renderRadius);
            drawingContext.DrawEllipse(renderBrush, renderPen, adornedElementRect.TopRight, renderRadius, renderRadius);
            drawingContext.DrawEllipse(renderBrush, renderPen, adornedElementRect.BottomLeft, renderRadius, renderRadius);
            drawingContext.DrawEllipse(renderBrush, renderPen, adornedElementRect.BottomRight, renderRadius, renderRadius);
        }

Adorners are a special type of FrameworkElement used to provide visual cues. It can be used to add functional handle to elements or provide state information about the control. There is a class that plays an important role in rendering called ‘AdornerDecorator’. This class determines the placement of the ‘AdornerLayer’ in the visual tree.