WPF Image control clipping

Question

Hi all!

I have an Image control inside a custom ContentControl that I use to apply some transforms (scaling and translating through the RenderTransform). The problem is that with images bigger than the control's area, if I scroll or zoom out it's all clipped as in the original viewport.

Is there a way to force the image to draw itself completely? (already tried to set ClipToBounds to false)

By the way if I try to put an image as the background of a canvas it works correctly.

Edit, here's some details.

My Control:

public class CustomControl: ContentControl

The setup phase:

source = VisualTreeHelper.GetChild(this, 0) as FrameworkElement;
...
source.RenderTransform = this.transformGroup;

The transform group is made of a translation and a scale transform.

The xaml part is this:

<ui:CustomControl ClipToBounds="True">
    <Image
        Source="{Binding Path=BackgroundImage}"
        Stretch="None"
        ClipToBounds="False"/>
</ui:CustomControl>

Answer 1

You need to Have a scroll viewer inside your custom control. Within the scroll viewer include the image control.

HTH

Answer 2

I think I found a solution. Wrapping my image inside a canvas solved the issue, probably due to the way canvas size is computed.