LayoutManager. Einsatz von LayoutManagern in AWT/Swing Containern. Prof. Dr. Nikolaus Wulff

Ähnliche Dokumente
GroupLayout Anmerkung

11. GUI-Programmierung mit SWING Überblick

Layout Manager. Astrid Beck FHT Esslingen

Java GUI Entwicklung mit Swing

Zentrale Objekte zur Programmierung graphischer Benutzeroberflächen (GUI)

Ereignisse (Events) in Java

Programmieren II. Java im Vergleich zu anderen Sprachen. Einführung: GUI. Einführung: Grafische Benutzeroberflächen. Dr.

JList JTable Layout-Manager GridBagLayout. Programmieren II. Martin Schultheiß. Hochschule Darmstadt Sommersemester 2011

Einführung in die Programmierung für NF. Übung

Programmieren II. Die Klasse JList. Vorlesung 5. Handout S. 1. Martin Schultheiß. Hochschule Darmstadt Sommersemester JList.

Institut für Programmierung und Reaktive Systeme. GUIs mit Swing. Markus Reschke

Javakurs für Fortgeschrittene

Layout und Paint. Die Layout und Paint Strategie in AWT/Swing Containern. Prof. Dr. Nikolaus Wulff

GUI-Programmierung mit Java. Informatik B - Objektorientierte Programmierung in Java. Vorlesung 11: GUI 1: AWT (1) GUI-Programmierung mit Java.

Einführung in GUI-Programmierung. javax.swing

GUI Programmierung mit javax.swing

Einführung in die Informatik: Programmierung und Software-Entwicklung, WS 15/16. Kapitel 7. Grafische Benutzeroberflächen 1

Einführung: Grafische Benutzeroberflächen. Programmieren II. Dr. Klaus Höppner. Hochschule Darmstadt Sommersemester / 22

Ist eine Softwarekomponente, die dem Benutzer eines Computers die Interaktion mit der Maschine über grafische Symbole erlaubt

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

Einige vorgefertigte Layout-Manager:

Prof. Dr. Oliver Haase Karl Martin Kern Achim Bitzer. Programmiertechnik GUI-Programmierung mit Swing

7. Architektur interaktiver Systeme

Objektorientierte Software-Entwicklung

Java I Vorlesung 11 Graphische Oberflächen mit Swing

...erinnern Sie sich? oopjs4b / kwhbkd4r

Fachhochschule Fulda Fachbereich Angewandte Informatik. Hausarbeit Seminar: Java3D. Java Layout-Manager WS 2002/2003

EAD II Übung 5. Graphische Benutzungsoberfläche mit BlueJ

Grafische Benutzeroberflächen

Programmiermethodik. Übung 7

Programmiertechnik GUI Programmierung mit Java Swing

Einführung in die Informatik: Programmierung und Software-Entwicklung, WS 11/12. Kapitel 7. Grafische Benutzeroberflächen

JLabel. dient zur Textanzeige. können auch Bilder anzeigen: mylabel.seticon( new ImageIcon( C:/Pfad/zum/Bild.jpg )

Abstract Windowing Toolkit

Graphische Oberflächen Teil 1

11. GUI-Programmierung mit SWING Überblick

Grafische Benutzeroberflächen mit Swing

Graphische Oberflächen Teil 1

Ziele. Kapitel 8: Grafische Benutzerschnittstellen. AWT und Swing. Ziele (2)

Vorlosung: Swing: Erstellen eines JFrames mit GridBagLayout

CS1005 Objektorientierte Programmierung Bachelor of Science (Informatik)

GUI Programmierung mit JAVA Swing

Javakurs für Fortgeschrittene

GUI Programmierung in Java

Ereignisverwaltung und Layout-Typen

Kapitel 8: Grafische Benutzerschnittstellen

Einführung in Swing. Graphical User Interface

Einstieg in die Informatik mit Java

Einführung in die Programmierung für NF. Grafische Benutzeroberflächen

jcontentpane.setlayout(new BorderLayout()); // unten JPanel unten = new JPanel(); unten.setlayout( new BoxLayout(unten, BoxLayout.

Einführung in GUI-Programmierung. javax.swing

Softwaretechnik (Medieninformatik): GUIs mit Swing Überblick

Punkte. Teil 1. Teil 2. Summe. 1. Zeigen Sie, dass der untenstehende Suchbaum die AVL-Bedingung verletzt und überführen Sie ihn in einen AVL-Baum.

Grafische Benutzeroberflächen

GUIs in Java und ihre Programmierung

Ho Ngoc Duc IFIS - Universität zu Lübeck

Objektorientierte Programmierung Studiengang Medieninformatik

Programmieren in Java

Prof. Dr. Wolfgang Schramm. Vorlesung. Techniken der Programmentwicklung. Exkurs: Anonyme Klassen

Grafische Benutzeroberflächen

Programmieren II. Menü-Klassen in Java. Menüs. Menüs. Action. Dr. Klaus Höppner. GridBagLayout. Hochschule Darmstadt SS 2008

5. Java Swing Grundlagen der Programmierung II (Java) Prof. Dr. Bernhard Humm Hochschule Darmstadt University of Applied Sciences Sommersemester 2006

Auszug aus der Klassenstruktur

Techniken der Projektentwicklung

Ziel dieses Kapitels: Einführung in die Grundzüge der Programmierung graphischer Benutzeroberflächen (engl.: "graphical user interface", GUI) in Java

Einstieg in die Informatik mit Java

JAVA Oberflächen mit Swing

Exkurs: ANONYME KLASSEN. Techniken der Programmentwicklung Prof. Dr. Wolfgang Schramm

Programmieren in Java -Eingangstest-

UNIVERSITÄT SIEGEN Fachbereich 12, Elektrotechnik und Informatik Fachgruppe Betriebssysteme / verteilte Systeme

Fakultät Angewandte Informatik Programmierung verteilter Systeme Übungen zur Vorlesung Informatik II, Blatt 8

Einstieg in die Informatik mit Java

Vorlesung Programmieren

9 Graphikfenster 9-1. Grafikfenster. Ereignisorientiertes Programmieren. Übungsaufgaben

Hochschule der Medien Prof. Uwe Schulz 13. Juli 2009 Klausur Informatik, EDV-Nr Seite 1 von 6. Teil 2: Aufgaben

Sommersemester Implementierung III: GUI und Verhalten (Teil 2)

Menüs Action GridBagLayout. Programmieren II. Dr. Klaus Höppner. Hochschule Darmstadt Sommersemester / 31

Hochschule der Medien Prof. Uwe Schulz 14. Juli 2010 Klausur Informatik, EDV-Nr Seite 1 von 5. Teil 2: Aufgaben

7.1 Übersicht Geschichte von swing

Entwicklung von E-Learning Komponenten zur Computergrafik

Funktionale und Objekt-Orientierte Programmierkonzepte

Medientechnik. Übung 2 Java Swing

Vererbung. Gerd Bohlender. Institut für Angewandte und Numerische Mathematik. Vorlesung: Einstieg in die Informatik mit Java 14.1.

Wiederholung. Klassenhierarchie:

Vererbung, Polymorphie

Schablonen für Klassen, Interfaces oder Methoden, die noch nicht festgelegte Datentypen verwenden

Technische Universität Braunschweig

Swing Lernen am Code Teil 1

Fachhochschule Stuttgart Prof. Uwe Schulz 5. Juli 2006 Hochschule der Medien Klausur Informatik, EDV-Nr (42021) Seite 1 von 4

Universität Karlsruhe (TH)

Objektorientierte Programmierung

$ java awt.main A # typische Dekodierung $ java -Dtrace=all awt.main A # alle Events $ java -Dtrace=none awt.main A # keine Dekodierung

Mensch-Maschine-Interaktion

/** Main-Methode erzeugt einen neuen Editor zum Testen */ public static void main(string[] args) { new Editor();

Transkript:

LayoutManager Einsatz von LayoutManagern in AWT/Swing Containern Prof. Dr. Nikolaus Wulff

Wozu LayoutManager Graphische Oberflächen müssen variabel auf Größenänderung eines Fenster reagieren. Hierzu wird intern vom Hauptfenster, i.a. ein (J)Frame oder (J)Dialog, eine repaint Nachricht an alle aggregierten Widgets gesendet. Diese müssen jetzt wissen, wie sie sich auf Grund dieser Größenänderung neu zu zeichen haben. Problem: Die Widgets wissen nichts um die anderen sie umgebenden Objekte, wie groß dürfen sie sich jetzt zeichnen? parent.getsize() reicht nicht...? Prof. Dr. Nikolaus Wulff Angewandte Informatik 2

Strategie Algorithmus Lösung I: Der Container kennt seine Größe und alle aggregierten Widgets. Er weist jedem Widget eine Größe und Position zu. Problem: Es gibt viele Möglichkeiten die Widgets anzuordnen. Dies bedeutet in jedem abgeleiteten Frame, Dialog oder Panel die repaint Methode geeignet zu überladen. Lösung II: Lagere den Algorithmus nach dem Stragegie-Muster in einer externen Klasse aus, mit der der Container parametrisiert wird. => LayoutManager Prof. Dr. Nikolaus Wulff Angewandte Informatik 3

LayoutManager Klassendiagramm Component 0..* Strategie Button Table Container 1 1 <<Interface>> LayoutManager Panel Window BorderLayout FlowLayout Frame Dialog GridLayout Bei Größenänderung fordert der Container seinen LayoutManger per layoutcontainer(this) zum Ausrichten der aggregierten Komponenten auf. Prof. Dr. Nikolaus Wulff Angewandte Informatik 4

LayoutManager Vielfalt Für viele mögliche Layoutstrategien gibt es bereits vorgefertigte LayoutManager: FlowLayout BorderLayout CardLayout GridLayout GridBagLayout SplittPaneLayout SpringLayout... Eigene LayoutManager entwickeln: http://java.sun.com/docs/books/tutorial/uiswing/layout/custom.html Prof. Dr. Nikolaus Wulff Angewandte Informatik 5

LayoutManager auswählen Beim Design gilt es zuerst einmal eine grobe Skizze zur Anordung der Widgets zu erstellen. Folgende Fragen müssen beantwortet werden: Wie ist die Positionierung der einzelnen Widgets? absolut oder relativ Wie ist die Ausrichtung der Widgets? links, rechts oder zentriert Gibt es visuelle Abhängigkeiten untereinander? Welche Widgets haben feste Größe? Welche Widgets haben veränderliche Größe? horizontal, vertikal oder variabel in beiden Dimensionen Prof. Dr. Nikolaus Wulff Angewandte Informatik 6

Größe einer Komponente Jede Swing/AWT Komponente hat eine Dimension, gegeben durch ihre Höhe und Breite. Pro Komponente gibt es vier Ausprägungen: Die aktuelle Größe: getsize() Die minimalen Größe: getminimalsize() Die maximale Größe: getmaximalsize() Die Lieblingsgröße : getpreferredsize() LayoutManager fragen alle Componenten vor jeder Neuberechung nach diesen Dimensionen und werden diese je nach Strategie berücksichtigen oder auch nicht... Prof. Dr. Nikolaus Wulff Angewandte Informatik 7

Flow- und BoxLayoutManager FlowLayout ordnet die Elemente horizontal fließend nebeneinander an, bis die Zeile voll ist. 1 2 3 BoxLayout ordnet die Elemente horizontal oder vertikal fließend neben- oder untereinander an. 1 2 3 1 2 3 LayoutManager layout = new BoxLayout(comp,BoxLayout.Y_AXIS); Prof. Dr. Nikolaus Wulff Angewandte Informatik 8

BorderLayout Das BorderLayout unterteilt den Container in maximal 5 Bereiche: Nord, Süd, Ost, West und Mitte. NORTH WEST CENTER EAST SOUTH JPanel panel = new JPanel(new BorderLayout()); panel.add(comp, BorderLayout.CENTER); Prof. Dr. Nikolaus Wulff Angewandte Informatik 9

BorderLayout Strategie 1)Nur Komponenten die tatsächlich gesetzt sind werden berücksichtigt. 2)Nord- und Südkomponente werden horizontal gestreckt, ihre preferredheight wird berücksichtigt. 3)West- und Ostkomponente werden vertikal gestreckt, ihre preferredwidth wird berücksichtigt. 4)Die mittlere Komponente wird so groß wie irgend möglich in beiden Dimensionen gestreckt, ohne die Punkte 1) 3) zu verletzen. Prof. Dr. Nikolaus Wulff Angewandte Informatik 10

CardLayout Ein CardLayout verhält sich wie ein Stapel von Spielkarten, eine ist oben und sichtbar, die anderen liegen darunter und sind verdeckt. Jede Karte bildet genau eine Komponente ab. Über die einzelnen Schichten kann mit first(), last(), next() und previous() iteriert werden. Einfacher ist allerdings das Arbeiten mit einer JTabbedPane. Diese erlaubt einzelne Tabulatoren zu selektieren. Intern verwendet sie ein TabbedPaneLayout... Prof. Dr. Nikolaus Wulff Angewandte Informatik 11

GridLayout Diese Layout erzeugt ein NxM Gitter mit gleichgroßen Zellen. Komponenten werden in der Reihenfolge des Einfügens auf die Zellen verteilt... 1 2 3 4 5 6 7 8 JPanel panel = new JPanel( new GridLayout(2,4)); panel.add(new Button("1")); panel.add(new Button("8")); Prof. Dr. Nikolaus Wulff Angewandte Informatik 12

GridBagLayout Am kompliziertesten ist das GridBagLayout. Es definiert ähnlich wie das GridLayout ein Gitter. Die Gitterbreite und -höhe ist jetzt jedoch nicht konstant und kann variabel justiert werden. Componenten können sich über mehrere Gitterplätze erstrecken. Nicht alle Gitterplätze müssen besetzt sein. Hierzu müssen mit Hilfe sogenannter Constraints spezielle Argumente beim Hinzufügen der Komponente zum Container gesetzt werden Prof. Dr. Nikolaus Wulff Angewandte Informatik 13

GridBagLayout Constraints Das GridBagLayout gestattet per Vergabe von Constraints für jede einzelne Komponente sehr feine Justierungen. GridBagConstraints erlauben die Angabe von: relativer oder absoluter Positionierung horz., vertikale oder Ausfüllung in beide Dimension(en) Angabe von Gitterplatz und Gitterbreite und -höhe Justierung: left, center,right. Verankerung am Gitterplatz: NW N N E W E SW S Prof. Dr. Nikolaus Wulff Angewandte Informatik 14 S E

Felder von GridBagConstraint Integer gridx und gridy: Gitterplatz (x,y) Integer gridwidth und gridheigth: Breite und Höhe der Komponente in Gitterplatzkoordinaten. Float weightx und weighty: relative Breite und Höhe der Spalte bzw. Reihe im Gitter. Aufzählung fill: Komponente in x und/oder y Richtung skalieren. HORIZONTAL, VERTIKAL, BOTH. Aufzählung anchor: Verankerung der Komponente am Gitterplatz. NORHTEAST, WEST, etc. Prof. Dr. Nikolaus Wulff Angewandte Informatik 15

Variables Gitter 1 2 3 4 5 Ein solches, variables Gitter kann nicht mit dem GridLayout erzeugt werden. Hierzu eignet sich das GridBagLayout. Prof. Dr. Nikolaus Wulff Angewandte Informatik 16

Auszählen des Gitters 1 2 3 4 5 0 1 2 3 0 1 Button 3 hat eine gridwidth von 2. Button 5 hat Position (gridx,gridy)=(1,3). Prof. Dr. Nikolaus Wulff Angewandte Informatik 17

GridBagConstraints anwenden GridBagConstraints constraints = new GridBagConstraints(); constraints.fill = GridBagConstraints.BOTH; constraints.gridx = 0; constraints.gridy = 0; constraints.gridwidth = 1; panel.add(new Button("1"), constraints); constraints.gridx++; panel.add(new Button("2"), constraints); constraints.gridx = 0; constraints.gridy = 1; constraints.gridwidth = 2; panel.add(new Button("3"), constraints); // Button 4 missing... constraints.gridx = 1; constraints.gridy = 3; constraints.gridwidth = 1; panel.add(new Button("5"), constraints); Prof. Dr. Nikolaus Wulff Angewandte Informatik 18

Variable Gitterbreite oder -höhe Soll das Gitter nicht einheitlich dimensioniert werden, so kann hierzu in x- oder y Dimension jeder Komponente ein Gewicht zugewiesen werden. Solange alle Gewichte gleich groß gewählt (oder 0 sind) macht sich dies nicht bemerkbar... Wird hingegen weightx und weighty explizit unterschiedlich gewählt, so kann jeder Gitterplatz eine eigene variable Größe erhalten. Die Gewichte müssen größer Null sein und gehen relativ in die Gewichtung ein. Prof. Dr. Nikolaus Wulff Angewandte Informatik 19

Gewichtetes Gitter 2 und 1 als Gewichte in x Richtung 3, 2, 0 und 1 als Gewichte in y Richtung. 3/6 2/6 minsize 1/6 2/3 1/3 Prof. Dr. Nikolaus Wulff Angewandte Informatik 20

Gewichte vergeben constraints.gridx = 0; constraints.gridy = 0; constraints.gridwidth = 1; constraints.gridheight = 1; constraints.weightx = 2; constraints.weighty = 3; panel.add(new JButton("1"), constraints); constraints.gridx++; constraints.weightx = 1; panel.add(new JButton("2"), constraints); constraints.gridx = 0; constraints.gridy++; constraints.weighty = 2; panel.add(new JButton("3"), constraints); Prof. Dr. Nikolaus Wulff Angewandte Informatik 21

GridBagLayout properties int columns=4; GridBagLayout layout = new GridBagLayout(); JPanel panel = new JPanel(layout); layout.columnweights = new double[columns]; layout.columnwidths = new int[columns]; for(int i=0;i<columns;i++) { layout.columnweights[i] = 1.0; layout.columnwidths[i] = 100; } GridBagLayout ermittelt aus den einzelnen Gewichten und Weiten der Constraints vier Arrays, die jedoch auch explizit gesetzt werden können und dann diese Berechnung übersteuern. Es lohnt sich daher ein GridBagLayout zunächst auf einem Blatt Papier zu designen... Prof. Dr. Nikolaus Wulff Angewandte Informatik 22

Alternativen Das Arbeiten mit dem GridBagLayout ist relativ kompliziert und aufwendig. Gerade für Formulare bietet sich eine einfachere Alternative an: Das Verschachteln von Panels mit jeweils eigenen LayoutManagern. Die einzelnen Bereiche lassen sich recht modular programmieren, testen und zusammensetzen. Tip: Im Testmodus jedem Panel eine andere Hintergrundfarbe setzten. Dies erleichtert die visuelle Zuordnung. Prof. Dr. Nikolaus Wulff Angewandte Informatik 23

Layouts verschachteln Beispiel: Ausgangspunkt ist ein BorderLayout. Jede der fünf möglichen Komponenten ist selber ein Panel mit unterschiedlichem Layouts. Ein GridBagLayout mit zwei FlowLayouts im Norden und Süden und Box- und GridLayout in Ost und West... Prof. Dr. Nikolaus Wulff Angewandte Informatik 24

LayoutManager selber entwickeln Für spezielle Zwecke kann der LayoutManager selber entwickelt werden. Hierzu bietet es sich an einen existierenden LayoutManager zu überladen, um nicht alle Funktionalität selber implementieren zu müssen. Meistens wird nicht die Schnittstelle LayoutManager sondern die Erweiterung LayoutManager2 verwendet. Letzterer bietet optimierte Layoutfähigkeiten in Form von Constraints an. Wichtige zu implentierende Funktionen sind: addlayoutcomponent(component comp, Object constraints) layoutcontainer(container parent) Prof. Dr. Nikolaus Wulff Angewandte Informatik 25

ApplicationLayout Es soll ein spezieller LayoutManager für eine Anwendung mit Tool- und Statusbar, sowie einer Navigator- und Inhaltsansicht entwickelt werden. Toolbar Navigator Content Statusbar Bemerkung: Das geht auch mit dem BorderLayout! Prof. Dr. Nikolaus Wulff Angewandte Informatik 26

ApplicationLayout Design Es werden vier Konstanten definiert, zum Setzen der vier Komponenten in einer Map: NAVIGATOR, TOOLBAR, STATUSBAR,CONTENT Ferner werden drei Variablen benötigt: Die relative Toolbar Höhe Die relative Statusbar Höhe Die relative Navigator Breite Aus diesen drei Werten ergeben sich Die relative Höhe und Breite vom Inhaltsbereich In der layoutcontainer Methode wird für jede der vier Komponenten, ausgehend von der aktuellen Größe des Containers, die BoundingBox berechnet. Prof. Dr. Nikolaus Wulff Angewandte Informatik 27

ApplicationLayout Implementierung public class ApplicationLayout extends BorderLayout { public final static String TOOLBAR = "ToolBar"; public final static String STATUSBAR = "StatusBar"; public final static String NAVIGATOR = "Navigator"; public final static String CONTENT = "Center"; private final static float TOOBAR_HEIGHT = 0.10f; private final static float NAVIGATOR_WIDTH = 0.15f; private final static float STATUSBAR_HEIGHT = 0.10f; private float toolbarheight = TOOBAR_HEIGHT; private float statusbarheight = STATUSBAR_HEIGHT; private float navigatorwidth = NAVIGATOR_WIDTH; private HashMap<String, Component> components = new HashMap<String, Component>(); @Override public void addlayoutcomponent(component comp, Object constraints) { // super.addlayoutcomponent(comp, constraints); components.put(constraints.tostring(), comp); } Prof. Dr. Nikolaus Wulff Angewandte Informatik 28

layoutcomponent @Override public void layoutcontainer(container parent) { Component component; Insets insets = parent.getinsets(); int x,y,h,w; int width = parent.getwidth(); int height = parent.getheight(); width -= insets.left + insets.right; height -= insets.top + insets.bottom; component = components.get(toolbar); x = insets.left; y = insets.top; w = width; h = (int)(toolbarheight*height); component.setbounds(x,y,w,h); Prof. Dr. Nikolaus Wulff Angewandte Informatik 29

layoutcomponent cont. component = components.get(navigator); x = insets.left; y += h; w = (int)(navigatorwidth*width); h = (int)(getnavigatorheight()*height); component.setbounds(x,y,w,h); component = components.get(content); x += w; w = width-w; component.setbounds(x,y,w,h); component = components.get(statusbar); x = insets.left; y += h; w = width; h = (int)(statusbarheight*height); component.setbounds(x,y,w,h); } Achtung: Annahme ist alle vier Komponenten sind gesetzt! Prof. Dr. Nikolaus Wulff Angewandte Informatik 30

Anwendung des ApplicationLayouts public JPanel createapplicationpane() { JComponent comp; ApplicationLayout layout layout = new ApplicationLayout(); layout.setnavigatorwidth(0.18f); JPanel panel = new JPanel(); panel.setlayout(layout); comp = createstatuspanel(); comp.setbackground(color.blue); panel.add(comp,applicationlayout.statusbar); comp = createtoolbarpanel(); comp.setbackground(color.gray); panel.add(comp,applicationlayout.toolbar); Prof. Dr. Nikolaus Wulff Angewandte Informatik 31

ApplicationManager in Aktion 10% 80% 10% 18% 82% Prof. Dr. Nikolaus Wulff Angewandte Informatik 32

NullLayoutManager Als letzte Alternative bleibt der sogenannte NullLayoutManager: container.setlayout(null); Dadurch wird der Layout-Mechanismus eines Containers abgeschaltet. Es werden exakt die (x,y)-positionen und (withd,height)-dimensionen der Componenten verwendet, wie explizit angegeben. Dies erzeugt eine starre GUI ohne resize Fähigkeiten, jedoch exakt ausgerichtet. Dies setzt allerdings Kenntniss des Displaygröße des Benutzers zur Entwicklungszeit voraus... Prof. Dr. Nikolaus Wulff Angewandte Informatik 33

Zusammenfassung LayoutManager bieten eine effiziente Möglichkeit geeignete Strategien zum Justieren der Widgets auszuwählen. Sie lassen sich beliebig mit Hilfe von Panels verschachteln. Für Spezialfälle ist es relativ leicht eigene LayoutManager selbst zu entwickeln. Prof. Dr. Nikolaus Wulff Angewandte Informatik 34