6/7/2012 Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java Interfacce utente grafiche Daniela Micucci [email protected] Introduzione alle Swing • Una GUI (Graphical User Interface, interfaccia grafica utente) è un sistema a finestre che permette all’utente di interagire con il sistema • Il package AWT (Abstract Window Toolkit) è il package originale Java per la costruzione di GUI – Nativo, di conseguenza un set limitato di componenti grafiche • Il package Swing è una versione migliorata delle AWT – Non sostituisce completamente le AWT: • Alcune classi AWT sono sostituite da classi Swing • Altre classi AWT sono necessarie quando si usano classi Swing Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java: Interfacce utente grafiche 2 1 6/7/2012 Realizzare interfacce utente: componenti • Una interfaccia utente è costituita da elementi grafici denominati componenti (component) – Componenti tipici sono widget grafici quali bottoni, barre di scorrimento, campi di testo, etc. • I componenti – Permettono all’utente di interagire con l’applicazione – Forniscono all’utente un feedback “visuale” sullo stato dell’applicazione stessa • Tutti i componenti grafici sono istanze della classe JComponent o delle sue specializzazioni Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 3 Tipi di component: controlli di base editabili • Esempi: MenuBar Menu Menu item Combo box Check box Radio button Button Text filed • Altri: – – – – Slider Combo box List … Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 4 2 6/7/2012 Tipi di component: altri tipi • Non editabili: – Label – Progress bar – Tool tip • Editabili – – – – – Color chooser File chooser Table Text area Tree Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 5 Realizzare interfacce utente: contenitori • I componenti non sono a se stanti, ma si trovano all’interno di altri oggetti denominati contenitori (container) • I contenitori contengono e controllano il layout (la disposizione) dei componenti • I contenitori sono essi stessi dei componenti e possono essere inseriti all’interno di altri contenitori • Tutti i contenitori sono istanze della classe Container o delle sue specializzazioni Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 6 3 6/7/2012 Tipi di container: Top level • Esempi: JFrame JDialog • Altri: – Applet Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 7 Tipi di container: Intermedi • Esempi: Scroll pane Tabbed pane Split pane Tool bar • Altri: – JPanel • È un container «invisibile», ma estremamente utile per comporre layout «elaborati» Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 8 4 6/7/2012 Componenti e contenitori AWT Object Container Component + Window Frame • Un’interfaccia utente è realizzata mediante la creazione di componenti e contenitori e dell’inserimento degli uni negli altri add(Component) : void Panel Dialog Applet Swing JLabel JTextArea JTextComponent JComponent JTextField JMenuBar JButton JFrame JDialog JApplet JPanel AbstractButton Anche contenitori all’interno di altri contenitori: I contenitori sono anche componenti JMenuItem Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 9 Componenti e contenitori • Questa nidificazione di componenti (e contenitori) all’interno di contenitori crea un albero di elementi che parte dal contenitore alla radice e si espande alle foglie che sono componenti semplici come ad esempio i bottoni • Radice della gerarchia è sempre – JFrame nel caso di applicazioni – JApplet nel caso di Applet Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 10 5 6/7/2012 La gerarchia di classi • Una porzione della gerarchia Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 11 Componenti e contenitori • L’inserimento di un componente in un contenitore avviene grazie al metodo add definito in Container • Il metodo corretto da usare dipende dal Layout Manager associato al Container – L’oggetto che ha il compito di disporre le componenti nel container a seconda del template specifico Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 12 6 6/7/2012 Esempio JFrame JPanel JLabel Software Architecture Lab www.sal.disco.unimib.it JTextArea JTextField JPanel JButton Programmazione con Java ‐ Interfacce utente grafiche 13 Esempio: una semplice finestra • Una semplice finestra è realizzata attraverso un oggetto della classe JFrame • Un oggetto di tipo JFrame include – Un bordo – E i 3 consueti bottoni per minimizzare, cambiare la dimensione e chiudere la finestra • Un oggetto di tipo JFrame è un contenitore e può quindi includere (add) componenti – Ad esempio: bottoni, menu, etichette di testo, etc. Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 14 7 6/7/2012 Primo esempio import javax.swing.JFrame; public class SwingDemo_01 { public static void main(String[] args) { JFrame primaGUI = new JFrame(); primaGUI.setTitle("Prima GUI"); Creazione della finestra principale Assegnazione di un titolo primaGUI.setSize(300, 200); primaGUI.setVisible(true); } Dimensionamento finestra Pronti per la visualizzazione! } Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 15 La classe JPanel • La classe JPanel costituisce una sottoclasse di Container di uso generale • I JPanel, come i JFrame, costituiscono lo “spazio” su cui inserire una qualsiasi componente GUI (JPanel compresi) • Come si vedrà, i JPanel sono estremamente utili per andare a costruire interfacce utente con un layout articolato Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 16 8 6/7/2012 Esempio con JPanel import javax.swing.JFrame; import javax.swing.JPanel; import java.awt.Color; Creazione di un JPanel Assegnazione di un colore di sfondo public class SwingDemo_01 { public static void main(String[] args) { JFrame primaGUI = new JFrame(); primaGUI.setTitle("Prima GUI"); JPanel pan = new JPanel(); pan.setBackground(Color. PINK); Aggiunta del Jpanel (che gioca il ruolo di componente) Al Contenitore (finestra) primaGUI.add(pan); primaGUI.setSize(300, 200); primaGUI.setVisible(true); } } Attenzione! Il pannello occupa tutta l’area della finestra! Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 17 Esempio con componente import javax.swing.JFrame; import javax.swing.JButton; public class SwingDemo_01 { public static void main(String[] args) { JFrame primaGUI = new JFrame(); primaGUI.setTitle("Prima GUI"); Creazione di un bottone con etichetta JButton bottoneChiusura = new JButton("Click per chiudere"); primaGUI.add(bottoneChiusura); Aggiunta del bottone (componente) al Contenitore (finestra) primaGUI.setSize(300, 200); primaGUI.setVisible(true); } } Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 18 9 6/7/2012 Esempio invocazione metodi add import import import import javax.swing.JButton; javax.swing.JFrame; javax.swing.JPanel; javax.swing.JTextArea; public class SwingDemo_03 { public static void main (String args[]) { JFrame f = new JFrame(); JPanel p = new JPanel(); p.add(new JButton("Ok")); f.add(”South”, p); f.add(”Center”, new JTextArea()); Add con la sola component Add con la component E una posizione espressa mediante Un punto cardinale f.setSize(400,300); f.setVisible(true); } } Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 19 Una GUI meglio programmata • Fini ad ora tutto nel main, ma di norma non si fa così • Quando si programma una applicazione, la classe che costruisce l’interfaccia grafica estende JFrame • Di norma, l’inizializzazione di tutta l’interfaccia grafica (bottoni, menubar, etc.) viene fatta nel costruttore Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 20 10 6/7/2012 Esempio con componente rivisto import javax.swing.JFrame; import javax.swing.JButton; Specializza JFrame public class SwingDemo_01_OK extends JFrame { public SwingDemo_01_OK(){ super("Prima GUI"); Assegna il titolo JButton bottoneChiusura = new JButton("Click per chiudere"); add(bottoneChiusura); } public static void main(String[] args) { SwingDemo_01_OK gui = new SwingDemo_01_OK(); gui.setSize(300, 200); gui.setVisible(true); } Ridimensionamento e visibilità } Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 21 LAYOUT MANAGER Programmazione con Java ‐ Interfacce utente grafiche 22 11 6/7/2012 Layout Manager • Come sono disposti e dimensionati i componenti inseriti all’interno dei container? • La disposizione non è controllata dal container, ma da un Layout Manager associato al container stesso che effettua tutte le decisioni per la disposizione • Nel caso di ridimensionamento, riorganizzano automaticamente i componenti nel container in modo da rispettare il pattern del layout manager di quel container Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 23 Layout Manager • I Layout Manager principali definiti sono realizzati dalle seguenti classi: – java.awt.FlowLayout – java.awt.BorderLayout – java.awt.GridLayout • Se non viene specificato un layout manager, viene applicato quello associato di default del container: – JPanel e JApplet hanno un FlowLayout – JFrame e JDialog hanno un BorderLayout • Per modificare il layout manager di un container si utilizza il metodo setLayout(LayoutManager) della classe Container Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 24 12 6/7/2012 FlowLayout • I componenti aggiunti ad un contenitore che usa questo layout: – vengono disposti uno dopo l’altro da sinistra a destra – mantengono la dimensione (preferred size) del componente – quando lo spazio su una riga termina, il componente successivo viene posizionato sulla riga successiva • Questo tipo di layout viene usato generalmente per disporre bottoni su di un JPanel Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java: Interfacce utente e gestione eventi 25 Come usare un Flow Layout Manager • Costruttori – FlowLayout() • Costruisce un nuovo Flow Layout con allineamento centrale e con un gap verticale ed orizzontale di 5 unità – FlowLayout(int) • Costruisce un nuovo Flow Layout con allineamento specificato da int e con un gap verticale ed orizzontale di 5 unità – FlowLayout(int, int, int) • Costruisce un nuovo Flow Layout con allineamento specificato da int e con un gap specificato da int e int • È usato il metodo add(Component) per questo tipo di layout Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java: Interfacce utente e gestione eventi 26 13 6/7/2012 Come usare un Flow Layout Manager • Allineamenti possibili sono: – CENTER • La variabile per l’allineamento a destra – LEFT • La variabile per l’allineamento a sinistra – RIGHT • La variabile per l’allineamento centrato Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java: Interfacce utente e gestione eventi 27 Esempio import javax.swing.JButton; import javax.swing.JFrame; import javax.swing.JPanel; public class DemoFlowLayout extends JFrame { public DemoFlowLayout() { JPanel p = new JPanel(); p.add(new JButton("Ok")); p.add(new JButton("Cancel")); p.add(new JButton("Exit")); add(p); } FlowLayout di default (CENTER, 5, 5) Visualizzati nell’ordine in cui sono stati aggiunti public static void main (String args[]) { DemoFlowLayout f = new DemoFlowLayout(); f.setSize(300,200); f.setVisible(true); } } Attenzione al ridimensionamento! Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java: Interfacce utente e gestione eventi 28 14 6/7/2012 Esempio import javax.swing.JButton; import javax.swing.JFrame; import javax.swing.JPanel; FlowLayout a sinistra public class DemoFlowLayout extends JFrame { public DemoFlowLayout() { JPanel p = new JPanel(); p.setLayout(new FlowLayout(FlowLayout.LEFT)); p.add(new JButton("Ok")); p.add(new JButton("Cancel")); p.add(new JButton("Exit")); add(p); } public static void main (String args[]) { DemoFlowLayout f = new DemoFlowLayout(); f.setSize(300,200); f.setVisible(true); } } FlowLayout di default a CENTER FlowLayout a RIGHT Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java: Interfacce utente e gestione eventi 29 BorderLayout • Divide il container in 5 zone ben distinte • In ciascuna zona è possibile inserire un solo componente • Quando il container viene ridimensionato: – non cambia la posizione relativa dei componenti – cambia la dimensione dei componenti – ogni spazio in eccesso viene dato alla zona centrale • LayoutManger di default del JFrame Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java: Interfacce utente e gestione eventi 30 15 6/7/2012 Come usare un Border Layout • Costruttori: – BorderLayout() • Costruisce un nuovo BorderLayout senza gap tra i componenti – BorderLayout(int, int) • Costruisce un nuovo BorderLayout con il gap tra i componenti specificato da int e int • Sono usati, per questo layout i metodi: – add(String, Component) • Esempio: fr.add(“North”, button) – add(Component, Object) • Esempio: fr.add(button, BorderLayout.NORTH) Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java: Interfacce utente e gestione eventi 31 Esempio import java.awt.BorderLayout; import javax.swing.JButton; import javax.swing.JFrame; public class DemoBorderLayout extends JFrame { public DemoBorderLayout() { add("North", new JButton("North")); add("West", new JButton("West")); add(new JButton("East"), BorderLayout.EAST); add(new JButton("South"), BorderLayout.SOUTH); } public static void main (String args[]) { DemoBorderLayout f = new DemoBorderLayout(); f.setSize(300,200); f.setVisible(true); } } Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java: Interfacce utente e gestione eventi 32 16 6/7/2012 GridLayout • Crea un layout con un numero di righe e di colonne specificato • I componenti riempiono le celle nell’ordine in cui sono aggiunti • Quando il contenitore è ridimensionato: – non cambia la posizione relativa dei componenti – cambia la dimensione dei componenti stessi Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java: Interfacce utente e gestione eventi 33 Come usare un Grid Layout • Costruttori – GridLayout() • crea un grid layout il cui default di una colonna per i componenti in una singola riga – GridLayout(int, int) • crea un grid layout con il numero di righe e colonne specificato da int e int – GridLayout(int, int, int, int) • crea un grid layout con il numero di righe e colonne specificato da int e int e gap orizzontale e verticale specificato da int e int • L’aggiunta di un componente è mediante add con un solo argomento – Gli elementi sono inseriti da sinistra verso destra, dall’alto verso il basso – Viene riempita la prima riga, poi la seconda, e così via – Le posizioni non possono essere saltate • Unico modo inserire un componente neutro (JPanel o una JLabel senza testo) Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java: Interfacce utente e gestione eventi 34 17 6/7/2012 Esempio import import import import import java.awt.GridLayout; javax.swing.JButton; javax.swing.JFrame; javax.swing.JLabel; javax.swing.JTextField; Esteticamente non molto bello…. public class DemoGridLayout extends JFrame { public DemoGridLayout() { super("Demo GridLayout"); setLayout(new GridLayout(3, 2)); add(new JLabel("Nome:")); add(new JTextField()); add(new JLabel("Cognome:")); add(new JTextField()); add(new JButton("OK")); add(new JButton("Cancel")); } public static void main (String args[]) { DemoGridLayout f = new DemoGridLayout(); f.setSize(300,200); f.setVisible(true); } } Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java: Interfacce utente e gestione eventi 35 Esempio rivisto public class DemoGridLayout_V2 extends JFrame { public DemoGridLayout_V2() { super("Demo set di layout"); JPanel p = new JPanel(); p.setLayout(new GridLayout(2, 2)); p.add(new JLabel("Nome:")); JPanel p1 = new JPanel(); p1.add(new JTextField(10)); p.add(p1); Un po’ meglio, ma anche le label Dovrebbero essere inserite in Jpanel p.add(new JLabel("Cognome:")); JPanel p2 = new JPanel(); p2.add(new JTextField(10)); p.add(p2); add(p); JPanel p3 = new JPanel(); p3.add(new JButton("OK")); p3.add(new JButton("Cancel")); add(p3, BorderLayout.SOUTH); } public static void main (String args[]) { DemoGridLayout_V2 f = new DemoGridLayout_V2(); f.setSize(300,200); f.setVisible(true); } } Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java: Interfacce utente e gestione eventi 36 18 6/7/2012 Esercizio • Realizzare l’interfaccia utente come nell’immagine • Poi si gestiranno gli eventi – Dei radio button – Del text field – Della finestra JFrame (BorderLayout) JPanel (GridLayout) JScrollPane JTextArea (non editabile) Software Architecture Lab www.sal.disco.unimib.it JPanel (FlowLayout) JRadioButton JRadioButton JPanel (FlowLayout,Left) JRadioButton JLabel (con icona) Programmazione con Java ‐ Interfacce utente grafiche JTextField 37 GESTIRE GLI EVENTI Programmazione con Java ‐ Interfacce utente grafiche 38 19 6/7/2012 Event‐driven programming • Le GUI sono implementate basandosi su un modello programmativo denominato event‐driven programming (programmazione guidata da eventi) • La programmazione event‐driven è uno stile di programmazione che utilizza un approccio signal‐and‐ response (segnale‐e‐risposta) alla programmazione • Componenti fondamentali: – Eventi – Ascoltatori Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 39 Eventi • Un event (evento) è un oggetto che agisce da segnale per un altro oggetto noto come listener (ascoltatore) • L'oggetto che genera l'evento è un componente GUI ed è chiamato event source (sorgente dell’evento) • • • • Bottone che è stato premuto Chiusura della finestra Selezione di un radio button Invio su un textfield • L'invio di un evento detto firing the event (generare l’evento) Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 40 20 6/7/2012 Ascoltatori • Un oggetto listener (ascoltatore) esegue alcune azioni in risposta ad un evento • Un componente può avere un qualsiasi numero di ascoltatori • Ciascun ascoltatore può rispondere a differenti tipi di eventi • Oppure molteplici ascoltatori possono rispondere agli stessi eventi Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 41 Esempio evento‐ascoltatore già visto • Un oggetto di tipo Exception è a tutti gli effetti un evento • Di conseguenza, il lancio di un’eccezione è un esempio di generazione di un evento • L’ascoltatore per un oggetto di tipo Exception è il blocco catch che cattura l’evento Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 42 21 6/7/2012 Gestori degli eventi (Event handler) • Un ascoltatore possiede un insieme di metodi che specificano come l’ascoltatore reagirà in relazione ai tipi di eventi • Questi metodi sono chiamati gestori degli eventi (event handler) • Il programmatore ridefinirà il comportamento di questi metodi secondo le specifiche del sistema da realizzare Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 43 Il funzionamento listener Event source event listener listener Il componente genera un evento Ad esempio un bottone Software Architecture Lab www.sal.disco.unimib.it Il/I listener invoca/no un metodo hadler opportuno, passando l’oggetto event come argomento Programmazione con Java ‐ Interfacce utente grafiche 44 22 6/7/2012 La programmazione event‐driven • La programmazione event‐driven è piuttosto differente rispetto alla programmazione vista fino ad ora • Infatti, fino ad ora: – I programmi erano una sequenza di istruzioni eseguite nell’ordine in cui erano state specificate – Un’esecuzione non sequenziale era comunque controllata dalla logica del programma • Ad esempio ripetere le istruzioni in un loop, saltare ad eseguire un altro insieme di istruzioni, o invocare un metodo Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 45 La programmazione event‐driven • Nella programmazione event‐driven sono – creati oggetti che possono generare eventi e – sono creati oggetti che possono reagire a questi eventi • Il programma stesso non determina più l’ordine nel quale le cose possono accadere: ciò che accadrà dipende dall’evento successivo • In particolare i metodi handler sono definiti come metodi che non devono essere invocati in maniera esplicita dal programmatore • Al contrario: i metodi sono invocati in automatico quando un evento segnala che il metodo deve essere invocato Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 46 23 6/7/2012 Il funzionamento in pratica • Un event source è un qualsiasi componente swing • Un event object è un oggetto che rappresenta un evento e contiene informazioni sull’event source e sull’evento stesso • Un event listener di un event source è qualsiasi oggetto: – Che implementa l’interfaccia listener relativa ai tipi di eventi che si vogliono “ascoltare” dall’event source – Che è registrato all’event source come listener i cui metodi vengono elaborati in risposta agli eventi “ascoltati”. • Quando si definisce un componente visuale atomico occorre sempre registrare almeno un event listener che gestisca le interazioni dell’utente con il componente • Un event source può avere più event listener registrati – Per eventi di tipo diverso • Più event source possono avere lo stesso event listener – Il listener riconosce quale source ha generato l’evento tramite l’event object Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 47 Il funzionamento in pratica: esempio Tipo di evento click del mouse su un bottone Event source oggetto della classe JButton Event object oggetto della classe ActionEvent Event listener oggetto di una classe che implementa l’interfaccia ActionListener • Il click sul bottone (event source) genera un evento, viene eseguito il metodo actionPerformed dell’oggetto event listener • Nel metodo actionPerformed viene inserito il codice che implementa l’azione in risposta al click sul bottone • L’unico argomento passato a questo metodo è l’oggetto ActionEvent • La classe che implementa l’interfaccia ActionListener e’ registrata come event listener del bottone mediante il metodo addActionListener Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 48 24 6/7/2012 Il funzionamento in pratica In ogni programma che ha un gestore di eventi, si possono riscontrare le due seguenti porzioni di codice: • 1. Nella dichiarazione di classe che gestisce gli eventi, viene dichiarato che la classe implementa un’interfaccia di tipo listener con al relativa implementazione dei metodi handler public class MiaClasse implements InterfaceListener { public void metodoHandler1(NomeEvent e) { //… } //… } Esempio: public class MiaClasse implements ActionListener { public void actionPerformed(ActionEvent e) { System.exit(0); } } 2. Il codice che registra un’istanza della classe che gestisce l’evento come ascoltatore di una o più component myComponent.addInterfaceListener(listenerObject); Software Architecture Lab www.sal.disco.unimib.it Esempio: MiaClasse listener = new MiaClasse(); myButton.addActionListener(listener); Programmazione con Java: Interfacce utente e gestione eventi 49 Esempio con componente import import import import javax.swing.JFrame; javax.swing.JButton; javax.swing.JFrame; javax.swing.JButton; public class SwingDemo_01_OK extends JFrame { public SwingDemo_01_OK(){ super("Prima GUI"); JButton bottoneChiusura = new JButton("Click per chiudere"); Crea un ascoltatore per gli eventi generati dal bottone ButtonClosingProgram listener = new ButtonClosingProgram(); bottoneChiusura.addActionListener(listener); add(bottoneChiusura); Registra il bottone al listener } public static void main(String[] args) { SwingDemo_01_OK gui = new SwingDemo_01_OK(); gui.setSize(300, 200); gui.setVisible(true); } } import java.awt.event.ActionListener; import java.awt.event.ActionEvent; public class ButtonClosingProgram implements ActionListener { public void actionPerformed(ActionEvent e) { System.exit(0); } } È il solo metodo handler definito In ActionListener Software Architecture Lab www.sal.disco.unimib.it È un listener Programmazione con Java ‐ Interfacce utente grafiche 50 25 6/7/2012 Un solo listener per più eventi source //… JButton b1 = new JButton("OK"); b1.addActionListener(new ButtonClosingProgram()); //… JButton b2 = new JButton("OK"); b2.setActionCommand("OK b2") b2.addActionListener(new ButtonClosingProgram()); import java.awt.event.ActionListener; import java.awt.event.ActionEvent; public class ButtonClosingProgram_V2 implements ActionListener { public void actionPerformed(ActionEvent e) { if(e.getActionCommand().equals("OK")) { System.exit(0); } else{ if(e.getActionCommand().equals("OK b2")){ //... } } } } Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 51 Alcuni tipi di eventi e relativi listener Eventi Tipi di Listener Click su un bottone, selezione di un menù item, ActionListener invio da tastiera Chiusura, iconizzazione e ridimensionamento di WindowListerner una finestra Click del mouse su un componente MouseListener Movimento del mouse su un componente MouseMotionListener Un componente diventa visibile ComponentListener Un componente acquista il fuoco FocusListener Cambia la selezione su una lista o su una tabella ListSelectionListener … … Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 52 26 6/7/2012 Gli eventi • Gli eventi possono essere divisi in due gruppi: – Eventi di basso livello (low‐level events) • Rappresentano “accadimenti” del window‐manager • Eventi da mouse e da tastiera – entrambi sono il risultato di un input da parte dell’utente • Eventi da Component, Container, focus e window – Eventi semantici (semantic events) • Includono eventi di tipo action, adjustment, item, e text • Questi eventi sono il risultato di un’interazione specifica sul componente da parte dell’utente • Per esempio si verificano: – eventi di tipo Adjustment quando l’utente cambia il valore di una scrollbar – eventi di tipo item quando l’utente seleziona un item all’interno di un gruppo di item – eventi di tipo Text quando il testo in una text area o il text field cambia Programmazione con Java: Interfacce utente e gestione eventi Software Architecture Lab www.sal.disco.unimib.it 53 JButton • La classe JButton fornisce un’implementazione di default per i bottoni • Tipo di evento: – genera un ActionEvent nel momento in cui l’utente clicca su di esso • Tipo di listener per la sua gestione – ActionListener • Metodi da implementare: – actionPerform(ActionEvent) Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java: Interfacce utente e gestione eventi 54 27 6/7/2012 JCheckBox • La classe JCheckBox fornisce un menu a tendina (tramite cui scegliere una voce), accessibile per mezzo di un particolare bottone • Tipo di evento: – Genera un ActionEvent nel momento in cui l’utente sceglie un item mediante doppio click – Genera un ItemEvent nel momento in cui l’utente effettua un singolo click su un item • Tipo di listener per la sua gestione – ActionListener per eventi ActionEvent • Metodi da implementare: – actionPerform(ActionEvent) – ItemListener per eventi ItemEvent • Metodi da implementare: – itemStateChanged(ItemEvent) Programmazione con Java: Interfacce utente e gestione eventi Software Architecture Lab www.sal.disco.unimib.it 55 JFrame • Tipo di evento: – Genera un WindowEvent nel momento in cui l’utente interagisce con la finestra • Tipo di listener per la sua gestione – WindowListener per eventi WindoEvent • Metodi da implementare: – windowOpened(WindowEvent) – windowClosing(WindowEvent) » Invocato quando si schiaccia sulla X della finestra – windowClosed(WindowEvent) – … Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 56 28 6/7/2012 Nota finale: classi anonime import import import import java.awt.event.ActionEvent; java.awt.event.ActionListener; javax.swing.JButton; javax.swing.JFrame; public class Prova extends JFrame { public Prova(){ super("Prima GUI"); JButton bottoneChiusura = new JButton("Click per chiudere"); Crea un ascoltatore per gli eventi generati dal bottone bottoneChiusura.addActionListener(new ActionListener(){ public void actionPerformed(ActionEvent arg0) { System.exit(0); } }); add(bottoneChiusura); } public static void main(String[] args) { Prova gui = new Prova(); gui.setSize(300, 200); gui.setVisible(true); } } Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 57 Esercizio con gestione eventi • Invio sul textfield – lettura del valore inserito e, sulla base del radio button selezionato, si fa deposito, prelievo o si mostra una finestra di avviso se è selezionato estratto • Gestione radio button – Imposta una variabile di stato che rappresenta il tipo di operazione da effettuare – Se selezionato estratto, allora viene stampato sulla text area il saldo • Chiusura Finestra – Uscita dal programma Software Architecture Lab www.sal.disco.unimib.it Programmazione con Java ‐ Interfacce utente grafiche 58 29