How do I mask the contents of a WPF Wrappanel?

Well, I wouldn't call this intuitive, but in the end, this worked.

Up vote 1 down vote favorite share g+ share fb share tw.

In which I asked how I could programattically scroll the contents of a WrapPanel up or down on a button click. This question was kindly answered and the accepted solution works well. Problem Now that my thumbnails in the WrapPanel scroll up and down on a button click, how do I mask the WrapPanel so that the tiles don't show when they are outside of frame?

For example, I have a StackPanel above the WrapPanel that holds the scroll up and down buttons, but when I scroll down, the thumbnails cover up the StackPanel above them (and the buttons). Here is my XAML so far, please note that the thumbnails are added to the WrapPanel at runtime: Update Using Dave Clemmer's XAML, my layout is steadier, but then I still end up with the contents of the WrapPanel eclipsing the StackPanel above it. Please see these screen grabs taken before and after the scroll event: BEFORE SCROLL- AFTER SCROLL- Update 2 Set canvas to red background per Dave's comment below.

BEFORE SCROLL- AFTER SCROLL- wpf silverlight xaml wrappanel link|improve this question edited Jan 1 at 21:38 asked Jan 1 at 20:13Matthew Patrick Cashatt1,3791215 90% accept rate.

Thanks for the edits, Dave. That just taught me a few things. Future questions will look better!

Cheers. – Matthew Patrick Cashatt Jan 1 at 20:27 If you need help with scrolling you need to post you XAML with the ScrollViewer. – Blam Jan 1 at 20:38 My pleasure.

So, you want to scroll the WrapPanel and not the StackPanel above it? If so, it would be easier to do something more along the lines of approach 1 in your previous question, and put everything in a Grid, with the StackPanel in row 0 and the WrapPanel with a ScrollViewer in row 1. – Dave Clemmer Jan 1 at 20:39 Thanks again Dave.

Your assumption is correct. If I do that, however, will I end up with a scroll bar or can I still hope for a nice scroll motion in response to a button click event? I didn't want to confuse the issue, but I am actually playing with the Kinect SDK--when hand waves up, thumbnails go up.

Hand waves down, thumbnails go down. So I definitely want to stay away from scroll bars. Thanks!

– Matthew Patrick Cashatt Jan 1 at 20:44.

Well, I wouldn't call this intuitive, but in the end, this worked: Adding the border did the trick. Thanks to Dave for all of your help!

Glad that worked. – Dave Clemmer Jan 1 at 22:07 Thanks again Dave. I couldn't have gotten there without your help.

– Matthew Patrick Cashatt Jan 1 at 22:15 wouldn't it have been sufficient to specify cliptobounds on the canvas? – flq Jan 1 at 22:37.

It sounds like you do not want scrollbars (no ScrollViewer) and want the StackPanel to be fixed. Keep the StackPanel and WrapPanel in separate Grid rows such as.

Thanks Dave, your suggested XAML helps to make a better layout, but I am still having the original problem. Please see my updates above. – Matthew Patrick Cashatt Jan 1 at 21:13 Hmm, strange.

Either you are rendering the images outside of the Canvas in your AnimateScroll method or elsewhere, or (I doubt), the Canvas got expanded outside of its grid row. Can you determine which of these problems it is (such as putting a red background on your Canvas)? – Dave Clemmer Jan 1 at 21:30 Please see new screen grabs above, Dave.

Thanks again! – Matthew Patrick Cashatt Jan 1 at 21:35.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.