Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing –...

42
Grafische Benutzeroberflächen mit Swing Jan Krüger [email protected]

Transcript of Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing –...

Page 1: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Grafische Benutzeroberflächen mit Swing

Jan Krü[email protected]

Page 2: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Organisatorisches

● Dienstags , 16.6.2008 (12 – 14 Uhr) in H13 – 1. Teil

● Überblick über Java/Swing● Designpattern : MVC

– 2. Teil● Ereignissteuerung in Java/Swing● Einführung in Threads

● Freitags, 19.6.2008 (16 – 18 Uhr)

GZI (V2- 222, V2-229 und V2-234)– Übung : ein Taschenrechner mit JFC/Swing– richtet sich an Java/JFC/Swing Einsteiger

V2-221

V2-240

V2-229

Page 3: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Übersicht

● Historisches– AWT vs. JFC/Swing– leicht- und schwergewichtige Elemente

● Applet vs. WebStart vs. Application● Sicherheitskonzepte in Java / Sandbox● DesignPattern : MVC

– Beispiel● Swing : Komponenten, Layouts, Ereignisse● Threads

Page 4: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Historisches (1)

● Java 1.0 (1996) AWT (AbstractWindowToolkit)

package java.awt.*● Java 1.1 (1997)

OO- Ereignissteuerung, JFC/Swing als Erweiterung

package javax.swing.*● seit Java 1.2 (1998)

JFC/Swing als Standard GUI

Page 5: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Historisches (2)

● nur wenige Komponenten● Thread-sicher● kein MV Prinzip● HeavyWeight

● unzählige Komponenten● erweiterbar● nicht Thread-sicher● MV Prinzip● skinable● LightWeight

AWT JFC/Swing

Page 6: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

LightWeight vs. HeavyWeight

● keine direkte Repräsentation im UI ● plattformunabhängig● aber : keine plattformspezifischen

Komponenten● Erscheinungsbild kann während der Laufzeit

und unabhängig vom System geändert werden (skinable)

● einfach erweiterbar

Page 7: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Applet, Webstart und Applikation

Applet WebStart Application

Sandbox

JVM

Browser javaws java

Page 8: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Designpattern ModelViewController

Model

View Controller

Page 9: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Modell (Model)

Model

View Controller

● Datenfelder● Logik (Funktionen)

Page 10: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Repräsentation (View )

Model

View Controller

● Darstellung des Modells● Benutzerinteraktion

Page 11: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Steuerung(Controller)

Model

View Controller

● Benutzeraktion auswerten● Aktion ausführen● Präsentation ändern

Page 12: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Ein Fenster zur Welt

import javax.swing.JFrame;

public class HelloSwingFrame {

public static void main(String[] args) { JFrame f = new JFrame("Das Fenster zur Welt!"); f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); f.setSize(300,200); f.setVisible(true); }

}

Page 13: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Klassenhierachie

Component Container JComponent JPanel

JTextComponent

AbstractButton

TextComponent

Button

CheckBox

Canvas Panel

Window JWindow

Frame JFrame

java.awt.*

javax.swing.*

Page 14: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Buttons

JButton

JToggleButton

JMenuItem

JCheckBox

JRadioButton

JMenu

AbstractButton

JCheckBoxMenuItem

JRadioButtonMenuItem

Page 15: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

JButton

import javax.swing.JButton;import javax.swing.JFrame;

public class Beispiel_JButton {

public static void main(String [] args){ JFrame f = new JFrame("Das Fenster zur Welt!"); f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); f.add(new JButton("Ich bin ein JButton!")); f.setSize(300,200); f.setVisible(true); }}

Page 16: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Plain Text AreasText Controls Styled Text Areas

JTextComponent

JTextComponent

JTextAreaJTextField

JFormattedTextField

JPasswordField

JEditorPane

JTextPane

Page 17: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

JTextField

import javax.swing.JFrame;import javax.swing.JTextField;

public class Beispiel_JTextField {

public static void main(String[] args) { JFrame f = new JFrame("Das Fenster zur Welt!"); f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); f.add(new JTextField("Ich bin ein JTexfield!",60)); f.setSize(300,200); f.setVisible(true); }

}

Page 18: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

JLabel

import javax.swing.JFrame;import javax.swing.JLabel;

public class Beispiel_JLabel {

public static void main(String[] args) { JFrame f = new JFrame("Das Fenster zur Welt!"); f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); f.add(new JLabel("Ich bin ein JLabel!",60)); f.setSize(300,200); f.setVisible(true); }

}

Page 19: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

JPanel

● Behälter für andere JComponenten(JPanel, JButton, JTextField, ...)

● JPanel zeichnet nur seinen Hintergrund● benutzt einen LayoutManager um

JComponenten im JPanel anzuordnen

typische Anwendung : Positionieren von JComponenten

Page 20: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Layout : FlowLayout

...

public class Beispiel_FlowLayout extends JPanel{

public Beispiel_FlowLayout(){ for(int i = 1; i <= 5; ++i){ add(new JButton("Button "+(Math.pow(10, i)))); } }

public static void main(String[] args) { JFrame f = new JFrame("FlowLayout"); f.add(new Beispiel_FlowLayout()); f.pack(); f.setVisible(true); }}

Page 21: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Layout : BorderLayout

...

public class Beispiel_BorderLayout extends JPanel{

public Beispiel_BorderLayout(){ setLayout(new BorderLayout()); add(new JButton("Norden"),BorderLayout.NORTH); add(new JButton("Westen"),BorderLayout.WEST); add(new JButton("Osten"),BorderLayout.EAST); add(new JButton("Süden"),BorderLayout.SOUTH); add(new JButton("Mitte"),BorderLayout.CENTER); }

...

Page 22: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Layout : GridLayout

...

public class Beispiel_GridLayout extends JPanel {

public Beispiel_GridLayout(){ setLayout(new GridLayout(3,3)); for (int i = 9; i >= 1; --i){ add(new JButton(new Integer(i).toString())); } }

...

Page 23: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Layout : BoxLayout

...

public class Beispiel_BoxLayout extends JPanel { public Beispiel_BoxLayout(){ this(BoxLayout.X_AXIS); }

public Beispiel_BoxLayout(int direction){ setLayout(new BoxLayout(this, direction)); for(int i = 1; i <=5; ++i){ add(new JButton(new Integer(i).toString())); } }

...

Page 24: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Ereignissteuerung

● eine Komponente kann ein Ereignis (Event) auslösen

● jedes Event wird durch eine Klasse repräsentiert (z.B. ActionEvent)

● ein Event kann durch ein oder mehrere Listener verarbeitet werden

● JComponents haben ähnliche Methoden zum Hinzufügen und Entfernen von Listenern für ein unterstütztes Event– addXXXListener(XXXEvent)– removeXXXListener();

Page 25: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Beispiel : Das Interface ActionListener

import java.awt.event.ActionEvent;import java.awt.event.ActionListener;import javax.swing.JButton;import javax.swing.JFrame;public class BeispielActionListener implements ActionListener {

public void actionPerformed(ActionEvent ae){//Ausgabe des zum ActionEvent gehörenden ActionEventSystem.out.println(“Geklickt: ”+ae.getActionCommand());

}

public static void main(String[] args){JFrame jf = new Jframe(“BeispielActionListener”);//Beschriftung des Jbutton ist gleichzeitig ActionCommandJButton jb = new JButton(“Klick mich”);BeispielActionListener bal = new BeispielActionListener();jb.addActionListener(bal);jf.setVisible(true);jf.pack();

}}

> Geklickt: Klick michbei Klick

Page 26: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Events und Listener Typen

● Es gibt viele weitere, spezialisierte Event- und dazu passende Listener-Typen

Mehr dazu unter:

http://java.sun.com/docs/books/tutorial/uiswing/events/index.html

Page 27: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Was sind Threads?

● Erlauben Nebenläufigkeit von unterschiedlichen Programmteilen

● Quasi-parallel, je nach Systemarchitektur auch echt parallel

● Ermöglichen bessere Ausnutzung von Prozessorzeit und anderen Resourcen, z.B. Bandbreite einer Internetverbindung

Page 28: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Threads in Java: Die Klasse java.lang.Thread

public class ThreadDemo extends Thread{ //Diese Methode stammt aus Runnable, ist aber in Thread //leer implementiert und muss daher überschrieben werden public void run(){ //Zählen in einer Schleife von 0 bis 9 for(int i=0;i<10;i++){ //Ausgabe jeder Zahl auf der Konsole System.out.println("Zahl "+i); } //fertig! System.out.println("Fertig!"); } public static void main(String[] args){ //Erzeugen einer neuen Instanz, inklusive Thread ThreadDemo td = new ThreadDemo(); //Thread starten td.start(); }}

Page 29: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Threads in Java: Das Interface java.lang.Runnable

public class RunnableDemo implements Runnable{ //Diese Methode stammt aus Runnable und muss //implementiert werden public void run(){ //Zählen in einer Schleife von 0 bis 9 for(int i=0;i<10;i++){ //Ausgabe jeder Zahl auf der Konsole System.out.println("Zahl "+i); } //fertig! System.out.println("Fertig!"); } public static void main(String[] args){ //Erzeugen einer neuen Instanz RunnableDemo rd = new RunnableDemo(); //Erzeugen eines Thread, um das Runnable auszuführen Thread t = new Thread(rd); //Thread starten t.start(); }

}

Page 30: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Beispiel: Downloadmanager

● Wir wollen ein Programm zum Download von Dateien schreiben

● Es sollen mehrere Dateien geladen werden können

● Eingabe: URLs, die die Dateien auf einem entfernten Rechner addressieren, Zugriff über das http Protokoll

● Öffnen einer Verbindung pro Datei, herunterladen der Datei auf den lokalen Rechner

Page 31: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Beispiel: Downloadmanager

public class DownloadManager{public DownloadManager(URL[] url) {//Vereinfachte For-Schleifefor(URL u:url){//sequentiell-> Ausführung hintereinanderdownload(u);

}}public File download(URL url) {//Öffne http VerbindungHttpURLConnection connection = (HttpURLConnection) url.openConnection();

//Verbinde mit Serverconnection.connect();//öffne urlInputStream istream = connection.getInputStream(); //lese von istream und schreibe in datei (ohne Details)return readFile(istream);

}...

}

Page 32: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Beispiel: Downloadmanager

● Problem 1: Wir wollen mehr als eine Datei gleichzeitig herunterladen können, um unseren Internetanschluß voll auszulasten

● Problem 2: Download einer Datei dauert eventuell sehr lang, andere sind vielleicht schneller heruntergeladen

● Lösung: Jede Datei wird von einem eigenen, unabhängigen Thread heruntergeladen!

Page 33: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Beispiel: Downloadmanager

Page 34: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Beispiel: Downloadmanager

public class Download implements Runnable {private URL url = null;

public Download(URL url) {this.url = url;

}

public void run() {HttpURLConnection connection = null;try {//Verbindung aufbauenconnection = (HttpURLConnection) url.openConnection();connection.connect();readFile(connection.getInputStream());//einlesen

} catch (IOException e) {e.printStackTrace();

} finally {if (connection != null) {//Verbindunng in jedem Fall schliessenconnection.disconnect();

}}...

}

Page 35: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Beispiel: Downloadmanager

public class DownloadManager2{

public DownloadManager2(URL[] url) {//Vereinfachte For-Schleife (ab Java 1.5)for(URL u:url){//sequentiell-> Ausführung hintereinanderThread t = new Thread(new Download(u));t.start();//Methode kehrt sofort zurück -> Ausführung der //anderen Downloads beginnt unmittelbar

}}

public static void main(String[] args) {URL[] url = new URL[args.length];//Vorsicht, evtl. ist args==nullfor(int i=0;i<args.length;i++) {url[i] = new URL(args[i]);

}//Download startenDownloadManager2 dm = new DownloadManager2(url);

}

}

Page 36: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Speziallfall Swing: Der Event Dispatch Thread

● Die meisten Swing Objektmethoden sind nicht synchronisiert => Veränderungen durch verschiedene Threads können zu Inkonsistenzen führen

● Daher: Synchronisierungen von Änderungen über den Event Dispatch Thread => Events werden dadurch in der Reihenfolge Ihres Eintreffens ausgeführt

● Code auf dem EDT sollte nicht lange brauchen, sonst => Blockieren der GUI!

Page 37: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

ActionListener revisited, wie man die GUI blockiert

...public class BeispielActionListener implements ActionListener {

... public void actionPerformed(ActionEvent ae){

//Ausgabe des zum ActionEvent gehörenden ActionEventSystem.out.println(“Geklickt: ”+ae.getActionCommand());//eintausend Wiederholungenfor(int i = 0; i< 1000;i++) {

if (SwingUtilities.isEventDispatchThread(){//Ausführung im EventDispatchThread?System.out.println("Running on EDT!");

}try {//Für 100 Millisekunden schlafen

Thread.sleep(100);} catch (InterruptedException e) {

e.printStackTrace();}

}...

} > Geklickt: Klick mich und 1000x > Running on EDT!

bei Klick

Page 38: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Spezialfall Swing: Der Event Dispatch Thread

//Erweiterung von Downloadpublic class Download implements Runnable {

//Jlabel stellt u.a. einzeilige Strings dar, nicht editierbar!Jlabel progressLabel = null;...public Download(URL url, Jlabel progressLabel) {this.url = url;this.progressLabel = progressLabel;

}

@Overridepublic void run() {HttpURLConnection connection = null;try {//Verbindung aufbauenupdateLabel(“Baue Verbindung auf zu “+url.toString());connection = (HttpURLConnection) url.openConnection();connection.connect();updateLabel(“Verbunden”);readFile(connection.getInputStream());//einlesenupdateLabel(“Datei geladen!”);...

}}

Page 39: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Spezialfall Swing: Der Event Dispatch Thread

//Erweiterung von Downloadpublic class Download implements Runnable {

...//message ist als final (unveränderlich) deklariertprivate void updateLabel(final String message) {

Runnable r = new Runnable(public void run() {//Nur Setzen der Nachricht auf dem Jlabel,//keine zeitintensiven Aktionen!progressLabel.setText(message);

});//Führt r demnächst auf dem EventDispatch ausSwingUtilities.invokeLater(r);

}...

}

Page 40: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Threads: Zusammenfassung

● Threads sind in Java einfach zu benutzen● Für unabhängige Aufgaben in einer GUI: s.h.

Beispiel MyWorker im Skript● Je unabhängiger ein Programmteil von

Interaktion mit anderen ist, desto einfacher ist dessen Auslagerung in einen Thread

● Mit Threads sind vorhandene Resourcen, z.B. verfügbare Prozessoren eines Rechners besser nutzbar

Page 41: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Threads: Zusammenfassung

● Offene Probleme: Threads, die sich eine Resource teilen, z.B. die Standardausgabe (Konsole), konkurrieren um den Zugriff darauf => Synchronisierung nötig, sonst nicht vorhersagbares Verhalten

● Nicht behandelt: Der Lebenszyklus eines Threads

● Dazu und zu vielem mehr

http://java.sun.com/docs/books/tutorial/essential/concurrency/

Page 42: Grafische Benutzeroberflächen mit Swing · Übersicht Historisches – AWT vs. JFC/Swing – leicht- und schwergewichtige Elemente Applet vs. WebStart vs. Application Sicherheitskonzepte

Lesenswertes ...

● Java ist auch eine Insel – Kapitel 15http://www.galileocomputing.de/openbook/javainsel7/

● Swing Tutorial http://java.sun.com/docs/books/tutorial/uiswing/