Exempt control in AdornerLayer from ViewBox stretching

Question

I have a WPF control that is roughly layed out like this:

<ViewBox Stretch="Uniform" Name="viewboxName">
    <ItemsControl>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <!-- a bunch of controls here that I want stretched in the viewbox -->
             </DataTemplate>
         </ItemsControl.ItemTemplate>
    </ItemsControl>
</ViewBox>

Then, in the AdornerLayer, I have (using a technique based on http://shevaspace.blogspot.com/2007/02/visual-level-programming-vs-logical.html) a button control defined as

<Button>
    <Image Source="/AcchImageLoad;component/icons/metroStudio/ImageRotation.png" Stretch="None" />
</Button>

How can I get this button in the AdornerLayer to use the image's native resolution, instead of stretching with the ViewBox?

score 1 · Accepted Answer · edited May 23 '17 at 12:30

Basically, the idea is to get the transform from the ViewBox and apply the inverse, with a binding converter.

The binding converter can get the inverse with the following code:

((ContainerVisual)VisualTreeHelper
.GetChild((System.Windows.DependencyObject)viewbox, 0)).Transform.Inverse

In xaml, the binding would look something like

<Button.LayoutTransform>
    <MultiBinding Converter="{bc:ExemptFromViewboxTransformConverter}">
       <Binding Source="{x:Reference Name=viewboxName}" />
       <!-- The ActualWidth/ActualHeight bindings are only used to ensure 
            the transform updates when the window is resized. -->
        <Binding Source="{x:Reference Name=viewboxName}" Path="ActualWidth" />
        <Binding Source="{x:Reference Name=viewboxName}" Path="ActualHeight" />
    </MultiBinding>
</Button.LayoutTransform>

Exempt control in AdornerLayer from ViewBox stretching

2 Answers2