Pues bien, Google ha desarrollado un plugin para eclipse llamado Windowbuilder que nos permite diseñar nuestras interfaces gráficas simplemente arrastrando y soltando componentes (botones, etiquetas, cajas de texto, paneles,...) en nuestra ventana de diseño, y él automáticamente se encarga de generar el código Java necesario para ese diseño de ventana.
En la siguiente imagen te muestro la ventana de diseño de formularios con Windowbuilder:
Como ves, en la parte inferior se muestran dos pestañas: Fuente y Diseño
Trabajamos en modo diseño, arrastrando y soltando componentes de la paleta de compentes y, en la pestaña Fuente, se va generando automáticamente el código asociado a nuestro diseño, exactamente igual a como lo hace Visual Studio.
1. Instalación de Windowbuilder
La verdad es que ha sido realmente un follón de instalar, así que te voy a dar algunos pasos básicos que debes realizar:
- Instalar Google Development Toolkit
- Instalar Google Web Toolkit
3. Directorio de instalación de GWT
En eclipse/ventana/preferencias/Windowbuilder/GWT, establece la ruta al directorio de instalación de GWT. En mi caso, cuelga del directorio plugins de mi instalación de eclipse:
En eclipse/ventana/preferencias/Windowbuilder/GWT, establece la ruta al directorio de instalación de GWT. En mi caso, cuelga del directorio plugins de mi instalación de eclipse:
/home/.../eclipseJUNO/plugins/com.google.gwt.eclipse.sdkbundle_2.5.0.v201212122042-rel-r42/gwt-2.5.0
3. Creamos un nuevo proyecto
Ahora que ya tenemos todo instalado y bien configurado, creamos un nuevo proyecto Java, normal y corriente, como lo hemos hecho siempre.
4. Añadimos un JFrame "vitaminado", autogenerado con Windobuilder
Ahora vamos a añadir un nuevo JFrame pero creado por Windowbuilder. Para ello, nos colocamos en el explorador de proyectos sobre nuestro proyecto, botón derecho, nuevo, y elegimos otro tipo de componente:
Bajo Windowbuilder/Swing Designer, seleccionamos JFrame:
Le ponemos un nombre a nuestro JFrame, y como vemos, se muestra en el área de desarrollo el código (con un mogollón de líneas ya preescritas) y con una novedad, y es que en la parte baja vemos que tenemos una pestaña para código y otra para diseño:
5. Pestaña de diseño
Elegimos la visualización de diseño, y se nos muestra nuestro formulario y la toda paleta de componentes de componentes (botones, etiquetas, paneles, cajas de texto,...) que le podemos incluir:
6. Layout absolute al JFrame
Para poder diseñar cómodamente nuestro formulario, establecemos que el layout del formulario sea absolute (ni FloatLayout, ni BoxLayout,...), sino Absolute Layout:
7. Agregamos un simple botón
Ahora sí que es fácil añadir un simple botón al formulario.
En la paleta de componentes, seleccionamos un JButton, y pinchamos donde queramos colocarlo en nuestro formulario:
Ahora que ya tenemos todo instalado y bien configurado, creamos un nuevo proyecto Java, normal y corriente, como lo hemos hecho siempre.
4. Añadimos un JFrame "vitaminado", autogenerado con Windobuilder
Ahora vamos a añadir un nuevo JFrame pero creado por Windowbuilder. Para ello, nos colocamos en el explorador de proyectos sobre nuestro proyecto, botón derecho, nuevo, y elegimos otro tipo de componente:
Bajo Windowbuilder/Swing Designer, seleccionamos JFrame:
Le ponemos un nombre a nuestro JFrame, y como vemos, se muestra en el área de desarrollo el código (con un mogollón de líneas ya preescritas) y con una novedad, y es que en la parte baja vemos que tenemos una pestaña para código y otra para diseño:
5. Pestaña de diseño
Elegimos la visualización de diseño, y se nos muestra nuestro formulario y la toda paleta de componentes de componentes (botones, etiquetas, paneles, cajas de texto,...) que le podemos incluir:
6. Layout absolute al JFrame
Para poder diseñar cómodamente nuestro formulario, establecemos que el layout del formulario sea absolute (ni FloatLayout, ni BoxLayout,...), sino Absolute Layout:
7. Agregamos un simple botón
Ahora sí que es fácil añadir un simple botón al formulario.
En la paleta de componentes, seleccionamos un JButton, y pinchamos donde queramos colocarlo en nuestro formulario:
 |
 |
8. Ejecutamos nuestra aplicación
Y ya tenemos nuestra aplicación ejecutándose:
Y ya tenemos nuestra aplicación ejecutándose:
