如何在 hover 上的表格行底部應用投影

Question

這只會給我一個陰影。

增加 y 偏移量沒有任何作用。 看起來它可能是“背后的東西”

.table-row-cell:hover {
    -fx-effect: dropshadow(gaussian, rgba(0, 0, 0, 0.3), 10, 0.5, 0.0, 0.0)
}

//increased y axis offset
.table-row-cell:hover {
    -fx-effect: dropshadow(gaussian, rgba(0, 0, 0, 0.3), 10, 0.5, 0.0, 5.0)
}

Answer 1

后續行按照添加的順序放入堆棧。 這就是您描述為“背后”的問題的原因。 要獲得所需的效果，請將懸停的行放在前面以放在堆棧的頂部。

import javafx.application.Application;
import javafx.beans.property.SimpleStringProperty;
import javafx.beans.property.StringProperty;
import javafx.beans.value.ChangeListener;
import javafx.collections.FXCollections;
import javafx.scene.Scene;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableRow;
import javafx.scene.control.TableView;
import javafx.stage.Stage;

public class TableRowDropShadowApp extends Application {

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

    @Override
    public void start(Stage primaryStage) throws Exception {

        TableView<Employee> tableView = new TableView<>(
                FXCollections.observableArrayList(new Employee("John", "Doe"), new Employee("Jane", "Smith")));

        TableColumn<Employee, String> nameColumn = new TableColumn<>("Name");
        nameColumn.setCellValueFactory(param -> param.getValue().nameProperty);

        TableColumn<Employee, String> surnameColumn = new TableColumn<>("Surname");
        surnameColumn.setCellValueFactory(param -> param.getValue().surnameProperty);

        tableView.getColumns().setAll(nameColumn, surnameColumn);

        tableView.setRowFactory(table -> {
            TableRow<Employee> tableRow = new TableRow<>();
            tableRow.hoverProperty().addListener((ChangeListener<Boolean>) (observable, oldValue, newValue) -> {
                if (newValue) {
                    tableRow.toFront();
                    tableRow.setStyle("-fx-effect: dropshadow(gaussian, rgba(0, 0, 0, 0.3), 10, 0.5, 0.0, 0.0)");
                } else {
                    tableRow.setStyle("");
                }
            });
            return tableRow;
        });

        primaryStage.setScene(new Scene(tableView));
        primaryStage.show();
    }
}

class Employee {

    public final StringProperty nameProperty = new SimpleStringProperty();
    public final StringProperty surnameProperty = new SimpleStringProperty();

    public Employee(String name, String surname) {
        nameProperty.set(name);
        surnameProperty.set(surname);
    }
}