2011-01-03 12 views
4

Grundsätzlich mag ich Standard Theme Widgets. Allerdings muss ich die Schriftgröße auf DecoratedStackPanel Widget ändern.Wie kann ich die Widget-CSS-Werte von GWT ändern?

ich denke, es mit so etwas wie dies möglich sein sollte:

decoratedStackPanel.getElement().getStyle().setProperty("fontSize", "12pt"); 

jedoch „size“ ist nicht gültiger Name für Eigentum und ich habe nicht finden Art und Weise , wie alle Eigenschaften des Elements zu erhalten. Daher kenne ich den richtigen Eigenschaftsnamen nicht.

Irgendwelche Ideen?

Bitte poste nicht, ob du Widget erben oder CSS schreiben kannst. Ich mag Standard eins aber die Schriftgröße. Dies sollte möglich sein afaik.

+0

Es wäre wirklich nicht so schwierig, die CSS-Klasse auf eine bestimmte Klasse zu setzen und dann CSS zu schreiben. Ich bin mir nicht sicher, warum Sie CSS nicht schreiben können, wenn es in CSS besser ist als im Code. –

+0

Es ist in Ordnung, CSS für kleines Widget zu schreiben, aber dieses ist ziemlich komplex – Xorty

Antwort

6

fontSize ist korrekt, der beste Weg zu verwenden ist wie folgt:

decoratedStackPanel.getElement().getStyle().setFontSize(12, Unit.PT); 

Aber ich bin mir nicht sicher, dass dies dazu führen wird, was Sie wollen. Sie legt die Schriftgröße für das gesamte Panel fest, und wenn für ein untergeordnetes Element eine andere Schriftgröße festgelegt ist, wird diese in diesem Element verwendet. In diesem Fall wäre ein CSS-Eintrag für das spezifische Element besser. Zum Beispiel:

.gwt-DecoratedStackPanel .gwt-StackPanelItem { 
    font-size:12pt !important; 
} 

(! Important zwingen diese spezifische font-size Einstellung zu verwenden und soll nur verwendet werden, wenn Sie diesen font-size verwendet wird, um sicherzustellen, wollen Ersten Test ohne.).

+0

Großartig dieses hax funktioniert;) – Xorty

+0

ein anderes Problem ... während die Größe funktioniert, warum nicht das? Schriftgewicht: normal! wichtig; Hinzufügen zu derselben Regel? – Xorty

+0

Es könnte ein Unterelement sein, das den eigentlichen Text enthält, aber eine Schriftgröße, aber nicht die Schriftgröße. Um zu überprüfen, verwenden Sie zum Beispiel Chrome Browser Inspect-Element, um zu sehen, welche Eigenschaften festgelegt sind. In den gwt-Stilen sind einige fettgedruckte Schriftarten fett, daher könnte es die Ursache sein. Setzen Sie sie einfach auf das richtige css-Element mit wichtig sollte dies beheben. –

6

Sie DOM-Klasse können Sie einstellen, Stilattribute ..

DOM.setStyleAttribute(decoratedStackPanel.getElement(), "fontSize", "12pt"); 
+0

Ich weiß nicht, ob "fontSize" ist gültiger Name ... das ist, was ich frage – Xorty

+0

Entschuldigung, sollte es Schriftgröße sein und ich denke 12pt ist kein gültiger Wert für die Schriftgröße. Es kann sein, klein, x-klein, xx-klein oder 12px etc ... überprüfen Sie http://www.w3schools.com/css/pr_font_font-size.asp –

+1

fontSize ist korrekt, sollten Sie die Javascript-Attribute verwenden Nicht das CSS-Attribut der Schriftgröße. Die folgende Website enthält eine vollständige Referenz, jedoch ist fontSize nicht als vom Autor autorisiert aufgeführt, aber die gwt style-Quelle verwendet fontSize. http://www.comptechdoc.org/independent/web/cgi/javamanual/javastyle.html – LINEMAN78

1

size würde

to-size Schrift übersetzt werden
-1

Vielleicht möchten this und this für Widgets Styling gwt überprüfen

Verwandte Themen