# Bestimmte GUI erstellen: Layoutproblem



## m!k3 (4. Okt 2004)

Hallöle...

ich werd noch wahnsinnig mit GUI...

also ich möchte meine Chat-GUI ganz neu aufziehen.

Stellt euch folgendes vor:

JFrame wird in 3 große Zeilen eingeteilt, sprich 3 Panels.. dacht mir ich nehm für das sog. contentPane ein BoxLayout und setze 3 Panel darauf. Norden, Mitte, Süden.

Im Norden kommt ein Label oder so rein.. muss ich mir noch was einfallen lassen.

In der Mitte soll das JTextPane dargestellt werden und daneben die Userliste, allerdings soll das vom Rand jeweils weg sein.. und zwischen JTextPane und JList soll auch platz bleiben. Wenn ich den Frame größer ziehen würde sollte das TextPane größer werden.. die JList soll nur in der Höhe größer werden.. nicht aber in der Breite... wobei TextPane in beide Richtungen sich ändern soll.. 

im Süden soll Platz sein für Smiley-Buttons und sonstige Sachen.. Send Button.. Autoscroll-ComboBox.. beim größerziehen des Frames soll aber die größe aller Komponenten gleich bleiben.. allerdings kann die Position der Komponenten wandern..

ich weiß einfach nicht wie ich das am Besten umsetzen soll.. mit welchem Layout.. mit GridBag oder Table Layout hab ich keine Erfahrung.. könnte ich vielleicht ein ganz kleines Beispiel vertragen.. oder wenn ihr nen guten Link wisst.. verweißt mich drauf.. 

dankeschön..

Minimumgröße des Frame's setz ich so, oder? Also damit man's nur begrenzt kleiner ziehen kann..

frame.setMinimumSize ( ... );


----------



## RellikPoc (4. Okt 2004)

Ich würd dir das FormLayout von JGoodies empfehlen.
Das ist recht einfach zu bedienen und trotzdem hast du alle Möglichkeiten, die du brauchst um ein exzellentes Design zu erstellen.
Guck mal unter: www.jgoodies.com
Den Download des Library-jars gibt's hier: http://www.jgoodies.com/download/libraries/forms-1_0_4.zip

Ist alles gut dokumentiert und Beispiele gibt's auch zur Genüge.

MfG, Poc

PS: Das Ding ist kostenlos und eigentlich auch ziemlich easy einzubinden (s. Anleitung).


----------



## thE_29 (4. Okt 2004)

und ich empfehl wie sonst auch immer das TableLayout

layout = ein tabellenlayout, nur kannst du dinge löschen oder erst gar net reinsetzen aber es verschiebt sich nicht!
außerdem klappt es wunderbar mit resizen!
benutze die suchfunktion hier oder google it, findest sicher genug


----------



## m!k3 (5. Okt 2004)

also FormLayout ist alles andere als einfach... das mega-komplex... so viele möglichkeiten zum einstellen... hab mir das PDF mal gezogen von der JGoodies Seite.. das ja unglaublich..

und irgendwie komm ich aufs selbe hinaus, wenn ich die Buttons fest setze.. 

wie krieg ichn das mit dem FormLayout flexibel hin?
ich peil da nicht durch mit der Layout-Erstellung.. Das Problem ist, das die Icons auf den Buttons nicht alle gleichgroß sind. Ich hätte 3 Zeilen und maximal 15 Spalten, doch die Buttons werden unterschiedlich groß.

In Reihe 1 sind 15 Buttons
In Reihe 2 dann nur noch 10 Buttons (weil hier die Icons umso breiter sind)

Müsste ich für jeden Button so ein Builder gestalten und diese dann auf ein Builder anordnen?

Aber ich möchte das ja dynamisch aufziehn können.. das wenn ich den Frame größer ziehe die Buttons mitgehen und nicht an ihrem Platze bleiben..

Ich mein da könnte ich ja dann auch ein GridBagLayout verwenden oder?!

TableLayout habe ich noch nicht angeschaut..

also ich hab momentan mein HauptPanel in 3 Zeilen unterteilt für ein BoxLayout.. "oben" "mitte" "unten".. 

In der Mitte hab ich jetzt ein SplitPane.. find das recht cool.. links TextPane.. rechts Userlist.. nur würd ich die maximale größe gerne irgendwie bestimmen.. also das man beispielsweise die Userlist nur zu ner begrenzten Breite ziehen kann.. und das es dann nicht mehr weitergeht.. 
hab in der API scho rumgeschaut.. irgendwie kann ich die Komponenten nicht setzen.. also ich kann sie mir holen.. aber da irgendwie ne Breite drauf zu setzen geht nicht


----------



## TheDragonMaster (5. Okt 2004)

Die Hauptklamotte würde ich mit nem einfachen BorderLayout realisieren:


```
// Mein LookAndFeel, gibts auf [url]www.simpleedit.org[/url]
import org.simpleedit.plaf.*;

import javax.swing.*;

public class ChatWindow extends JFrame {
	private JTextPane chatLog;
	private JList userList;
	
	public ChatWindow() {
		super("ChatWindow");
		super.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		// was auch immer noch gemacht werden muss
		
		UIManager.setLookAndFeel(new DragonLookAndFeel());
		
		// UI
		JPanel root = (JPanel)super.getContentPane();
		// Die contentPane hat immer ein BorderLayout per Standard, aber wir wollen ja abstand...
		root.setLayout(new BorderLayout(10, 0));
		// Nördliches Panel
		JLabel title = new JLabel("ChatWindow");
		// Das ist im Prinzip egal - nur ein Vorschlag,
		// weil du ja nicht weist, was du dahin packen möchtest.
		// Beschreibung: [url]http://www.simpleedit.org/wiki/cwiki.php?page=DragonLookAndFeel[/url]
		DragonLookAndFeel.toHeadLabel(title);
		root.add(title, BorderLayout.PAGE_START);
		
		// Jetzt die Mitte
		chatLog = new JTextPane();
		userList = new JList();
		root.add(chatLog, BorderLayout.CENTER);
		root.add(userList, BorderLayout.LINE_END);
		
		// Jetzt unten (das hab ich mal ausgelagert
		root.add(new EntryPanel(this), BorderLayout.PAGE_END);
	}
}
```

Der Teil mit den Buttons ist da schon schwieriger... kannst du das eventuell mal aufmalen?
Das hilft mir pers. immer weiter.



> nur würd ich die maximale größe gerne irgendwie bestimmen..




```
Dimension dim = userList.getMaximumSize();
dim.width = 250;
userList.setMaximumSize(dim);
```
Wobei ich nicht weiß, ob es notwendig ist, die Größe nochmal zu setzen...


----------



## RellikPoc (5. Okt 2004)

m!k3 hat gesagt.:
			
		

> also FormLayout ist alles andere als einfach... das mega-komplex... so viele möglichkeiten zum einstellen... hab mir das PDF mal gezogen von der JGoodies Seite.. das ja unglaublich..
> 
> und irgendwie komm ich aufs selbe hinaus, wenn ich die Buttons fest setze..
> 
> wie krieg ichn das mit dem FormLayout flexibel hin?


Im Vergleich zu anderen Layouts find ich's recht einfach zu bedienen und die Möglichkeiten (z.B. das Wachsen bestimmter Zellen und derer Inhalt) sind zahlreich.



> ich peil da nicht durch mit der Layout-Erstellung.. Das Problem ist, das die Icons auf den Buttons nicht alle gleichgroß sind. Ich hätte 3 Zeilen und maximal 15 Spalten, doch die Buttons werden unterschiedlich groß.
> 
> In Reihe 1 sind 15 Buttons
> In Reihe 2 dann nur noch 10 Buttons (weil hier die Icons umso breiter sind)
> ...


 Der wichtigste Schritt, so wie auch in dem pdf beschrieben, ist das Aufzeichnen des gewünschten Designs, dass man dann in Zeilen und Spalten unterteilen kann. Anhand dieser Skizzen lassen sich dann nämlich ziemlich leicht die CellConstraints definieren.
Die Builder braucht man nicht unbedingt. Geht auch prima ohne 



> Aber ich möchte das ja dynamisch aufziehn können.. das wenn ich den Frame größer ziehe die Buttons mitgehen und nicht an ihrem Platze bleiben..


Geht über die CellConstraints. Bei der Definition der CCs kannst du für jede Zeile/Spalte (und somit eigentlich für jede Zelle) beispielsweise ein Alignment angeben. Außerdem wäre noch möglich anzugeben, ob die Zelle eine gewünschte oder feste Größe hat, ob sie mit dem Fenster wachsen soll (ob in x-, y- oder beide Richtung(en)), ob der komplette Platz der Zelle von der Komponente darin komplett genutzt werden soll, ...



> Ich mein da könnte ich ja dann auch ein GridBagLayout verwenden oder?!
> 
> TableLayout habe ich noch nicht angeschaut..
> 
> ...


 Hast du schon probiert, dem Panel an der entsprechenden Stelle 'ne maximale Größe zuzuweisen? Ansonsten kann man auch setMaximumSize() für die SplitPane nutzen...


Wenn du mal 'ne Skizze des gewünschten Designs reinstellen würdest, könnt man auch mal gemeinsam nach dem besten Design bzw. beim FormLayout nach den nötigen CCs schauen...

MfG, Poc


----------



## not logged in m!k3 *g (5. Okt 2004)

hey Dragon.. danke für deinen Post.. also das root-Panel das passt auch mit dem BoxLayout.. 

auch mit dem resizen passts.. das in der Mitte passt sich an.. rest bleibt gleich.. 

die smileys werd ich jetzt fest setzen.. weil resizen is da eh scheisse.. wenn das dann größer oder kleiner wird..

nur ich habe das Problem mit dem Maximum vom SplitPane.. man kann nur Minimum setzen.. Maximum nimmt er nicht an.. 

ich möchte die Userlist ja nicht ewig groß ziehen können.. bringts ja nich.. nur evtl ganz wegmachen.. 

aber irgendwie ist das nicht umsetzbar


----------



## not logged in m!ke (5. Okt 2004)

hey Poc.. joa da man nicht uploaden kann, oder?! .. wird das wohl mit dem Design nix.. hab auch keine Page zum uploadn.. müsst ich mir ma eine für umsonst anlegen 

Wie solls aussehn.. alsoo:


```
--------------------------------------
|                                    |  NorthPanel
|                                    |
|------------------------------------|
|                           |        |
|     TextPane              | List   | splitPanel
|                           |        |
|------------------------------------|
| Smileys                   Buttons  | southPanel
| (bekommen alle festen Platz )      |
--------------------------------------
```

hab mich mal etwas künstlerisch ausgetobt.. also das Panel in der Mitte soll sich resizen können.. wobei die Liste nur an Höhe gewinnen kann, nicht an Breite.. nur der TextPane soll in die Breite gehen..


----------



## RellikPoc (5. Okt 2004)

Öhm...kannst mir die Skizze auch schicken und ich schmeiß die dann für 'ne Zeit auf meinen Webspace...allerdings sieht deine Codeskizze top aus. Mit den Infos von dir dazu, sollte man da einiges machen können.
Für das MainPanel (das mit den 3 Panels drin):

```
FormLayout layout=new FormLayout("fill:pref:grow","pref,fill:pref:grow,pref");
```
Ich geh mal davon aus, dass keinerlei Ränder oder Zwischenräume bestehen sollen. Wenn doch, muss das ganze natürlich ein kleines bißchen angepaßt werden.

Das NorthPanel kann ja mit beliebigem Layout weiter bearbeitet werden.

Das splitPanel:

```
FormLayout layout=new FormLayout ("fill:pref:grow, pref","fill:pref:grow");
```

Zum southPanel kann ich nicht viel sagen, da ich nicht genau verstanden habe, was du damit vorhast, aber in dem Panel stehen dir ja auch wieder alle Mittel des Designs zur Verfügung.

Ich denke, so sollte's erstmal deinen Wünschen entsprechen.


MfG, Poc


----------



## immer noch ned eingeloggt (5. Okt 2004)

äähm.. dankeschön 

werd ich gleich mal rumprobieren.. wie sollt ich das ganze dann am besten adden.. also die Komponenten? Mit so nem CellConstraints?

southPanel is jetzt momentan wurscht.. muss ich mir noch überlegen.. weil ein resize auf Buttons mit Smileys darauf find ich eh nicht gut.. also drum werde ich die alle festsetzen.. änderungen werden da nicht mehr gemacht.. und.. ich werd den frame auf ein gewisses minimum setzen.. 

der SplitPane macht mir halt noch sorgen.. wegen der maximalen Userlistbreite.. das kann man nicht setzen


----------



## hrhr mike (5. Okt 2004)

```
FormLayout layout=new FormLayout("fill:pref:grow","pref,fill:pref:grow,pref");
        
PanelBuilder builder = new PanelBuilder(layout);
builder.setDefaultDialogBorder();
CellConstraints cc = new CellConstraints();

builder.add(buildNorthPanel(),   cc.xy(1, 1));
builder.add(buildSplitPanel(),   cc.xy(1, 2));
builder.add(buildSouthPanel(),   cc.xy(1, 3));
        
return builder.getPanel();
```


thats great


----------



## m!k3 (5. Okt 2004)

mhh der resize in der breite funktioniert nicht.. nur in der höhe..


----------



## RellikPoc (5. Okt 2004)

Gaaanz wichtig!:
import com.jgoodies.forms.layout.*;

Naja, zuerst muss logischerweise für jedes Panel das Layout gesetzt werden: 
	
	
	
	





```
setLayout(layout);
```
Dann werden die CellConstraints gesetzt:

```
CellConstraints cc = new CellConstraints();
```
Das Einfügen der Komponenten geschieht dann über

```
<panel>.add(<panel oder so>,cc.xy(<Spalte als int>,<Zeile als int>));
```



> der SplitPane macht mir halt noch sorgen.. wegen der maximalen Userlistbreite.. das kann man nicht setzen


Die Userlist kannst du ja auch wieder in ein Panel setzen und diesem eine MaximumSize zuweisen. Könnte mir vorstellen, dass das Problem damit behoben ist...

MfG, Poc

[EDIT]





> mhh der resize in der breite funktioniert nicht.. nur in der höhe..


 Funxioniert das resize der Breite bei allen Panels nicht oder nur bei bestimmten?
[/EDIT]


----------



## der m!k3 (5. Okt 2004)

bei allen nicht.. also wird von links her abgeschnitten.. anstatt angepasst.. von rechts her passierts nicht wenn ich von da kleinerziehe..

mit nem extra Panel.. nee.. weil.. dann hab ich nicht die Option die Userliste ganz ausblenden zu lassen.. mhh


----------



## RellikPoc (5. Okt 2004)

Klingt so als ob das Resize nur beim Verkleinern nicht klappt, richtig? So von wegen "wird abgeschnitten" und so...da müßte man dann wohl die minimumsize der Komponenten bearbeiten und ab 'ner bestimmten Mindestgröße sind einige Sachen ja wirklich nicht mehr kleiner zu kriegen...

Wenn du das Panel ausgeblendet haben willst, kannst du ja im einfachsten Fall setVisible(false) nehmen...oder die SplitPane rausnehmen und nur TextPane in den entsprechenden Bereich...

MfG, Poc


----------



## Gast (5. Okt 2004)

mein Fehler.. du hast natürlich recht.. 

für das SplitPanel brauch ich doch aber eigentlich gar kein extra Layout @ siehe dein Eintrag oben..

geht doch auch so..


----------



## der m!k3 (5. Okt 2004)

Poc.. schickst du mir ne Private Message.. mit deiner E-Mail.. dann schick ich dir mal das aktuelle Layout..


----------



## RellikPoc (5. Okt 2004)

Stimmt! Das SplitPanel beinhaltet ja nur 'ne JSplitPane...hatte ich beim Layout schreiben nicht bedacht. War zu dem Zeitpunkt auf 2 Panels nebeneinander aus. Da wär das Layout dann ganz passend gewesen 

MfG, Poc


----------

