Dies ist eine alte Version des Dokuments!
CSS zuweisen/setzen
Das JavaFX kann jedem Node css zugewiesen werden:
ObservableList<String> stylesheets = primaryStage.getScene().getStylesheets(); stylesheets.clear(); stylesheets.add("my.css"); Pane pane1 = new Pane(); pane1.setId("myId"); Pane pane2 = new Pane(); pane2.getStyleClass().add("myClass");
Die dazugehörige my.css -Datei:
#myId { -fx-... } .myClass { -fx-... }
Beispielhafte JavaFX css-Werte sind unter anderem (die .class namen sind vordefiniert und brauchen nicht extra gesetzt werden; selbstverständlich können auch Ids verwendet werden):
.button { -fx-background-color: white; // Weißer Hintergrund -fx-min-height: 20px; // Minimale Höhe 20px -fx-pref-height: 20px; // Bevorzugte Höhe 20px -fx-max-height: 20px; // Maximale Höhe 20px -fx-padding: 0 10 0 10; // Abstand zwischen Text und Rand (open, rechts, unten, links) } .rectangle { -fx-stroke: #ff0000; // Roter Rahmen -fx-fill: #0000ff; // Blau gefüllt } .tab { -fx-font-size: 12px; // 12px Schrifthöhe -fx-pref-height: 16px; // 16px Tabhöhe -fx-max-height: 16px; } .tab:selected { // Selktierter Reiter -fx-background-color: white; // Hintergrund weiß } .tab-content-area { -fx-background-color: #ff0000; // Roter Hintergrund } .tab-label { -fx-rotate: 45; // Tab-Text wird um 45 Grad gedreht } .tab-header-background { // Der Bereich hinter den Reitern -fx-background-color: #dddddd; // hellgrau -fx-border-color: transparent transparent red transparent; // roter Rand an der rechten Seite } .table-cell { -fx-alignment: center-left; // vertical zentriert und horizontal linksbündig } .table-row-cell { -fx-cell-size: 32px; // Zeilenhöhe 32 Pixel } .toolbar { -fx-background-color: white; // Weißer Hintergrund -fx-spacing: 4; // 4 Pixel Abstand zwischen den Buttons -fx-orientation: vertical; // Ausrichtung senkrecht; Standard ist waagerecht (horizontal) -fx-min-height: 20px; // Minimale Höhe 20px -fx-pref-height: 20px; // Bevorzugte Höhe 20px -fx-max-height: 20px; // Maximale Höhe 20px } .tooltip { -fx-background-color: white; // Weißer Hintergrund -fx-padding: 2 6 2 6; // Abstand zwischen Text und Rand (open, rechts, unten, links) -fx-text-fill: red; // Textfarbe rot } .tree-cell { -fx-background-color: yellow; // Gelber Hintergrund } .tree-table-cell { -fx-background-color: yellow; // Gelber Hintergrund }
Stichworte:
JavaFX CSS setzen, JavaFX 8 CSS zuweisen, id, class, Beispiel, Übersicht