Menú Acordeón deslizante – WPF


El menú que voy a mostrar es algo diferente al menú acordeón que se encuentra en el Wpf Toolkit, el menú va a tener el siguiente comportamiento:

– Se tienen varios paneles o bordes, los cuales van a tener algún contenido, todos los bordes están dentro de un StackPanel

– El StackPanel tendrá un ancho definido

– El ancho de cada borde depende del total de Controles Border que hay en el stack Panel y del tamaño del StackPanel

– La orientación del StackPanel es Horizontal, por lo tanto es un menú Horizontal, aunque puede ser cambiado a Vertical

– Los bordes van a tener un  estado inicial que es “cerrado” y no se verá todo su contenido

– Cuando el Mouse pase por encima o entre en el contenido de algún borde, este se abrirá, cambiando su ancho a un tamaño definido más grande que el tamaño que tienen cuando esta “cerrado”, los demás bordes se cerraran aún más para ocupar el espacio sobrante, en total la sumatoria del espacio del borde seleccionado abierto y los demás bordes cerrados dará el tamaño del StackPanel.

– Si el Mouse se pasa a otro borde, se cerrará el borde seleccionado anteriormente y se repetirá el mismo efecto con el borde seleccionado.

– Si el Mouse no esta seleccionando ningún borde, estos estarán cerrados, ocupando todo el tamaño del StackPanel.

En acción el Menú se verá así:

Sigue leyendo