Highlight or outline any UIElement in adorner layer

Question

I would like to be able to somehow outline or highlight any particular UIElement (or perhaps even Visual) in an adorner layer. Adorner is not a problem per se. I am more concerned about creating an outline of a UIElement.

I am aiming at a similar effect that OuterGlowBitmapEffect provides. I want to follow the outer contour of an UIElement. I have tried many approaches with examining Clip property (almost always null) and some other methods but I failed miserably.

Now I am thinking this must surely be easy it is just that I am missing something. In addition, Google was not my friend this time as well.

EDIT: NET 3.5 is a requirement

Answer 1

You can use an OpacityMask with a VisualBrush with its Visual set to the element you want the outline of. Here's an example where we have a Rectangle in the foreground and a TabControl in the background. Since the tab control is not rectangular, we can see if the technique works:

<Grid Background="Gray">
    <TabControl Name="element">
        <TabItem Header="Tab1">
            <TextBlock Text="Hello, world!" FontSize="40" FontWeight="Bold"/>
        </TabItem>
    </TabControl>
    <Rectangle Fill="Yellow" Opacity="0.5">
        <Rectangle.OpacityMask>
            <VisualBrush Visual="{Binding ElementName=element}"/>
        </Rectangle.OpacityMask>
    </Rectangle>
</Grid>

The result looks like this:

Only the tab control and its tab header are highlighted.