Question

I have a window that has a lot of content. I'd like to be able to separate the content using panels, and have a separator that the user can click on the toggle between each panel (with an animation that moves the separator from left to right, showing one section and hiding the other). Think of the Microsoft Office (2007) navigation pane. Is there an easy way to accomplish this?

Thanks!

Was it helpful?

Solution

I think what you are looking for is an "Accordion" control, here is a post abotu how to build one from a stack of Expander controls:

http://www.rooijakkers.net/Blog/post/2007/11/WPF-implementation-of-a-basic-Accordion-control.aspx

And for the animation take a look at the "Reveal" control from Kevin's bag-o-tricks at http://j832.com/bagotricks/

I think there's even an animated Expander control template based on the Reveal control in the sample project.

OTHER TIPS

I also need this for my WPF application, and the best I've found is the fully featured Accordion control in the Silverlight Toolkit:

alt text http://www.sitechno.com/Blog/ct.ashx?id=a7c3c2d9-9446-4236-bc6e-c436427002ff&url=http%3a%2f%2fwww.sitechno.com%2fBlog%2fcontent%2fbinary%2fWindowsLiveWriter%2fAccordionpart1_102BB%2fimage_2.png

The source code is available here, and a live demo here. It's probably easy to port to WPF. There's a 5 part blog entry by Ruurd Boeke discussing it in details. In part 4, he discusses how to restyle the accordion using templates to get this great accordion look:

alt text
(source: sitechno.com)

alt text
(source: sitechno.com)

I use Expander.

<Expander Header="Items" IsExpanded="False">
    ...
</Expander>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top