enero 09, 2015

Menú desplegable en Java (Accordion)

Hoy le explicaré como hacer su propio menú desplegable en aplicaciones Java usando los componentes Swing, para ello es necesario tener imaginación y paciencia.

Proyecto: Accordion

IDE: NetBeans 8
Conocimiento: Java Básico 
Tiempo estimado: Depende del diseño (el ejemplo fueron 10 min)

Bueno vamos a crear nuestro menú desplegable, abrimos el NetBeans y creamos un nuevo proyecto, creamos un JFrame y a trabajar.

Paso 1) Adicionar un jPanel que será el contenedor de nuestro menú desplegable y en la distribución poner null. (clic derecho sobre el panel y seleccionar la opción como se muestra en la figura)

Paso 2) Adicionar un jPanel (menú 1) que será nuestro primer grupo de opciones.
Paso 3) Adicionar un jToggleButton que será nuestra opción principal del menú dentro del jPanel (menú 1)
Paso 4) Adicionar dentro del jPanel (menú 1)  el resto de las opciones. En este ejemplo son jLabel pero usen los componentes según las necesidades de cada cual.

Nota: Para adicionar más opciones de menú repetir los pasos del 2 al 4.

Una vez terminado el diseño de nuestro menú pasamos a configurarlo para que funcione correctamente. Para eso usamos el evento ActionPerformed del jToggleButton quedando implementado de la siguiente manera:

private void jToggleButtonMenu1ActionPerformed(java.awt.event.ActionEvent evt) {
  if (jToggleButtonMenu1.isSelected()) {
      //Menu 1
      jPanel1.setSize(160, 140);
      //Menu 2
      jPanel2.setLocation(0, 140);
      jPanel2.setSize(160, 40);          
      jToggleButtonMenu2.setSelected(false);          
  }
  else {
      smallMenu();
  }
}
private void jToggleButtonMenu2ActionPerformed(java.awt.event.ActionEvent evt) {                                                  
   if (jToggleButtonMenu2.isSelected()) {
       //Menu 1
       jPanel1.setSize(160, 40);
       jToggleButtonMenu1.setSelected(false);
       //Menu 2
       jPanel2.setLocation(0, 40);
       jPanel2.setSize(160, 140); 
   }
   else {
       smallMenu();
   }



El método smallMenu() es el encargado de recoger nuestro menú hasta las opciones principales, debe adicionarlo en el constructor de la clase para que cuando inicie la aplicación el menú este recogido.

public void smallMenu() {
   //Menu 1
   jPanel1.setSize(160, 40);
   jToggleButtonMenu1.setSelected(false);
   //Menu 2
   jPanel2.setLocation(0, 40);
   jPanel2.setSize(160, 40);           
   jToggleButtonMenu2.setSelected(false);



Ya tienen listo su menú desplegable en java, espero que les sea útil, Saludos y hasta el próximo post.

Descarga el código fuente acá: Accordion