Graphische Oberflächen Teil 1 AWT und Swing Grundlegender Aufbau von GUIs Graphikausgabe Layoutmanagement Ereignismodell Menus und Actions GUI Elemente Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 1
Inhalt AWT und Swing Unterschied Einbettung von Swing in AWT Grundlegender Aufbau von Swing GUIs Frames, Windows, Dialogs Panels Graphikausgabe Positionierung paintcomponent und AWT-Thread Graphics und Ausgabeoperationen Aufbau und Positionierung Component-Hierarchy LayoutManagement Spezielle Anordnungen: JTabbedPane, JSplitPane, JScrollPane, JInternalFrame, Ereignismodell Grundlegendes semantische und systemnahe Ereignisse Patterns für die Ereignisbehandlung Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 2
Inhalt (Fortsetzung) Menus und Actions GUI Elemente MVC-Paradigma - Abstrakte Modelle - Ereignisse Überblick über GUI Elemente - JLabel - JButton - JSpinner - JTextField - JFormattedTextField - Dialoge (Teil 2) Modale und Nicht-modale Dialoge Spezielle Dialoge: JFileDialog, JOptionsPane, Spezielle GUI-Elemente (Teil 2) JList JTable JTree Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 3
Graphische Oberflächen AWT und Swing Grundlegender Aufbau von GUIs Graphikausgabe Layoutmanagement Ereignismodell Menus und Actions GUI Elemente Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 4
AWT und Swing Abstract Window Toolkit Paket und Unterpakete Abstrahiert GUI-Komponenten von konkreter Plattform Plattformspezifische Implementierung in "Peer"-Klasse Kleinster gemeinsamer Nenner aller Plattformen Component ComponentPeer Windows ComponentPeer Motif ComponentPeer MacOS ComponentPeer Swing Paket und Unterpakete Lightweight-Komponenten Native Container, Rest vollständig in Java implementiert Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 5
Applets Abgeleitet von Browser lädt Klasse und ruft Methoden auf init start paint stop destroy repaint Ausführung in "Sandbox" Zugriff auf Dateien und Starten von Programmen nicht erlaubt Kommunikation nur mit Server, von dem Applet geladen wurde!! " $!!%!! %&'(% %)(* $!!!+,-!* $.* Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 6
Grundlegende Eigenschaften von Swing Leichtgewichtige Komponenten nur Top-Level-Fenstern, Dialoge und grafische Primitivoperationen auf Systemoperationen abgebildet alles weitere in Java Pluggable Look-and-Feel Look-and-Feel nicht abhängig vom Betriebssystem unterschiedliche Look-and-Feel verfügbar: Metal, Motif und Windows Umschaltung des Look-and-Feel (auch zur Laufzeit) Model-View-Controller-Prinzip neue Architektur der GUI-Komponenten nach dem Model-View-Controller- Prinzip Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 7
Pluggable Look and Feel Bestimmt Aussehen der Swing-Komponenten Auswahl im Programm /01"23 /014 5"2346.. /017"2346..! 51"23!..! 5, "23!..! 5 51 5"23! Austausch nach dem Start /01"2356 / 48/05 52 Spezifikation auf der Kommandozeile 9 55 51"23 17 Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 8
Applets, AWT und Swing im Vergleich 173 3 173!,8! "7 : "7;<& "!+,-!, ", 4, = 7 ( 17 17 >&'(<?( "7 : "7;<& @ "!+,-! 17A3 A3 17A3!! 4 "7 : "7;<& 4 A"!+,-! 54B =C08DB6D4"B= >&'(<?( @ Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 9
Graphische Oberflächen AWT und Swing Grundlegender Aufbau von GUIs Graphikausgabe Layoutmanagement Ereignismodell Menus und Actions GUI Elemente Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 10
Komponenten von AWT Component Button Canvas CheckBox Choice Container Label List Scrollbar TextComponent ScrollPane Panel Window TextField TextArea Frame Dialog Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 11
Grundlegende Architektur von AWT-GUIs!" """ $%&!' ""' Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 12
Die Basisklasse java.awt.component,! '4 *5 %' $64!' 7, &,8' E <7<<% " < 7 > < % 345 E24 335 = @ 4 ()*+!)!'' +!, -()*.$!$%/ 0$ 1!1$"$%/& $"+! ' 1 +2 3+ $!% Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 13
Container Frame Hauptfenster eigenständiger Anwendungen Rahmen und Titelleiste Dialog Fenster, das zu einem übergeordneten Frame gehört Parameter in Konstruktor bestimmt Modalität Panel Container für andere Komponenten Verschachtelbar zur Kombination von Layout-Managern ScrollPane für Bildlauf Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 14
Allgemeines zu Container )"!!'! ) &'7;.!'! ' <+!8$" $' 9 9 9 : Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 15
Oberklasse 4 F 4 &4 ' ()*".!&!' " )= '71 &(?<= )' 4 4 44 "7"71 8!$% $ $!!&5 => 7 " &' Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 16
Einbettung und Swing in AWT Swing-Komponenten sind in die Hierarchie der AWT-Komponenten eingebettet F A4 als Basisklasse aller leichtgewichtigen Komponenten ist von 4 abgeleitet Component Container F A3, A, A, als Top-Level-Windows erweitern 3,,, Damit werden grundlegende Mechanismen von AWT geerbt JComponent ScrollPane Panel Window Komponentenhierarchie Ereignismechanismus JPanel JWindow Frame Dialog JFrame JDialog Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 17
Top-Level-Windows in Swing A, rahmenloses Fenster hat eine ContentPane, um Komponenten aufzunehmen A3 Typisch für Applikationsfenster mit Rahmen, Systemmenü und Standardschaltfläche A für modale und nicht-modale Dialoge werden mit Parent-Frame erzeugt hat wie JWindow eine ContentPane, um Komponenten aufzunehmen Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 18
JFrame JFrame ist aus mehreren Panes aufgebaut FG : Wurzel, beinhaltet Border, Titel, LayeredPane F"7 : beinhaltet Menüleiset und ContentPane F4 : eigentliche Inhaltsbereich F: : vorgelagerte, durchsichtige Pane für Effekte, die die ganze Frame betreffen AG G 4 4 A"7 "7 4: Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 19
Aufbau einer JFrame-Applikation " H?(& A3 " H?(&!= 5%A3!.., " % >5I, ", 4.."7>E% >5I 4 4 "7 : "7H<; AE!E;! AE!E&! AE!EH! JK " H?(& " H?(& " ;((<;(( >H((<&(( @, 4, 4, =, @ 5, 5 7 7 ( Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 20
Graphische Oberflächen AWT und Swing Grundlegender Aufbau von Swing GUIs Graphikausgabe Layoutmanagement Ereignismodell Menus und Actions GUI Elemente Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 21
Grafik in Java Zeichenoperationen werden in überschriebenen paint-methoden implementiert bei AWT-Komponenten :% bei Swing-Komponenten 4:% Aufruf der Methoden erfolgt durch eigenen AWT-Thread Anwenderprogramm kann durch Aufruf von < 7< %< % % das Neuzeichnen der Komponente (eines Bereichs der Komponente) erzwingen Zwei wesentliche Konzepte zur Grafikdarstellung Koordinatensystem: immer relativ zur Komponente Grafikkontext: stellt virtuelle Zeichenfläche dar Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 22
AWT-Thread Anwenderprogramm und AWT-Loop laufen in unterschiedlichen Threads Anwenderprogramm führt Änderungen in den Daten durch, die Änderungen in der GUI bewirken sollen ruft repaint der betroffenen Komponenten auf AWT ruft bei nächster Gelegenheit 4 auf Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 23
Graphik :% Graphikkontext in der Methode Zeichnen von Linien, Figuren, Text und Bildern Ursprung links oben :% & Erweitert :% um zusätzliche Zeichenoperationen Verwendung bei Swing-Komponenten 4," 4 :% 44 5 GH(<;(<&'<H( 442 5 B;(<;(<L(<H( 44%!,!<;'<H( Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 24
Grafik in Java Koordinatensystem F (<( ' F, %9;"+ %9;' 7$%8(?<=+.50' 7"7 (?<=+!$ %'!&'.@8 %" A:' Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 25
Grafikkontext <(=,8 &/8&''( %' 7,8 46&!&($!'' ' @4!,8 6&@4"($ $!' @$' $$ ($ =,8 $4!"7 ' 7($ &4 4'1?" $7 "=7$!' (=,8!' Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 26
Beispiel Grafikausgabe 84; 4 :% 5 ($, %9;M; 4 4(< &''(., %< &''(., % " <(<, %9<+ %9; 7 8%8% Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 27
Die Klasse Graphics +,8 &? %&B/=1 4 4!&% /&(!' 46&@$"$@ 5 4@$ 41$$%/ '@ 4C,6 7+"$!' 14!''," ;<7;<&<7&&C,6= " ' Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 28
Zeichenoperationen der Klasse Graphics G < 7< < % 7<7<<%<<7 HG<7<<%< <7<<%< < " ;<7;<&<7& B<7<<% 7JK<7JK< 7" JK<7JK< G<7<<% GG<7<<%<, %< + % <<7 5 HG<7<<%< 5 5 B 5 7 5 GG 00 <<7<0B.. 0..N5 % Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 29
Weitere Methoden der Klasse Graphics! " "$% & ''()*%"% ''+,+%-!% '' %++ ) ''.!- '',!)- ''-%"%))! '' /!+-% ''-$&0)'1&)21 ''/%.! ''/"$34% 56)%% )-& Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 30
Font und Fontmetrics Die Klasse Font Repräsentiert eine Schriftart: Konstruktion mit: 353!1!<3EB"<;L 3 Standard Namen: "MonoSpaced", "Serif", "SansSerif", Einige Methoden: 3 < 7< > >..% 5OP E..5 0..2 5 "06..Q5I% 5 5 EB" 5 08"04 Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 31
Font und Fontmetrics Die Klasse Fontmetrics 1<$%!@1 1$!.$%' %($ 5 31 531 531 3 6- %, %%%, %..BN../N + %..+O% "..R Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 32
Graphische Oberflächen AWT und Swing Grundlegender Aufbau von Swing GUIs Graphikausgabe Layoutmanagement Ereignismodell Menus und Actions GUI Elemente Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 33
Layoutmanager Anordnung von Komponenten Fenstergröße und Schrift können sich ändern Layout wird logisch beschrieben und nicht mit absoluten Koordinaten Constraints beeinflussen Positionierung FlowLayout Yes No Cancel GridLayout 1 2 3 4 5 6 BorderLayout North West Center East South GridBagLayout Button1 Button2 Button3 Button4 Button5 Button6 Button7 Button9 Button8 Button10 Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 34
Grundprinzip F "71 setzen Größe der Komponenten bestimmen Komponenten anfügen F "71 bestimmt damit automatisch Positionierung und tatsächliche Größe 4 "7CCC"7 ; 5 > ;((<H( ;1 >?(<&( ;1 > ;?(<L( 4 ; 4 & 4 %4.."7 4 4 Swing-Komponenten haben 3 Größeneigenschaften, die von Layoutmanagern verwendet werden F 5 >: bevorzugte Größe für Komponente F >: minimale Größe für Komponente F >: maximale Größe für Komponente Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 35
Layout Management Klassen 3"7 Ordnet die Komponenten wie Wörter auf einer Seite an. (Zentriert, rechts- oder linksbündig) E"7 Unterstützt genau 5 Komponenten. Eine an jeder Seite und eine im Zentrum : "7 Teilt den Container in Zeilen und Spalten. Alle Zellen sind gleich groß. : E"7 Sehr flexibel und kompliziert. Für jede Komponente können Einschränkungen definiert werden. 4"7 Zeigt jeweils nur eine Komponente, die den Container ausfüllt. Die anderen liegen quasi unsichtbar dahinter und man blättert bei Bedarf weiter (zb. Tabs) Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 36
FlowLayout 5 3"7 5 3"74=68=G<&(<&(..R % >.. 2&( "75 ; & C Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 37
BorderLayout "7E"7 ;<E"76BG8+ &<E"74=68=G C<E"7,=8 Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 38
GridLayout : "7< "7 ; & C..R..55I 2>..%% Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 39
Weitere GridbagLayout CardLayout Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 40
null-layout * $% +' ()*4$ ".&= '74$ &' Beispiel "7.. > O <597>% ;E;(<;(<;((<;((..<7<E <+O% &E;(<;'(<;((<;((..<7<E <+O% ; & Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 41
Zusammenfassung Applets Kleine Programme innerhalb von Webseiten Eingeschränkte Berechtigungen Anwendungen Hauptfenster und Dialogfenster Pluggable Look and Feel unter Swing Layout-Manager Kontrollieren Position und Größe der Komponenten Pratikum SWE 2 M. Löberbauer, T. Kotzmann, H. Prähofer 42