Softwaretechnik

Softwaretechnik
Programmieren von GUIs mit Swing
Fachhochschule Wiesbaden, FB Informatik
Studiengang Medieninformatik
Vorlesung im WS 2002/2003
1
Literatur
„
H.M. Deitel, P.J. Deitel
Java – How to Program, Introducing Object-Oriented Design with the UML
and Design Patterns
Prentice Hall, 2002, ISBN 0-13-0345151-7, 4. Auflage
Kapitel 12 und 13 dieses allgemeinen Java-Buches liefern eine gute, knappe
Einführung in die Swing-Programmierung ohne auf AWT aufzubauen. Buch ist etwas
bunt, aber dennoch empfehlenswert.
Großteil dieser Einführung basiert auf diesen Kapiteln
„
John Zukowski
Definitive Guide to Swing for Java 2, Second Edition
Apress, 2000, ISBN 1-893115-78-X
Sehr gelobtes, umfassendes Buch über Swing-Programmierung.
„
„
„
Andere Swing-Bücher
Swing-Kapitel in anderen Java-Büchern
The JFC Swing Tutorial im Java Tutorial
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
2
1
Softwaretechnik (Medieninformatik): GUIs mit Swing
Überblick
1
2
3
4
5
Einführung
Einfache Swing Komponenten
Ereignisbehandlung und Adapterklassen
Layout Manager
Komplexere Swing Komponenten
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
3
Softwaretechnik (Medieninformatik): GUIs mit Swing
Überblick: 1. Einführung
1.1
Was ist Swing?
1.2
1.3
Ein erstes Swing-Programm
Ereignis Behandlung
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
4
2
1. Einführung
1.1 Was ist Swing?
„
Erstellen von graphischen Benutzerschnittstellen
‰
‰
Graphical User Interface: GUI
Völlig andere Programmstruktur
„
Nicht einfach ein Hauptprogramm, das Methoden verschiedener
Objekte der Reihe nach aufruft
„
Auch nicht nur ein Menüsystem
„
Programm wird durch Benutzerinteraktion gesteuert
‰
‰
‰
„
Art und Reihenfolge nicht im Detail planbar
Ereignisgesteuerte Anwendung
Tastatureingabe, Mausklick, ...
Realisiert durch sog. Model-View-Controller Anwendungsarchitektur
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
5
1. Einführung
1.1 Was ist Swing?
„
Model-View-Controller (MVC) Anwendungsarchitektur
‰
‰
Realisierbar durch Observer Design-Pattern
Beobachter beobachtet eine Sache
„
Registriert sich bei der Sache
„
Wird von Änderungen informiert
„
Verschieden Visualisierungen derselben Sache sind möglich
‰
„
Verschiedene Views desselben Modells
Soweit auch als Document-View Architektur bekannt
‰
© Prof. Dr. Björn Dreher
Microsoft Foundation Classes (MFC)
Softwaretechnik (Medieninformatik)
6
3
1. Einführung
1.1 Was ist Swing?
„
MVC Rollen
‰
‰
‰
Model:
„
Repräsentiert internen Zustand eines Objektes
„
Speichert diesen
„
Stellt Methoden zum Ändern und Abfragen zur Verfügung
View:
„
Stellt Zustand des Modells dar
„
Benutzt dazu die Methoden des Modells
Controller:
„
Reagiert auf Interaktion mit der graphischen Oberfläche
„
Aktualisiert den Zustand des Modells
„
Sorgt dafür, dass View aktualisiert wird
„
Ruft ggf. anderen View auf
© Prof. Dr. Björn Dreher
7
Softwaretechnik (Medieninformatik)
1. Einführung
1.1 Was ist Swing?
„
MVC Architektur
Benutzereingaben
Bildschirmausgabe
Änderung der Darstellung
Controller
View
Änderungen in der
Benutzerschnittstelle
Veränderung von
Daten
© Prof. Dr. Björn Dreher
Model
Zugriff auf Daten
zur
Visualisiereung
Softwaretechnik (Medieninformatik)
8
4
1. Einführung
1.1 Was ist Swing?
„
MVC Realität
‰
‰
‰
‰
View und Controller sind meistens eng miteinander verbunden
Trennung würde Entwurf von visuellen Komponenten komplizieren
Hätte höheren Kommunikationsaufwand zwischen View und Controller
zur Folge
Daher in der Praxis:
„
Model und View sind eine Komponente, d.h. eine Klasse
„
Basisklasse JComponent, delegiert an ComponentUI
„
Swing-Komponente kann aber (im Innern) noch weitere
Bestandteile besitzen
‰
Ihr eigenes Modell
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
9
1. Einführung
1.1 Was ist Swing?
„
Komponenten Beispiele
‰
‰
‰
‰
‰
JLabel
„
Konstanter Text oder Graphik, nicht editierbar
JTextField
„
Texteingabefeld; kann auch Text nur darstellen
JButton
„
Knopf zum Anklicken: Löst ein bestimmtes Ereignis (event) aus
JCheckBox
„
Kann selektiert oder nicht selektiert sein
JComboBox
„
Drop-down Liste von Einträgen, von denen einer oder mehrere
ausgewählt werden können. Doppelklick erzeugt ein Action
Ereignis (action event)
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
10
5
1. Einführung
1.1 Was ist Swing?
„
Komponenten Beispiele (fortgesetzt)
‰
‰
JList
„
Normale Liste von Einträgen, von denen einer oder mehrere
ausgewählt werden können. Doppelklick erzeugt ein Action
Ereignis (action event)
JPanel
„
Ein Container, der Swing-Komponenten aufnehmen kann
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
11
1. Einführung
1.1 Was ist Swing?
„
Packages
‰
‰
‰
Haupt Swing-Package
„
javax.swing
„
Sog. lightweight components
„
Vollständig in Java geschrieben
Frühere Generation von GUI-Komponenten: Abstract Windowing
Toolkit (AWT)
„
java.awt
„
Enge Kopplung an graphische Oberfläche der BetriebssystemPlattform
„
Darstellung abhängig von dieser
„
Sog. heavyweight components
„
Delegieren an zugehörige Komponente des Packages
java.awt.peer, um mit Betriebssystem-Plattform zu wechselwirken
Swing Komponenten erben trotzdem oft von AWT Komponenten
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
12
6
1. Einführung
1.1 Was ist Swing?
„
Vererbungshierarchie
Gemeinsame Methoden für alle
GUI Komponenten, z.B. paint(),
repaint(), update()
java.lang.Object
java.awt.Component
Funktionalität für Collection von
zusammengehörigen
Komponenten, z.B. JPanel.
Methoden add() und setLayout()
java.awt.Container
javax.swing.JComponent
© Prof. Dr. Björn Dreher
Basisklasse fast aller Swing
Komponenten
Softwaretechnik (Medieninformatik)
13
Softwaretechnik (Medieninformatik): GUIs mit Swing
Überblick: 1. Einführung
1.1
Was ist Swing?
1.2
Ein erstes Swing-Programm
1.3
Ereignis Behandlung
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
14
7
1. Einführung
1.2 Ein erstes Swing Programm
„
Swing Komponente JLabel
// Java core packages
import java.awt.*;
import java.awt.event.*;
// Java extension packages
import javax.swing.*;
public class LabelTest extends JFrame {
private JLabel label1, label2, label3;
Behälter für visuelle
// set up GUI in constructor
Komponenten des
public LabelTest()
Frames
{
super( "Testing JLabel" ); // call JFrame constructor
// get content pane and set its layout
Container container = getContentPane();
container.setLayout( new FlowLayout() );
...
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
15
1. Einführung
1.2 Ein erstes Swing Programm
„
Swing Komponente JLabel (fortgesetzt)
...
// JLabel constructor with a string argument
label1 = new JLabel( "Label with text" );
setToolTipText()
label1.setToolTipText( "This is label1" );
geerbt von
container.add( label1 );
JComponent
// JLabel constructor with string, Icon and
// alignment arguments
Icon bug = new ImageIcon( "bug1.gif" );
// oder .png oder .jpg
label2 = new JLabel( "Label with text and icon",
bug, SwingConstants.LEFT );
label2.setToolTipText( "This is label2" );
container.add( label2 );
...
Füge zum
Behälter hinzu
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
16
8
1. Einführung
1.2 Ein erstes Swing Programm
„
Swing Komponente JLabel (fortgesetzt)
...
// JLabel constructor no arguments
label3 = new JLabel();
// change JLabel's properties
label3.setText("Label with icon and text at bottom");
label3.setIcon( bug );
label3.setHorizontalTextPosition(SwingConstants.CENTER);
label3.setVerticalTextPosition(SwingConstants.BOTTOM);
label3.setToolTipText("This is label3");
container.add( label3 );
setSize( 275, 170 );
setVisible( true );
}
...
© Prof. Dr. Björn Dreher
Setze
Eigenschaften des
JFrames
17
Softwaretechnik (Medieninformatik)
1. Einführung
1.2 Ein erstes Swing Programm
„
Swing Komponente JLabel (fortgesetzt)
...
// execute application
public static void main( String args[] )
{
LabelTest application = new LabelTest();
application.setDefaultCloseOperation(
JFrame.EXIT_ON_CLOSE );
}
}
// end class LabelTest
Was passiert beim
Schließen des
JFrames?
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
18
9
Softwaretechnik (Medieninformatik): GUIs mit Swing
Überblick: 1. Einführung
1.1
Was ist Swing?
1.2
1.3
Ein erstes Swing-Programm
Ereignis Behandlung
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
19
1. Einführung
1.3 Ereignis Behandlung
„
GUIs sind Ereignis getrieben (event driven)
‰
‰
‰
‰
Wenn Benutzer mit dem GUI wechselwirkt, werden Ereignisse erzeugt
„
Texteingabe, Mausklick, ...
Das Ereignis wird dem Programm zugestellt
Vererbungshierarchie von Events im Package java.awt.event
Swing-spezifische Events in javax.swing.event
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
20
10
1. Einführung
1.3 Ereignis Behandlung
„
Vererbungshierarchie von AWT-Events
java.lang.Object
java.util.EventObject
Alle diese Events definiert im
Package java.awt.event
java.awt.AWTEvent
ActionEvent
ComponentEvent
ContainerEvent
InputEvent
KeyEvent
© Prof. Dr. Björn Dreher
ItemEvent
FocusEvent
AdjustmentEvent
PaintEvent
WindowEvent
MouseEvent
Softwaretechnik (Medieninformatik)
21
1. Einführung
1.3 Ereignis Behandlung
„
Drei Beteiligte:
‰
‰
Event Quelle
„
GUI Komponente, mit der der Benutzer wechselwirkt
„
Hat Liste der registrierten Event Listener, um diese von Ereignis zu
informieren
„
Event Listener können sich bei ihr registrieren
Event Objekt
„
Kapselt Informationen über das Ereignis
‰
‰
u.a. Referenz auf die Event Quelle
Event Listener
„
Erhält das Event Objekt von Event Quelle zugestellt
„
Reagiert auf das Ereignis
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
22
11
1. Einführung
1.3 Ereignis Behandlung
„
Aufgaben des Programmierers:
‰
‰
‰
Für die GUI Komponente muss ein event listener registriert werden
Eine event handling method muss implementiert werden
„
Auch event handler genannt
Ein event listener ist ein Objekt einer Klasse, die eine oder mehrere
Methoden enthält, die event-listener Interfaces aus den Packages
„
java.awt.event oder
„
javax.swing.event
implementieren
„
Viele der Interfaces sind für Swing- und AWT-Komponenten
anwendbar
© Prof. Dr. Björn Dreher
23
Softwaretechnik (Medieninformatik)
1. Einführung
1.3 Ereignis Behandlung
„
Vererbungshierarchie von AWT-Listener Interfaces
Alle diese Interfaces definiert im
Package java.awt.event
java.util.EventListener
ActionListener
ContainerListener
ComponentListener
KeyListener
ItemListener
FocusListener
MouseListener
© Prof. Dr. Björn Dreher
AdjustmentListener
TextListener
WindowListener
MouseMotionListener
Softwaretechnik (Medieninformatik)
24
12
1. Einführung
1.3 Ereignis Behandlung
„
Event Listener Objekt
‰
‰
‰
‰
‰
Hört auf bestimmte Typen von Events, die von Event Quelle erzeugt
wurden
Event Handler ist eine Methode, die auf das Ereignis hin aufgerufen
wird
Event Listener Interface spezifiziert eine oder mehrere Event-Handling
Methoden
„
Müssen in der Event Listener Klasse implementiert werden
Delegation Event Model
„
Verarbeitung des Ereignisses an ein bestimmtes Objekt (den
Listener) delegiert
Enter Taste in JTextField gedrückt
„
Methode actionPerformed des registrierten Listeners wird
aufgerufen
© Prof. Dr. Björn Dreher
25
Softwaretechnik (Medieninformatik)
1. Einführung
1.3 Ereignis Behandlung
„
Klassendiagramm
JTextField
# listenerList: EventListenerList
+ addActionListener(l: ActionListener)
+ removeActionListener(l: ActionListener)
# fireActionPerformed()
+ getState()
listeners
ActionListener
0..*
actionPerformed(e: ActionEvent)
for all l in listenerList {
l.actionPerformed(
e: ActionEvent)
}
TextFieldHandler
handlerState
handlerState =
e.getSource().getState()
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
actionPerformed(e: ActionEvent)
26
13
1. Einführung
1.3 Ereignis Behandlung
„
Quellcode
// Java core packages
import java.awt.*;
import java.awt.event.*;
// Java extension packages
import javax.swing.*;
Referenzen zu 3 TextFeldern und einem
Password-Feld
public class TextFieldTest extends JFrame {
private JTextField textField1, textField2, textField3;
private JPasswordField passwordField;
// set up GUI in Constructor
public TextFieldTest() {
super( "Testing JTextField and JPasswordField" );
Container container = getContentPane();
container.setLayout( new FlowLayout() );
...
© Prof. Dr. Björn Dreher
Layout für
ConentPane
27
Softwaretechnik (Medieninformatik)
1. Einführung
1.3 Ereignis Behandlung
„
Quellcode (fortgesetzt)
...
// construct textfield with default sizing
textField1 = new JTextField( 10 );
container.add( textField1 );
10 Zeichen breit
// construct textfield with default text
textField2 = new JTextField( "Enter text here" );
container.add( textField2 );
// construct textfield with default text and
// 20 visible elements and no event handler for editing
textField3 = new JTextField( "Uneditable text field",
20 );
textField3.setEditable( false );
Inhalt nicht
container.add( textField3 );
editierbar
// construct passwordfield with default text
passwordField = new JPasswordField( "Hidden text" );
container.add( passwordField );
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
28
14
1. Einführung
1.3 Ereignis Behandlung
„
Quellcode (fortgesetzt)
Ein ActionListener
...
// register event handlers
TextFieldHandler handler = new TextFieldHandler();
textField1.addActionListener( handler );
textField2.addActionListener( handler );
textField3.addActionListener( handler );
passwordField.addActionListener( handler );
setSize( 325, 100 );
setVisible( true );
}
...
Registriere
ActionListener
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
29
1. Einführung
1.3 Ereignis Behandlung
„
Quellcode (fortgesetzt)
...
// execute application
public static void main( String args[] )
{
TextFieldTest application = new TextFieldTest();
application.setDefaultCloseOperation(
JFrame.EXIT_ON_CLOSE );
}
...
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
30
15
1. Einführung
1.3 Ereignis Behandlung
„
Quellcode (fortgesetzt)
Ein ActionListener
...
// private inner class for event handling
private class TextFieldHandler implements ActionListener {
// process text field events
public void actionPerformed( ActionEvent event ) {
String string = "";
Event Handler
// user pressed Enter in JTextField textField1
if ( event.getSource() == textField1 )
string = "textField1: " + event.getActionCommand();
// user pressed Enter in JTextField textField2
else if ( event.getSource() == textField2 )
string = "textField2: " + event.getActionCommand();
...
Liefert Text in dem Feld
© Prof. Dr. Björn Dreher
31
Softwaretechnik (Medieninformatik)
1. Einführung
1.3 Ereignis Behandlung
„
Quellcode (fortgesetzt)
...
// user pressed Enter in JTextField textField3
else if ( event.getSource() == textField3 )
string = "textField3: " + event.getActionCommand();
// user pressed Enter in JTextField passwordField
else if ( event.getSource() == passwordField ) {
JPasswordField pwd =
( JPasswordField ) event.getSource();
string = "passwordField: " +
new String( pwd.getPassword() );
}
Liefert Passwort
JOptionPane.showMessageDialog( null, string );
}
}
}
Pop-Up Fenster
// end private inner class TextFieldHandler
// end class TextFieldTest
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
32
16
1. Einführung
1.3 Ereignis Behandlung
„
Das Frame
© Prof. Dr. Björn Dreher
Softwaretechnik (Medieninformatik)
33
17