VAADIN: Problem mit Label

[Swoop]

Hallo,

da erst letztens aufgekommen ist das doch ein paar Leute hier auch Vaadin benützen schau ich mal ob mir hier jemand bei meinem Problem helfen kann.

Und zwar hab ich ein Label auf 40px große Schrift eingefügt. Wenn da jetzt zuviel Text rein kommt bricht es ja automatisch um. Mein Problem ist jetzt, dass dann bei dem Umbruch die Texte überlagern. Im Anhang hab ich mal ein Bild als Beispiel angehängt.

Wär froh über jede Hilfe!

Grüße Swoop

 

[Noctarius]

Welches Layout benutzt du und wie hast du das Label positioniert?

 

[XHelp]

Und über die Frage von Noctarius hinaus: willst du, dass er vernünftig umbricht oder erst gar nicht?

 

[Swoop]

ähm hier mein Code wie ich es erstell:

	private Component createHeadContainer()
	{
		VerticalLayout titleLayout = new VerticalLayout();
		titleLayout.setWidth("95%");

		Label title = new Label("Herzlich Willkommen");
		title.setStyleName("pd_content_title");

		Label subTitle = new Label("ProDevelop GmbH - Softwareentwicklung");
		subTitle.setStyleName("pd_content_subtitle");

		titleLayout.addComponent(title);
		titleLayout.addComponent(subTitle);
		return titleLayout;
	}

und das CSS dazu:

.pd_content_title {
	font-weight: bold;
	font-size: 40px;
	color: #2E62FF;
	margin-left: 15px;
	margin-top: 20px;
	margin-bottom: 5px;
}

.pd_content_subtitle {
	font-size: 20px;
	color: #2E62FF;
	padding-top: 10px;
	padding-left: 15px;
}

Also nutze ich ein VerticalLayout und ich möchte, dass es korrekt umbricht

 

[Noctarius]

Argh wieso machst du das mit einem CSS? Oo

 

[Swoop]

Argh wieso machst du das mit einem CSS? Oo

ähm wie sonst ????:bahnhof:

 

[Noctarius]

Ja Schriftgröße und so ok, aber Margin und Padding uns so macht das Layout, dafür ist es da.

 

[Swoop]

höä ?! wenn ich des denn so mach klatscht er mir das Zeug direkt an den Rand?!

 

[Noctarius]

Man positioniert (genau wie bei Swing) in Vaadin eben per Layout und nicht per Hand. Dafür nutzt man dann relative Werte.

Wenn das Layout setMargin(true) nutzt ist es nicht direkt am Rand 😉

PS: Für ganz schlimme Fälle gibt es eigentlich CustomLayout (oder CssLayout?!?) ...

 

[Swoop]

Man positioniert (genau wie bei Swing) in Vaadin eben per Layout und nicht per Hand. Dafür nutzt man dann relative Werte.

hat dass denn auch was mit meinem Problem zu tun?!

 

[Noctarius]

hat dass denn auch was mit meinem Problem zu tun?!

Könnte sein, dass da durch das automatische Positionieren gestört ist. Du könntest bei den Labels mal ein setSizeUndefined() versuchen.

PS: Siehe Post darüber

 

[Swoop]

Okay dann muss ich mir glaub mal das CustomLayout anschauen ...

 

[Noctarius]

Okay dann muss ich mir glaub mal das CustomLayout anschauen ...

Irgs... Du hast das Wort Notfall in meine Aussage interpretiert, oder?

 

[Swoop]

Naja ohne die CSS-Angaben funktioniert mein Aufbau leider nicht ... da ich rechts links und unten einen festen Rand haben will...
Hm ich versuch mal die anderen Dinge erstmal zu setzten und schauen obs dann funktioniert ...
Hab das Layout schon mti viel Mühe aufgebaut 😀

 

[Noctarius]

Dann setz das CSS auf's Layout

 

[Swoop]

Supi 😀 es funktioniert schonmal ziemlich gut ...

Habe es jetzt so geändert:

.pd_content_title {
	font-weight: bold;
	font-size: 40px;
	color: #2E62FF;
}

.pd_content_subtitle {
	font-size: 20px;
	color: #2E62FF;
}

und mein Code:

	private Component createHeadContainer()
	{
		VerticalLayout titleLayout = new VerticalLayout();
		titleLayout.setSizeUndefined();

		Label title = new Label("Herzlich Willkommen");
		title.setStyleName("pd_content_title");

		Label subTitle = new Label("ProDevelop GmbH - Softwareentwicklung");
		subTitle.setStyleName("pd_content_subtitle");

		titleLayout.addComponent(title);
		titleLayout.addComponent(subTitle);
		return titleLayout;
	}

Jetzt gibts nur noch ein Problem, dass Beispielsweise beim g oder p das untere Ende abgeschnitten wird. Kann das auch das gleiche Problem sein?

 

[Noctarius]

Label.setSizeUndefined() 😉

 

[Swoop]

das nützt leider nichts ...

 

[Swoop]

Konnte es lösen 😀 zwar nicht ganz ohne die CSS-Tags aber immerhin funktioniert der rest ganz gut =)

danke Noctarius