Способ изменения стилей CSS в работающем приложении Java - PullRequest
0 голосов
/ 10 мая 2019

Я работаю над приложением JavaFX, которое использует стили CSS, включенные в файл.Я хочу изменить стиль CSS после того, как на кнопке произойдет действие, и я написал код, который меняет стиль Button при вводе / выходе из него:

public void actionMouseEntered() {
    buttonReflex1.getStyleClass().clear();
    buttonReflex1.getStyleClass().add("button_reflex_pressed");
    }
public void actionMouseExited(){
    buttonReflex1.getStyleClass().clear();
    buttonReflex1.getStyleClass().add("button_reflex");
}

И вот у вас есть мой файл CSS:

.button_reflex{
    -fx-shape: "M 200 *a lot of numbers here* Z";
    -fx-background-color: radial-gradient(focus-angle 360deg, focus-distance 0%, center 50% 50%, radius 70%, reflect, lightblue, aqua 30%, blue);
    -fx-text-fill: linear-gradient(#e4e000 0%, #ff0000 50%, #e4e000 100%);
}
.button_reflex_pressed{
    -fx-shape: "M 200 *a lot of numbers here* Z";
    -fx-background-color: radial-gradient(focus-angle 360deg, focus-distance 0%, center 50% 50%, radius 70%, reflect, dodgerblue, deepskyblue 30%, darkblue);
    -fx-text-fill: linear-gradient(#e4e000 0%, #ff0000 50%, #e4e000 100%);
}

Они различаются по цвету кнопок.

Код, который я написал выше РАБОТАЕТ , но я думаю, что написал его не очень хорошо.Не могли бы вы сказать мне, если мой метод реализации это правильно, или если это не так, пожалуйста, скажите мне, как я могу сделать это лучше, потому что я не хочу изучать вредные привычки.

Ответы [ 2 ]

4 голосов
/ 10 мая 2019

Вам не нужно менять класс стиля.Изменение стиля также не лучший способ подойти к этому.В этом случае следует использовать PseudoClass.Также следует избегать дублирования свойств CSS, которые не отличаются или отличаются только цветами.Используйте правило для обоих, чтобы указать это только один раз, чтобы было легче изменить;в последнем случае вы можете использовать искомые цвета:

private static final PseudoClass MY_HOVER = PseudoClass.getPseudoClass("my-hover");

...
buttonReflex1.getStyleClass().setAll("button-reflex");
...

    boolean hovering = ...;
    buttonReflex1.pseudoClassStateChanged(MY_HOVER, hovering);
.button-reflex {
    -fx-background-color1: lightblue;
    -fx-background-color2: aqua;
    -fx-background-color3: blue;
    -fx-shape: "M 200 *a lot of numbers here* Z";
    -fx-background-color: radial-gradient(focus-angle 360deg, focus-distance 0%, center 50% 50%, radius 70%, reflect, -fx-background-color1, -fx-background-color2 30%, -fx-background-color3);
    -fx-text-fill: linear-gradient(#e4e000 0%, #ff0000 50%, #e4e000 100%);
}

.button-reflex:my-hover {
    /* only change colors here; keep the rest */
    -fx-background-color1: dodgerblue;
    -fx-background-color2: deepskyblue;
    -fx-background-color3: darkblue;
}

Примечание: Псевдокласс my-hover используется здесь только для демонстрации общего подхода.JavaFX Node предоставляет по умолчанию некоторые псевдоклассы, которые следует использовать вместо: hover, pressed, ect ...

См. Справочное руководство по JavaFX CSS: Узел

1 голос
/ 10 мая 2019

Итак, во-первых, да, вы можете изменить CSS во время выполнения.

Но вы используете его неправильно.

Так что, если у вас есть базовый класс CSS для вашего узла. Например:

.button {
    -fx-background-color: red;
}

и теперь, если вы хотите получить эффект для какого-либо события JavaFx, есть несколько параметров, таких как Hover, Pressed, Focused ...

.button {
   -fx-background-color: red;
}

.button:hover {
   -fx-background-color: blue;
}

.button:pressed{
   -fx-background-color: green;
}

JavaFx - это то, что обрабатывает все для вас, и вам не нужно менять стиль вручную.

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