Crear programas en Java usando GUI generados en Glade

En algún momento puedes verte en la necesidad, por interés ó por la cuestión que puedas tener el desarrollar un programa con interfaz gráfica en entornos GNU/Linux, por compatibilidad en la mayoría de las distribuciones aparece GTK+, anteriormente me había tocado hablar de como crear aplicaciones Java basadas en GTK+, si… eso fue hace bastante tiempo, pero para aprovechar ese tiempo y las lineas que te toma el tener que programa dentro de la misma clase el posicionado de una caja o botón se puede reducir realmente el tiempo de desarrollo de programas con interfaz gráfica GTK+ usando el programa por excelencia a la fecha de hoy en la que se escribió esta entrada es haciendo uso de Galde. Una descripción de que es Glade a como lo explican en el sitio oficial:

Glade is a RAD tool to enable quick & easy development of user interfaces for the GTK+ toolkit and the GNOME desktop environment.

The user interfaces designed in Glade are saved as XML, and by using the GtkBuilder GTK+ object these can be loaded by applications dynamically as needed.

He preparado un proyecto en el cual se vera el uso superficial de Glade y explicativo de como usar el archivo generado con Java.

Estructura del proyecto:

• src
  • gui
    • app.glade
  • prog
    • Constants.java
    • Suma.java

Para empezar a tirar código es necesario tener listo preparativos para empezar programar. Habrá que instalar unos los siguientes paquetes:

• java-gnome (API GTK para Java )
• java-gnome-javadoc (Documentación)
• Glade (Desarrollo rápido de aplicaciones para GTK+)

Ya habiendo terminado de instalar todo, es momento de abrir Glade. En esta practica he hecho una plantilla, puedes ver el código generado dando click en app.glade. Habiendo descargado el archivo, en Glade nos dirigimos ha Archivo>Abrir y buscamos el archivo descargado .glade para cargar la interfaz.

El diseño de la GUI, trata de ser simple, podemos observar que varios widgets tienen asignado un ID,  son los  widgets con los que estaremos trabajando y los ID’s tomaran importancia en el código, también puedes modificar el nombre del ID de los botones y cajas de texto en el aparatado de Propiedades, justo donde indica la flecha roja en la siguiente imagen.

Dejaremos los valores como tal si crees que te puede confundir mientras avanzas en esta practica.

A continuación dejare representados en una tabla los Widgets con sus respectivos ID:

El archivo es solo la apariencia, una carroza sin motor pero haremos que funcione usando a Java como nuestro aliado. Utilizaremos la librería java-gnome previamente instalada, en la mayoría de las distribuciones se debe de encontrar en el directorio /usr/lib64/java-gnome/gtk.jar, ahora seria añadir el archivo gtk.jar a un IDE de preferencia.

Ya teniendo preparado el entorno para programar, pasare creando un interface nombrándola Constants donde obtendrá valores constantes de los directorios que usaremos mas adelante:

package prog;
 
public interface Constants {
 
String HOME = System.getProperty("user.home");
String FOLDER_DIR=HOME+"/SumaGlade/gui";
 
}

En la interface se almaceno en la primera variable HOME, el directorio de usuario donde ejecutemos nuestro programa, en la siguiente linea almacenamos en la variable FOLDER_DIR otro futuro directorio que estaremos creando en el directorio del usuario.

La siguiente clase nombrada Suma, utilizara las siguientes clases que proporciona la API:

• Gtk
• Builder
• Window
• Widget
• Entry
• Button

package prog;
import java.io.File;
import java.io.FileNotFoundException;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.InputStream;
import java.io.OutputStream;
import java.text.ParseException;
import org.gnome.gdk.Event;
import org.gnome.gtk.Builder;
import org.gnome.gtk.Gtk;
import org.gnome.gtk.Widget;
import org.gnome.gtk.Window;
import org.gnome.gtk.Window.DeleteEvent;
import org.gnome.gtk.Entry;
import org.gnome.gtk.Button;
import org.gnome.gtk.Button.Clicked;
 
public class Suma implements Constants{
 
    public static Builder builder;
    public static Window window;
    public Entry Text_num1;
    public Entry Text_num2;
    public Entry Text_result;
    public Button bttn_sum;
    public Button buttn_clean;
    public Button bttn_exit;
    public Window w_exit;
 
    public Suma(){  
 
        copyResource();
 
        try {
            builder = new Builder();
            builder.addFromFile(FOLDER_DIR+"/app.glade");
 
        } catch (FileNotFoundException e) {
            System.err.println(""+e.getMessage());
 
        } catch (ParseException e) {
            System.err.println(""+e.getMessage());
        }
 
        iniciarObjectos();
        window.showAll();
 
    }//Fin del constructor
 
    public void iniciarObjectos() {
        //Vamos a enlazar los los objectos correspondientes a los ID de los Widgets
 
        //windows
        window =(Window) builder.getObject("Id_Suma");
 
        //Cajas de texto
        Text_num1 = (Entry) builder.getObject("textNum1");
        Text_num2 = (Entry) builder.getObject("textNum2");
        Text_result = (Entry) builder.getObject("textResult");
 
        //Botones
        bttn_sum = (Button) builder.getObject("botonSuma");
        bttn_sum.connect(on_botonSuma_clicked());
 
        buttn_clean = (Button) builder.getObject("botonLimpiar");
        buttn_clean.connect(on_botonLimpiar_clicked());
 
        bttn_exit = (Button) builder.getObject("botonSalir");
        bttn_exit.connect(on_botonSalir_clicked());
 
        w_exit = (Window)builder.getObject("Id_Suma");
        w_exit.connect(on_calculadora_destroy());
 
    }
 
    private Clicked on_botonSuma_clicked() {
        return new Button.Clicked() {
 
            @Override
            public void onClicked(Button arg0) {
 
                //Se captura los valores ingresados en las cajas de texto
                int num1= Integer.parseInt(Text_num1.getText());
                int num2= Integer.parseInt(Text_num2.getText());
                int suma= num1+num2;
 
                //La operacion de suma de mostrara en la caja de texto "textResult"
                Text_result.setText(Integer.toString(suma));
            }
        };
    }
 
    private Clicked on_botonLimpiar_clicked(){
        return new Button.Clicked() {
 
            @Override
            public void onClicked(Button arg0) {
 
                Text_num1.setText("");
                Text_num2.setText("");
                Text_result.setText("");
 
            }
        };
    }
 
    private Clicked on_botonSalir_clicked() {
        return new Button.Clicked() {
 
            @Override
            public void onClicked(Button arg0) {
                Gtk.mainQuit();
 
            }
        };
 
    }
 
    private DeleteEvent on_calculadora_destroy() {
        return new Window.DeleteEvent() {
 
            @Override
            public boolean onDeleteEvent(Widget arg0, Event arg1) {
                Gtk.mainQuit();
                return false;
            }
        };
    }
 
    public void copyResource() {
 
        File folder = new File(FOLDER_DIR);
        folder.mkdirs();
 
        try {
 
            InputStream input=getClass().getResourceAsStream("/gui/app.glade");
            OutputStream output= new FileOutputStream(FOLDER_DIR+"/app.glade");
            byte [] buffer = new byte[1024];
            int bytesRead;
 
              while ((bytesRead = input.read(buffer,0,1024)) != -1) {
 
                    output.write(buffer, 0, bytesRead);
                }
 
              output.close();
              input.close();
 
         } catch(IOException e) {
            System.err.println(""+e.getMessage());
         }
      }
 
    public static void main(String[] args) {
        System.out.println("Run!");
        Gtk.init(args);
        new Suma();
        Gtk.main();
 
    }
 
}

En la clase Suma podemos ver como se inicia el método main para crear un programa típico de java-gnome iniciando con Gtk.init(args); y finalizando con Gtk.main(); y en medio se hace el llamada al constructor de la misma clase, el constructor llama al método copyResource(), este método hará que nuestro programa se pueda portar fácilmente a otros equipos, Porque?, anteriormente en otra entrada ya había publicado la utilidad que se le puede dar a este método que trata de  copiar y pegar un archivo que esta dentro de un JAR, después de haberse ejecutado el método copyResource() tendremos nuestro archivo Glade en el directorio $HOME/SumaGlade/gui/app.glade.

Dentro del mismo constructor se encuentra un try-catch, se crea un objecto de la clase Builder para usar el método addFromFile que nos ayudara a cargar la interfaz de usuario generado por Glade, al salir del try-catch se manda a llamar al método iniciarObjectos() que realizara la comunicación de los objectos correspondientes a su ID.

Finaliza el constructor con el lanzamiento de la interfaz de usuario invocando la linea window.showAll();. Lo que queda de la clase son métodos que corresponden a las funciones que realizara cuando el usuario interactue con el programa (Sumar, Limpiar y Cerrar).

En realidad no soy experto en el tema de ser un developer, me gusta la programación, bastante diría yo,  esto para mi a sido un reto, no de esos difíciles si no del hecho de aprende algo fuera de lo común, buscando en Internet sobre como desarrollar aplicaciones para GNU/Linux con interfaz gráfica GTK+ es realmente escasa, lo mas popular que puede encontrar es usando lenguajes como C, C# y Python, en Java la información es muy anticuada al igual que los videotutoriales pixeleado por el tiempo, aun mostrado el uso de libglade o lo mas que enseñan es a como instalar Glade XD, mi intención no era desahogarme con ustedes, solo es para que se animen a desarrollar en Linux, y a mostrar al mundo sus trabajos, sera de utilidad para muchos, bueno es  hora de finalizar esta entrada y recuerden, Si se puede imaginar, se puede programar.