Различное поведение элементов управления Text и Labeled в сочетании с css - PullRequest
1 голос
/ 01 августа 2020

Я работаю над приложением Javafx, и я попытался добавить несколько меток, кнопок и текстов, размер которых изменяется, когда пользователь изменяет размер сцены. Все узлы находятся внутри VBox, который сам находится внутри StackPane.

Мое тестовое приложение:

public class Test extends Application 
{
    public static void main(String[] args) 
    {
        launch(args);
    }

    @Override
    public void start(final Stage primaryStage) 
    {           
        StackPane pane = new StackPane();
        VBox box = new VBox();
        box.setAlignment(Pos.CENTER);
        Label l = new Label("Label");
        Text t = new Text("Text");
        t.getStyleClass().add("test");
        Button b = new Button("Button");
        pane.heightProperty().addListener(listener ->
        {
            double h = pane.getHeight()/5;          
            l.setFont(Font.font(l.getFont().getFamily(), h));
            t.setFont(Font.font(t.getFont().getFamily(), h));
            b.setFont(Font.font(b.getFont().getFamily(), h));
        });
        
        box.getChildren().addAll(l, t, b);
        pane.getChildren().add(box);
        primaryStage.setScene(new Scene(pane));
        primaryStage.getScene().getStylesheets().add(Path.of("test.css").toUri().toString());
        primaryStage.show();
    }
}

Если я изменяю размер Stage, он работает должным образом. Но, к сожалению, только с чистым кодом Java. Потому что после добавления моего файла css элементы управления с метками ведут себя иначе. В то время как текстовые элементы продолжают меняться в размере, метки и кнопки больше не меняют свой размер.

Мой css файл, который не работает:

.label
{
   -fx-text-fill: red;
   -fx-font-family: impact;
}

.test
{
   -fx-fill: red;
   -fx-font-family: impact;
   -fx-font-size: 2em;
}

.button
{
   -fx-text-fill: red;
   -fx-font-size: 2em;
}

Я спросил себя, что я сделал не так, и протестировал различные состояния css. Я обнаружил, что когда я опускаю значения шрифта в css, он работает, иначе - нет. При этом не имеет значения, какое значение шрифта используется, требуется только одно значение шрифта, чтобы пропустить поведение.

Мой css файл, который работает:

.label
{
   -fx-text-fill: red;
   //-fx-font-family: impact;
}

.test
{
   -fx-fill: red;
   -fx-font-family: impact;
   -fx-font-size: 2em;
}

.button
{
   -fx-text-fill: red;
   //-fx-font-size: 2em;
}

1. Вопрос: -изменился, см. Ниже-

Я что-то не понимаю в css и Javafx, или я что-то не так в моем css файле или есть ошибка?

2 . Вопрос: -solved-

Нужно ли мне ставить значения шрифта с кодом java или есть другой способ добавить шрифт?

Спасибо за помощь!

Обновление

Как рекомендовано, я изучил следующее руководство: https://openjfx.io/javadoc/14/javafx.graphics/javafx/scene/doc-files/cssref.html

Реализация JavaFX CSS применяет следующий порядок приоритета:

Реализация позволяет дизайнерам стилизовать приложение, используя таблицы стилей для переопределения значений свойств, установленных из кода. Например, вызов rectangle.setFill (Color.YELLOW) можно переопределить встроенным стилем или стилем из авторской таблицы стилей. Это имеет значение для каскада; в частности, когда стиль из таблицы стилей переопределяет значение, установленное из кода? В реализации JavaFX CSS применяется следующий порядок приоритета: стиль из таблицы стилей пользовательского агента имеет более низкий приоритет, чем значение, установленное из кода, который имеет более низкий приоритет, чем таблица стилей сцены или родительской таблицы. Встроенные стили имеют наивысший приоритет. Таблицы стилей из родительского экземпляра считаются более конкретными c, чем стили из таблиц стилей сцены.

В моем случае это означает, что я буду использовать встроенный стиль, чтобы сделать его правильным.

, таким образом, вопрос решен.

Но из-за того, что родительская таблица стилей> значение, установленное из кода , это также означает, что всем узлам не разрешено изменять свой размер. , даже текстовый узел.

Поэтому я изменил свой 1. Вопрос на:

Почему порядок приоритета JavaFX CSS отличается для текста и элементов управления

1 Ответ

1 голос
/ 01 августа 2020

Вопрос 1:

Это не ошибка, это конфликт приоритетов. .setFont() имеет более низкий приоритет, чем CSS. Просто замените .setFont() на .setStyle(), и образец будет работать так, как вы планировали:

l.setStyle("-fx-font-size:" + h + ";");
t.setStyle("-fx-font-size:" + h + ";");
b.setStyle("-fx-font-size:" + h + ";");

Вопрос 2:

Постарайтесь сохранить все стили в CSS. Это лучшая практика.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...