GUI-Programmierung. Teil I. Unterlagen zum Modul OOP mit Java V by MOU2/BFH-TI. Berner Fachhochschule Technik und Informatik

Transkript

1 GUI-Programmierung mit Java Teil I Unterlagen zum Modul OOP mit Java V by WBR1/BFH-TI 2011 by MOU2/BFH-TI GUI-Programmierung V by WBR1&MOU2/BFH-TI

2 Lernziele Die Kursteilnehmer sind in der Lage: Möglichkeiten einer GUI-Applikation in Java zu erklären (Window, Controls, Event-Handling) Handling). Eine einfache GUI-Applikation in Java zu programmieren. GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-2

3 Inhalt Übersicht, Begriffe Layout-Manager Ereignissteuerung (Teil 1) Exkurs: Innere Klassen, anonyme innere Klassen, Exemplar- und statische Initialisierung Ereignissteuerung (Teil 2) Elementare Controls GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-3

4 Eine kurze Übersicht GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-4

5 AWT AWT (Abstract Window Toolkit,,{j java.awt.* ): Set von grundlegenden GUI-Kompenenten Unterstützt u.a. Anordnen, Gruppieren und Drucken von Komponenten Heavyweight Komponenten: z.b. ein AWT-Button ist ein Win32-Button (auf einer Windows-Plattform) GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-5

6 JFC / Swing JFC (Java Foundation Classes): Umfasst eine grosse Anzahl von Klassen-Bibliotheken Ergänzt und ersetzt t Teile von AWT Ergänzt z.b. 2D-Zeichnungsbibliothek oder das Verändern des "Look and feel" Kernstück sind die Swing-Komponenten { javax.swing.* Swing-Komponenten sind besser und oft einfacher Swing-Komponenten ersetzen nur einen Teil von AWT!!! Swing-Komponenten sind Lightweight: d.h. Komponente ist Java-Code Wenn immer möglich Swing-Komponenten verwenden GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-6

7 Top Level Container Swing bietet drei Top Level Container Klassen an: JFrame,, JDialog, und JApplet. Damit eine GUI Komponente angezeigt wird, muss sie Teil einer containment hierarchy sein. Eine containment hierarchy ist eine Art Komponentenbaum, welcher ein Top Level Container als oberste Komponente hat. GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-7

8 Top Level Container Jede GUI Komponente kann nur einmal verwendet werden. Wenn eine Komponente bereits einem Container zugewiesen wurde und sie noch einem andern Container zugefügt wird, id wird idsie vom ersten Container entfernt und dem zweiten zugewiesen. Jeder Top Level Container hat eine sogenannte Content Pane. Diese enthält (direkt oder indirekt) die sichtbaren Komponenten des GUI. Einem Top Level Container kann optional Menüs (menu bar) hinzugefügt g werden. GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-8

9 Top Level Container mit default Content Pane JFrame frame = new JFrame("TopLevelDemo"); frame.getcontentpane().add(yellowlabel, add(yellowlabel BorderLayout.CENTER); ODER (da von der Klasse Component vererbt..) frame.add(yellowlabel, BorderLayout.CENTER); GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-9

10 Top Level Container mit eigener Content Pane JPanel contentpane = new JPanel( new BorderLayout() ); contentpane.add(somecomponent, BorderLayout.CENTER); contentpane.add(anothercomponent, BorderLayout.PAGE_END); toplevelcontainer.setcontentpane(contentpane); GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-10

11 Beispiel public class FrameDemo1 extends JFrame { public FrameDemo1 (String Title){ super(title); add(new JButton( Swing Button")); setsize(300, 100); setvisible(true); public static ti void main(string[] i args){ new FrameDemo1("Java Application with Swing"); GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-11

12 JFrame und Frame GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-12

13 Klassenhierarchie GUI-Bausteine GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-13

14 Klasse Component Alle grafischen Komponenten sind von der Klasse Component abgeleitet und erben dadurch: Methoden für Position und Grösse getsize(), getx(), setsize()... Methoden für grafische Eigenschaften getforeground(), setfont()... Methoden zum Zeichnen paint(); repaint()... GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-14

15 Beispiel Elementare Controls Choice als ComboBox CheckBox CheckBox als Radio- button Button TextField List ScrollBar GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-15

16 Layout Manager GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-16

17 Layout-Manager GUI-Systeme müssen sehr flexibel sein Unterschiedliche Betriebssysteme Unterschiedliche ed c e Bildschirmgrössen Die Platzierung der Komponenten übernimmt der Layout-Manager, fixe Anordnungen sind aber auch möglich Layouts können verschachtelt werden GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-17

18 BorderLayout Die Oberfläche wird in fünf Bereiche eingeteilt. Standard bei Frame, Applet und Dialog GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-18

19 import java.awt.*; awt import java.awt.event.*; Beispielcode BorderLayout class BorderDemo extends Frame { public BorderDemo (String Title) { super (Title); setsize (300, 200); add (new Button ("Norden"), BorderLayout.NORTH); add (new Button ("Süden"), BorderLayout.SOUTH); add (new Button ("Westen"), BorderLayout.WEST); add (new Button ("Osten"), BorderLayout.EAST); add (new Button ("Die Mitte"), BorderLayout.CENTER); setvisible(true); GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-19

20 FlowLayout Die Komponenten werden der Reihe nach von links nach rechts aufgelistet. Standard bei Panel Bsp: setlayout(new FlowLayout(FlowLayout.LEFT)); GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-20

21 GridLayout Die Komponenten werden matrixartig in einem n*m Raster angeordnet Bsp: setlayout (new GridLayout (2, 4)); GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-21

22 GridBagLayout Ähnlich GridLayout, die Anordnung der Komponenten lässt sich aber noch beeinflussen. GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-22

23 CardLayout Es ist jeweils nur eine Komponente des Containers sichtbar. GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-23

24 Verschachtelung von Layouts Jeder Container kann einen oder mehrere andere Container enthalten. Jedem Container kann ein eigener Layout-Manager zugeordnet werden. GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-24

25 Ereignissteuerung (Teil 1) GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-25

26 Ereignissteuerung Was passiert, wenn der Anwender Den Button anklickt? Das Fenster schliesst? Oder bei irgendwelchen Ereignissen? Taste gedrückt Neuer Bidschirmaufbau erfordelich Mausbewegung Programm Maustaste gedruckt Schalter gedruckt Textenigabe abgeschlossen Rollbalken betätigt GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-26

27 Das Observer-Pattern Quelle (z.b.button) BB registrieren Beobachter (Listener) Information bei Ereignissen GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-27

28 Events in Java Source Object (z.b.button) Register Handler Listener Object fire Events GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-28

29 Typen von Events GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-29

30 Observer / Listener Der Observer eines Events wird mit addxxlistener() hinzugefügt. z.b. bei einem Button: mybutton.addactionlistener(observer); Jede Klasse, welche auf ein Event reagieren soll, implementiert einen entsprechenden Observer Class Xyz implements WindowListener{ Jede Methode des Listener-Interfaces muss in der Klasse implementiert werden. void windowclosing(windowevent e){ void window GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-30

31 Code Beispiel - Ausgangslage class WindowListenerDemo extends JFrame { public WindowListenerDemo(String Title){ super(title); setsize(300, 100); add( new JButton("Swing Button") ); setvisible(true); public static void main(string[] args){ new WindowListenerDemo("JFrame with a WindowListener"); GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-31

32 Code Beispiel Listener erzeugen public class WinCloseListener implements WindowListener { public void windowactivated(windowevent e) { public void windowclosed(windowevent e) { public void windowclosing(windowevent e) { System.exit(0); public void windowdeactivated(windowevent e) { public void windowdeiconified(windowevent e) { public void windowiconified(windowevent e) { public void windowopened(windowevent e) { GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-32

33 Code Beispiel Listener registrieren class WindowListenerDemo extends JFrame { public WindowListenerDemo(String Title){ super(title); setsize(300, 100); JButton button = new JButton("Swing Button"); add(button); setvisible(true); addwindowlistener( new WinCloseListener() ); public static void main(string[] args){ new WindowListenerDemo("JFrame with a WindowListener"); GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-33

34 Code Beispiel Alles in einer Klasse class WindowListenerDemo extends JFrame implements WindowListener{ public WindowListenerDemo(String Title){ super(title); setsize(300, 100); add( new JButton("Swing Button") ); setvisible(true); addwindowlistener(this); public static void main(string[] args){ new WindowListenerDemo("JFrame with a WindowListener"); public void windowclosed(windowevent e) { public void windowclosing(windowevent e) { System.exit(0); public void windowdeactivated(windowevent e) { GUI-Programmierung V by WBR1&MOU2/BFH-TI Folie 4-34