Windows Phone 7 WrapPanel within a ScrollViewer - windows-phone-7

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.

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.

Related

Ignore events from children of a ScrollViewer while scrolling

Alright here is my issue. I have a Pivot view. Inside that pivot view a scroll viewer containing many stack panels and grids. On some of the grids I have MouseButton Up Events. What is happening is if I flick the scroll it scrolls as expected but when I release my finger most of the time it fires off the event from mousebutton up. Because technically I let up. The problem is these grids completely fill the screen so finding an area without a mousebutton up to scroll is near impossible. What I want to happen is if the user flicked to scroll I would ideally like it to ignore the mousebutton up event. It does this successfully sometimes but pretty rarely and I have noticed I have to flick pretty fast for it to work as expected.
Any ideas on how to prevent this activity. I assume there is as Listboxes work perfect.
i think u should use windows phone toolkit GestureListener to recognize flick event
I ended up setting a bool for when the scrollviewer was scrolling and based on that allowing the mouseup action to run my code. Here is the the site I used to implement the bool based on scrolling status.
http://blogs.msdn.com/b/ptorr/archive/2010/07/23/how-to-detect-when-a-list-is-scrolling-or-not.aspx

Scrollable when keyboard displayed?

I have a registration form on my layout grid, made out of a stackPanel. Textboxes are taking most of the screen (800px) along with a button. When user is positioned in one of the text boxes, keyboard covers almost half the screen and in order to access boxes below, they first have to click somewhere blank to remove the keyboard and then click another box. It isn't possible to scroll down.
I want to enable same behaviour like when editing name in contacts, but didn't manage yet. How to achieve this?
Try wrapping it into a ListBox or a ScrollViewer (probably easier), like so:
<ScrollViewer>
...
</ScrollViewer>
Also, check to make sure you don't have the same problem described here.
I'm not a WP7 developer but here's what I do in Android and iOS and you may get a hint of what to do.
I wrap my forms in a Scrollable View. This gives easy scrollable features to users without the need of anything else.

howto make a grid in a WP7 app bigger than the screen size?

i have a problem with my WP7 app. i'm creating a screen where the user can make some input and then generate something.
but i can't fit the whole input into the screen size, so i would need a element which has a scroll bar or something and i can add so many elements as i which and then the user scrolls up and down. how to make this?
There is a ScrollViewer control that you can use. Put the grid in the ScrollViewer and you can then scroll around.
encapsulate your content in a <scrollviewer> That should show a scrollable content.

How to see controls which are below the bottom of screen in designer

I have a StackPanel in ScrollViewer with many TextBlock+TextBox (so on the screen I see same scrolling list view like in phone's standard Settings page).
In VS's or Blend's designer is it any simple way to see controls which are bellow the bottom of screen? (I need some kind of scrolling in designer). It must be something simple. Now I am switching off visibility of upper controls to see lower controls and it is boring.
Change the d:DesignHeight to a larger value, such as 2000 (the maximum height), and Expression Blend will allow you to see content that otherwise would require scrolling.
Example screenshot

lock a scrollviewer in place

I have an inkpresenter inside a scrollviewer for a Windows Phone 7 application. Often when the user starts to draw, the scrollviewer takes over mid stroke, making it hard to actually draw stuff. I tried disabling the ScrollBarVisibility when the inkpresenter needs to be used, but then the scroll viewer automatically pans back up to the top. So how can I prevent the scrollviewer from scrolling when the inkpresenter is in use, while still maintaining the scroll position?
<ScrollViewer Name="ScrollBars" VerticalScrollBarVisibility="{Binding ScrollEnabled}" >
<Canvas Height="2000">
...
<InkPresenter Name="InkCanvas" Strokes="{Binding Strokes}" Canvas.Top="500" />
</ Canvas >
</ScrollViewer >
Edit:
So I tried using the scrolling function in the codebehind to update the vertical offset, where I have a button linked to the following code:
var offset = scrollViewer.VerticalOffset;
ScrollEnabled = ScrollBarVisibility.Disabled;
scrollViewer.ScrollToVerticalOffset(offset);
Again, it just goes back up to the top. Any idea whats wrong?
After disabling the VerticalScrollBarVisibility call Scrollviewer.ScrollToVerticalOffset to manually bring the InkPresenter into view.

Resources