Java: Como activar el editor visual en Eclipse - CableNaranja

Java: Cómo activar el editor visual en Eclipse

¡Comparte nuestro contenido!

¡Haz clic para puntuar esta entrada!
(Votos: 4 Promedio: 3)

Window Builder, es el nombre del editor visual que podemos usar en Eclipse para desarrollar aplicaciones con interfaz gráfica de usuario , ya sea con AWT, SWT, Swing o cualquier otro GUI. Pese a que no es tan popular como lo fue en su tiempo NetBeans, no deja de ser una buena alternativa para nosotros. Por eso, en esta ocasión nos vamos a dar la tarea de activarlo ¡Así que abramos Eclipse y manos a la obra!

Activación paso a paso de Window Builder

En el Menú Help, seleccionamos la opción Install New Software.

Java: Como activar el editor visual en Eclipse - CableNaranja

Aparecerá la ventana de diálogo Available Software. En ella, abrimos la lista de opciones Work with y seleccionamos el repositorio de releases de nuestra versión de Eclipse. En mi caso, es la 2020-06.

Java: Como activar el editor visual en Eclipse - CableNaranja

Cuando el repositorio cargue, en la parte inferior encontraremos la lista de categorías que tenemos para instalar. En ella, abrimos la lista llamada General Purpose Tools y seleccionaremos las siguientes opciones:

  • WindowBuilder Core
  • WindowBuilder Core Documentation
  • WindowBuilder Core UI
  • WindowBuilder Java Core
  • Swing Designer
  • Swing Designer Documentation

Cuando terminemos de seleccionar, presionamos el botón Next.

Java: Como activar el editor visual en Eclipse - CableNaranja

La siguiente pantalla sólo es informativa, presionemos Next para continuar.

Java: Como activar el editor visual en Eclipse - CableNaranja

Para terminar, aceptamos los términos de la licencia y presionamos el botón Finish.

El progreso de la instalación de los paquetes, lo podemos ver en la esquina inferior derecha de Eclipse.

Java: Como activar el editor visual en Eclipse - CableNaranja

Cuando termine la instalación, se nos pedirá reiniciar Eclipse. Presionemos el botón Restart Now.

Java: Como activar el editor visual en Eclipse - CableNaranja

Probemos el editor visual de Eclipse

Cuando el programa reinicie, encontraremos que ahora, en cada proyecto nuevo tendremos disponible el botón Create new visual clases. Al abrirlo, encontraremos los diferentes tipos de clases que podemos crear.

Para ponerlo a prueba, seleccionamos Swing y luego JFrame.

Java: Como activar el editor visual en Eclipse - CableNaranja

En la ventana de diálogo Create Frame, establecemos el Name para la clase y presionamos el botón Finish.

Java: Como activar el editor visual en Eclipse - CableNaranja

Cuando Eclipse termine de crear todo, nos mostrará el código generado para la clase. En la parte inferior, encontraremos ahora el botón Design.

Java: Como activar el editor visual en Eclipse - CableNaranja

Al presionar dicho botón, llegaremos al editor visual de clases. Por lo que ya podemos comenzar a crear nuestra aplicación.

Java: Como activar el editor visual en Eclipse - CableNaranja

¡Ayuda, el editor visual no aparece o sale todo en blanco!

Al parecer en las últimas versiones de Eclipse no es suficiente con instalar los componentes que mencionamos arriba, así que si eres de los que han tenido alguno de estos problemas al activar el editor visual de Eclipse, intenta lo siguiente:

En el menú Help. selecciona Eclipse Marketplace.

Java: Como activar el editor visual en Eclipse - CableNaranja

En la sección Search de la ventana de diálogo, escribe la palabra windowBuilder y luego presiona el botón Go.

Java: Como activar el editor visual en Eclipse - CableNaranja

Una vez aparezca WindowBuilder, presiona el botón Installed (Importante: No usar la versión Nightly Build)

Java: Como activar el editor visual en Eclipse - CableNaranja

En la siguiente ventana, presiona el botón Change.

Java: Como activar el editor visual en Eclipse - CableNaranja

Selecciona todos los componentes que falten y presiona el botón Confirm.

Java: Como activar el editor visual en Eclipse - CableNaranja

En la siguiente ventana, solo presiona el botón Finish.

Java: Como activar el editor visual en Eclipse - CableNaranja

Por último, presiona el botón Restart Now (Y si no te lo pide, hazlo de manera manual)

Java: Como activar el editor visual en Eclipse - CableNaranja

¡Y con eso finalizamos este artículo! ¿Te ha resultado? Déjanos saber en los comentarios aquí abajo, en nuestra cuenta de twitter @cablenaranja7 o en nuestra página de facebook.

¡Comparte nuestro contenido!

Entradas relacionadas

17 comentarios en "Java: Cómo activar el editor visual en Eclipse"

  1. Gracias por el artículo! Pero cuando selecciono JFrame me dice que el nombre de la source folder está vacía, selecciono y me dice que no existe. Cómo lo puedo solucionar?

      1. Gracias, no soy Sergio, pero me funcionó. Muy bien explicado el proceso de instalación y creación, gracias por compatir tu conocimiento.

  2. Cuando migre (importar el proyecto en otro eclipse) el proyecto donde si me aparecía la pestaña de Design ya no me aparece, sin embargo, en este nuevo eclipse si puedo crea nuevos Frame o Panel y utilizar la pestaña Design, pero no reconoce lo que ya tenía para que aparezca la pestaña Design y pueda hacer algunos cambios. Que puedo hacer?

    1. Saludos. A veces cuando uno migra un proyecto se desactiva el editor visual. Revisa de nuevo en el Eclpse Marketplace si lo tienes activo. Mira la sección “¡Ayuda, el editor visual no aparece o sale todo en blanco!” de este mismo tutorial.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *