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

Transkript

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

2 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

3 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

4 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

5 LayoutManager Vielfalt Für viele mögliche Layoutstrategien gibt es bereits vorgefertigte LayoutManager: FlowLayout BorderLayout CardLayout GridLayout GridBagLayout SplittPaneLayout SpringLayout... Eigene LayoutManager entwickeln: Prof. Dr. Nikolaus Wulff Angewandte Informatik 5

6 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

7 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

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

9 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

10 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

11 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

12 GridLayout Diese Layout erzeugt ein NxM Gitter mit gleichgroßen Zellen. Komponenten werden in der Reihenfolge des Einfügens auf die Zellen verteilt 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

13 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

14 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

15 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

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

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

18 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

19 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

20 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

21 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

22 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

23 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

24 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

25 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

26 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

27 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

28 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, public void addlayoutcomponent(component comp, Object constraints) { // super.addlayoutcomponent(comp, constraints); components.put(constraints.tostring(), comp); } Prof. Dr. Nikolaus Wulff Angewandte Informatik 28

29 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

30 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

31 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

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

33 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

34 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