|
|
Questions and answers for Control Customization Adorners.
|
31. Control Customization Adorners
|
| 31.1 What is
an adorner ?
|
| 31.2 Where
can adorners be used ?
|
| 31.3 How to
add a custom adorner ?
|
| 31.4 How do I
bind an Adorner to an Element ?
|
| 31.5 How do I
remove the Adorner from an element ?
|
31.1 What is an adorner ?
|
|
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.
|
31.2 Where can adorners be used ?
|
-
Adding functional handles to a UIElement that enables a user to manipulate the
element in some way (resize, rotate, reposition etc.).
-
Provide visual feedback to indicate various states or in response to various
events.
-
Overlay visual decorations on a UIElement.
-
Visually mask or override part or all of UIElement.
|
|
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.
|
31.3 How to add a custom adorner ?
|
|
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);
}
|
|
31.4 How do I bind an Adorner to an Element ?
To bind an adorner to a particular UI element, the following things needs to be
done.
Call the static method "GetAdornerLayer()", to get the AdornerLayer associated
with the UIElement.
Call the "Add()" method to bind the Adorner to the target UIElement.
|
[C#]
AdornerLayer adornerLayer = AdornerLayer.GetAdornerLayer(myTextBox);
adornerLayer.Add(new ControlAdorner(myTextBox));
|
31.5 How do I remove the Adorner from an element ?
|
|