Silverlight - scrollbars resize problem while scaling scrollbarview content

Question

I'm having strange problem with silverlight zoom and pan feature. I'm having scrollviewer, inside him border, and inside border my main content (some grids, text boxs etc..) My XAML is looking something like this :

XAML :

 <Grid x:Name="Root" Background="Black">
    <ScrollViewer x:Name="Scroller" HorizontalScrollBarVisibility="Visible">
        <Border x:Name="Sizer">
            <Grid x:Name="LayoutRoot" ShowGridLines="True" RenderTransformOrigin="0.5,0.5">                   
               ... my content which is been scaled ...
            </Grid>
        </Border>
    </ScrollViewer>
</Grid>

Scaling is working excellent. But I tried to implement also pan feature when I zoom in, so that I can go across zoomed content. My zooming part is looking like this :

protected override void OnMouseWheel(MouseWheelEventArgs e)
    {
        base.OnMouseWheel(e);           

        if (e.Delta > 0)
        {
            scale.ScaleX += 0.2;
            scale.ScaleY += 0.2;                
        }
        else if(e.Delta < 0 && (scale.ScaleX > 1 && scale.ScaleY > 1))
        {
            scale.ScaleX -= 0.2;
            scale.ScaleY -= 0.2;                
        }

        Sizer.Width = Sizer.Width * scale.ScaleX;
        Sizer.Height = Sizer.Height * scale.ScaleY;

In the above code at two last line, I'm also resizing Sizer Width and Height (that's border in ScrollViewer) because I want't to automaticly change size of Border so that ScrollViewer can resize himself. But there is problem. Scroll bars aren't catching all the content after the scale.. Sizes of Grid which consist scaled content and ScrollViewer are same during debug :

Sizer_H : 1153,20007324219, LayoutRoot_H : 1153,20004582405, Sizer_W : 2271,60009765625, LayoutRoot_W : 2271,60009026527
Sizer_H : 1614,20007324219, LayoutRoot_H : 1614,20010995865, Sizer_W : 3180,80029296875, LayoutRoot_W : 3180,8002166748
Sizer_H : 2582,40014648438, LayoutRoot_H : 2582,40023088455, Sizer_W : 5089,6005859375, LayoutRoot_W : 5089,6004550457

I'm trying to figure it out where I'm doing wrong.. but with no luck..

Thanks!

Answer 1

I had the very same problem and this is how i worked around it. I enclosed the entire content in the scrollviewer in a canvas and scaled the canvas along with the actual contents being scaled.

Here is a link which elaborates on the implementation details.