JavaFxでCSSを適用させたい

実現したいこと

JavaFxでCSSを適用させたい

前提

FXMLとJavaで開発をしていて、ラベルにCSSを適用してラベルを丸めたり中央寄せをしたい。

該当のソースコード

controller↓

java
1//CSS
2private final String Css = "-fx-border-radius:10px; -fx-text-alignment: center; -fx-line-height: 2em; -fx-font-size: 20px; -fx-background-color:#00008B;";
3
4//適用例
5@FXML
6private Label label;
7label.setStyle(Css);

試したこと

-fx-border-radiusをborder-radiusにしてみたり
-fx-text-alignmentをtext-alignにしてみたり
丸めるのと中央寄せをするのだけが適応されません。
-fx-background-colorだけはいつでも動きます...

行動規範の内容に同意します

回答1件

ベストアンサー

ラベルを丸めたり

borderを丸めるなら、border-colorを入れてください。

css
1-fx-border-color: red;
2-fx-border-radius: 10px;

背景を丸めるなら、background-radiusを入れてください。

css
1-fx-background-color:#00008B;
2-fx-background-radius: 10px;

中央寄せをしたい。

text-alignmentは、複数行にしたときに意味があります（Label2）
alignmentは、Labelの幅が文字より広い場合に中央寄せになります（Label3）
Label自体を中央寄せにするには、コンテナのalignmentを変えます（Label4）

xml
1<?xml version="1.0" encoding="UTF-8"?>
2
3<?import javafx.scene.control.Label?>
4<?import javafx.scene.layout.VBox?>
5
6<VBox spacing="10.0" stylesheets="@test.css" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1">
7    <children>
8        <Label text="Label1" />
9        <Label text="Label2&#10;Label2 Label2" />
10        <Label maxWidth="Infinity" text="Label3" />
11        <VBox alignment="CENTER">
12            <children>
13                <Label text="Label4" />
14            </children>
15        </VBox>
16    </children>
17</VBox>

css
1Label {
2    -fx-alignment: center;
3    -fx-background-color: #00008B;
4    -fx-background-radius: 10px;
5    -fx-border-color: red;
6    -fx-border-radius: 10px;
7    -fx-border-width: 2px;
8    -fx-font-size: 20px;
9    -fx-line-height: 2em;
10    -fx-text-alignment: center;
11    -fx-text-fill: white;
12}