Windows Phone 7 WrapPanel within a ScrollViewer

Question

I've got a page with the following XAML in my application.

 <ScrollViewer VerticalScrollBarVisibility="Auto">
   <toolkit:WrapPanel x:Name="WrapPanelImages" />
 </ScrollViewer>

In the page constructor I load a set of images into the WrapPanel. These images are being displayed correctly but scrolling isn't working very well. I'm testing this on the emulator. The problem is that if I drag and scroll downwards as soon as I let the mouse go the ScrollViewer is scrolling back to the top. So it is impossible to get to the bottom of the WrapPanel. If I add the HorizontalScrollBarVisibility property to the ScrollViewer and set it to Auto I get a long line of images that flows off the screen horizontally, but the scrolling works in that case i.e. if I scroll to the right and let go of the mouse it doesn't scroll back to the left automatically.

How can I fix this scroll-to-the-top behavior? Or is this a bug in the emulator? My AppHub registration has not been approved yet so I can't sideload the app on my phone to test it.

Mick N Mick N · Accepted Answer · 2010-12-23T05:31:01

At a glance this sounds like the same problem you get when wrapping a TextBlock in a ScrollViewer and you haven't constrained the ScrollViewer's size to the device height.

Check your ScrollViewer isn't some very large height such that the content is fitting entirely in it without needing to scroll.

If that is the case the action of it bouncing back is normal for trying to scroll past the beginning or end of the content.

Windows Phone 7 WrapPanel within a ScrollViewer

1 Answers