Как стилизовать JFoenix для узлов и классов JavaFX Scene Builder в CSS? - PullRequest
Новая
       110

Как стилизовать JFoenix для узлов и классов JavaFX Scene Builder в CSS?

1 голос
/ 22 апреля 2020

Я пытаюсь добавить свои пользовательские значения в класс свойств JFXButton в таблице стилей CSS, но я не могу заставить их работать: 

.eliminarBtn {
    -fx-background-color: #eb490f; //This work
    -fx-font-color: WHITE; //This doesn't work
    -fx-font-weight: bold; //This doesn't work. Edit: had to refresh(works) 
    -fx-font-size: 20px; //this work
    -fx-background-radius: 8px; //This work
}

В этом случае я знаю некоторые из его значений, потому что в Scene Builder есть выпадающий список, чтобы выбрать, а затем я могу напечатать его в таблице стилей. Другие, которые я пробовал использовать HTML стандарт с -fx- и надеюсь, что он будет работать, но это не так. Так как же добавить вес и цвет к тексту кнопки? Кстати, я могу установить классы CSS для любого нужного мне узла кнопки.

Кроме того, если у вас есть руководство по стилям JavaFX и / или компонентам JFoenix, добавьте мне ссылку. Спасибо.

Ответы [ 2 ]

2 голосов
/ 23 апреля 2020

Вы можете проверить JavaFX CSS Справочное руководство для получения дополнительной информации о классах стилей компонентов JavaFX и их значениях по умолчанию.

JFXButton расширяет JavaFX Button, и кажется, чтобы добавить только одно дополнительное CSS свойство, равное -jfx-button-type, возможны два значения: FLAT (по умолчанию) и RAISED. Отвечая на ваш вопрос, вы можете изменить цвет и вес текста JFXButton, используя следующую команду: CSS: 

.button {
    -fx-text-fill: WHITE;
    -fx-font-weight: BOLD;
}

Поднятый JFXButton может быть создан в CSS следующим образом: 

JFXButton raisedButton = new JFXButton("RAISED BUTTON");
button.getStyleClass().add("button-raised");

.button-raised {
    -jfx-button-type: RAISED;
    -fx-background-color: TURQUOISE;
    -fx-text-fill: WHITE;
    -fx-font-weight: BOLD;
}
0 голосов
/ 23 апреля 2020

При использовании Scene Builder на панели свойств с правой стороны отображаются доступные параметры для изменения: например, вы можете заполнить текст в области «Заполнение текстом». Однако для реализации кода вы должны добавить fx примерно так: 

-fx-text-fill: #colorvalue;

И так далее для других модификаторов. Тем не менее, есть модификаторы, которые принимают более 1 значение, о котором я не знаю. Возможно, эти форматы соответствуют правилам css, с них тоже нужно начинать.

...