Как добавить свойство hover к кнопке из контроллера javafx вместо CSS

Предположим, у меня есть кнопка переключения в JavaFX CSS, определенная как таковая.

.btn:hover{
    -fx-background-color: #ffffff;
}

У меня есть несколько кнопок-переключателей в FlowPane, но все они должны иметь разные цвета, определенные в контроллере. Как я могу вместо этого изменить этот цвет наведения с контроллера?


javafx javafx-css
person pam    schedule 11.06.2020    source источник

Ответы (1)


arrow_upward
3
arrow_downward

Определите искомый цвет в файле CSS:

.root {
    button-hover-color: #ffffff ;
}
.button:hover {
    -fx-background-color: button-hover-color ;
}

Обратите внимание, что CSS по умолчанию фактически устанавливает свойство -fx-color, из которого получается фон. Поэтому, если вы хотите настроить его так, чтобы он вел себя по умолчанию без дальнейших изменений, поэкспериментируйте с

.root {
    button-hover-color: -fx-hover-base ;
}
.button:hover {
    -fx-color: button-hover-color ;
}

И затем в вашем классе контроллера вы можете просто изменить искомый цвет на кнопках (или в любом контейнере, чтобы применить его ко всем кнопкам в контейнере):

public class MyController {
    @FXML
    private Button button ;

    public void initialize() {
        button.setStyle("button-hover-color: red ;");
    }
}

Вот полный пример, использующий второй файл CSS выше как style.css.

Основной.fxml:

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.VBox?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.Button?>
<?import javafx.geometry.Insets?>

<VBox alignment="CENTER" spacing="20.0" xmlns="http://javafx.com/javafx/8.0.171" xmlns:fx="http://javafx.com/fxml/1" fx:controller="org.jamesd.examples.hover.Controller">
    <Button fx:id="firstButton" text="First"/>
    <Button fx:id="secondButton" text="Second"/>
    <Button fx:id="thirdButton" text="Third"/>
</VBox>

Контроллер.java:

import javafx.fxml.FXML;
import javafx.scene.control.Button;

public class Controller {

    @FXML
    private Button firstButton ;
    @FXML
    private Button secondButton ;
    @FXML
    private Button thirdButton ;

    public void initialize() {
        firstButton.setStyle("button-hover-color: #7fc97f;");
        secondButton.setStyle("button-hover-color: #beaed4;");
        thirdButton.setStyle("button-hover-color: #fdc086;");
    }
}

и App.java:

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

import java.io.IOException;

public class App extends Application {

    @Override
    public void start(Stage stage) throws IOException {
        Scene scene = new Scene(FXMLLoader.load(getClass().getResource("Main.fxml")), 640, 480);
        scene.getStylesheets().add(getClass().getResource("style.css").toExternalForm());
        stage.setScene(scene);
        stage.show();
    }


    public static void main(String[] args) {
        launch();
    }

}

Обратите внимание, что вы также можете настроить кнопки непосредственно в FXML:

<Button fx:id="firstButton" text="First" style="button-hover-color: #7fc97f;"/>

и т.п.

person James_D    schedule 11.06.2020