Search code examples
c#xamlsilverlightwindows-phone

Implementing Parallax scrolling with fixed header [Windows Phone]


I'm trying to implement something similar to this layout, a fixed header parallax scrolling view. In my case it's not a thin header resembling LongListSelector's fixed header, it's more like a complex pivot control reserving more space.

I've found and tried to work with this example but I couldn't manage to get it working with a fixed header.

Any ideas that could be useful would be appreciated!


Solution

  • Complete post to a possible guide on how to solve this can be found here http://social.technet.microsoft.com/wiki/contents/articles/27772.windows-phone-how-to-keep-a-ui-element-in-view-when-scrolling-a-page-in-windows-phone.aspx

    TL;DR

    In short, if you need to scroll and keep an item static ( so that it will not scroll out of visible window ), you'll need to hook into the ValueChanged event of the ScrollBar inside a ScrollViewer. With that in place you can inspect the value that is returned and validate it to see if the static object needs to be animated too - or not. You validate it against another element on the screen that is your 'top element' or against the top or bottom of the screen itself.

    Demo video of the solution : https://www.youtube.com/watch?v=xsnQCfVUTTA