Diferència entre revisions de la pàgina «DAM-M3-UF5. Interfícies Gràfiques d'Usuari (GUI)»

Revisió del 23:07, 7 set 2012

torna M3 - Programació

Interfícies gràfiques. GUI

Introducció

Un dels aspectes importants actualment alhora de crear aplicacions és la part gràfica, a continuació es descriuen els mecanismes bàsics de Java per al desenvolupament de GUI (Graphic User Interface).

Una GUI és una Interfase que permet a l’usuari comunicar-se amb el sistema.

Les aplicacions d’entorn gràfic de Java es componen de tres conceptes que es relacionen

JFC (Java Foundation Classes) inclou les característiques necessàries per crear GUI. Els paquets que s’utilitzen habitualment per a desenvolupar aplicacions gràfiques són

• java.awt.* : Abstract Window Toolkit. Components gràfics del SDK per crear GUI.

• java.awt.event.* : Tractament dels esdeveniments associats

• javax.swing.* : Ampliació dels components gràfics per crear GUI

Java és un llenguatge multiplataforma i per tant les seves eines gràfiques són també multiplataforma.

Enllaç bàsic i indispensable!!! http://java.sun.com/docs/books/tutorial/uiswing/index.html

Contenidors

Un contenidor és un element base, dins del qual es poden afegir altres elements, els contenidors també actuen com components i es poden afegir dins altres contenidors.

Els Contenidors hereten de la classe abstracta java.awt.Container. Exemples són:

• Frames (classe javax.swing.JFrame). Finestra principal

• Panels (classe javax.swing.JPanel). Panells on col·locar els components dins la finestra

• Applets (classe javax.swing.JApplet). Applets per afegir a pàgines web.

	 	 	 	public class FrameSimple extends JFrame {

    public FrameSimple() {
        super();
        initialize();
    }

    private void initialize() {
        this.setTitle("Finestra Simple");
        this.setSize(350,200); //Mida
        this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        this.setTitle("Finestra simple"); //Títol
        this.setVisible(true); // Propietat de visibilitat
    }

    public static void main (String args[]) {
        FrameSimple mainFrame = new FrameSimple();
    }
}

Nivells de contenidors

Java utilitza una estructura per nivells per col·locar els diferents elements gràfics, abans de començar a col·locar els components cal estructurar el contenidor.

Normalment el primer contenidor serà un JFrame o JApplet, anomenats Top-Level Containers, i a partir d’aquest es crea una estructura jeràrquica amb diferents contenidors.

Per exemple una estructura típica inclou un JFrame dins del qual tenim per una banda el contenidor (ContentPane) on s’afegeixen els diferents components i un menú.

El ContentPane es pot crear a partir d’un JPanel per exemple setContentPane(contentPane) o obtenir el que hi ha per defecte toplevelContainer.getContentPane(): Container.

        JPanel contentPane = new JPanel(new BorderLayout());
        //... crear components
        JLabel l = new JLabel("Hola");
        contentPane.add(l, BorderLayout.CENTER);
       
        this.setContentPane(contentPane);

Components

Un component és tot allò que es pot pintar a una pantalla i és susceptible de rebre esdeveniments.

Hi ha molts tipus de components o controls, tants com et puguis imaginar.

• Etiquetes de text. Classe javax.swing.JLabel

• Botons. Classe javax.swing.JButon

• Àrees de text. Classe javax.swing.JTextField

• Selecció. Classe javax.swing.JChoice

• Checkboxes. Classe javax.swing.JCheckbox. Agrupats o no en un Checkboxgroup (classe java.awt.CheckboxGroup)

• Llistes. Classe java.swing.JList

• Menús. Classe javax.swing.JMenu

• Selector de color. Classe javax.swing.JColorChooser

• Selector de fitxers. Classe javax.swing.JFileChooser

public class Contenidor extends JPanel {
    public Contenidor() {
        super();
        JLabel etiqueta = new JLabel( "Etiqueta qualsevol", SwingConstants.CENTER );
        etiqueta.setBackground(Color.CYAN);
        etiqueta.setForeground(new Color(255,0,0));
        this.add(etiqueta);
        JTextArea text = new JTextArea("Camp de Text", 10, 10);
        this.add(text);
        JButton boto = new JButton( "Acció1" );
        this.add(boto);
    }
}

// Afegir el contenidor al Top-Level
//this.setContentPane(new Contenidor());

Organitzadors de components

Els Layout managers (Organitzadors de components), s’encarreguen de gestionar l’esquema general dels components dins els contenidors (a la pantalla), dimensions, alineació, etc...

Els principals són:

	java.awt.BorderLayout. Administrador per defecte dels contenidors Frames. Depenent de la zona respecta o no les dimensions dels components
	java.awt.FlowLayout. Administrador per defecte dels contenidors Panels. Els components es disposen un darrera l’altre, per ordre i quan no caben una nova línia, respecta dimensions dels components
	java.awt.GridLayout. Disposa els elements en una matriu de files i columnes. No respecta dimensions dels components
	java.awt.SpringLayout. És molt flexible, es basa en disposar els elements respecte altres elements o respecte el propi contenidor. Més complex de configurar que els anteriors, però necessari per dissenyar interfícies complexes.
Sense contenidor	Null, També és possible crear un contenidor sense organitzador. És poc recomanable