2009-01-27 16 views
15

Tengo una ventana que tiene mucho contenido. Me gustaría poder separar el contenido mediante paneles y tener un separador en el que el usuario puede hacer clic en el alternar entre cada panel (con una animación que mueve el separador de izquierda a derecha, mostrando una sección y ocultando la otra) . Piense en Microsoft Office (2007) navigation pane. ¿Hay una manera fácil de lograr esto?¿Existe un control WPF que pueda usar para expandir/colapsar paneles (animados)

Gracias!

Respuesta

6

Creo que lo que busca es un control de "acordeón", aquí es un puesto abotu cómo construir una de una pila de Expander controles:

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

Y para la animación eche un vistazo al control "Reveal" de los bag-o-tricks de Kevin al http://j832.com/bagotricks/

Creo que incluso hay una plantilla animada de control del expansor basada en el control Reveal en el proyecto de muestra.

+0

Enlace muerto. Blog existe, la publicación no. Dic 2015 – kaplooeymom

7

Yo uso Expander.

<Expander Header="Items" IsExpanded="False"> 
    ... 
</Expander> 
+1

Eso no animar fuera de la caja. –

13

también necesito esto para mi aplicación WPF, y lo mejor que he encontrado es el control de acordeón con todas las funciones en el juego de herramientas:

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

El código fuente está disponible here, y una en vivo demo here. Probablemente sea fácil de portar a WPF. Hay un 5 part blog entry de Ruurd Boeke discutiéndolo en detalle. En part 4, se explica cómo cambiar el estilo del acordeón uso de plantillas para conseguir este gran aspecto de acordeón:

alt text http://www.sitechno.com/Blog/content/binary/WindowsLiveWriter/AccordionPart4templatingexample_1219A/image_thumb_7.png alt text http://www.sitechno.com/Blog/content/binary/WindowsLiveWriter/AccordionPart4templatingexample_1219A/image_thumb_8.png

Cuestiones relacionadas