在列表视图javaFX中的单元格之间插入空格

Question

我想在listview单元格之间创建差距,但我没有找到任何合适的方法来完成此任务.在css或java代码中是否有任何方法可以在它们之间创建差距？

这是我正在寻找的:

谢谢你的进步,

Answer 1

使用"嵌套背景"结合css中的填充list-cell.以下结果与您的屏幕截图相近:

列表视图 - 细胞gap.css:

.list-view {
    -fx-padding: 3px ;
    -fx-background-color: darkred ;
}

.list-cell {
    -fx-padding: 2px ;
    -fx-background-color: transparent, -fx-background ;
    -fx-background-insets: 0px, 2px ;
}

.list-cell:empty {
    -fx-padding: 2px ;
    -fx-background-color: transparent ;
    -fx-background-insets: 0 ;
}

测试代码:

import java.util.stream.IntStream;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.ListView;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;

public class ListViewStyleExample extends Application {

    @Override
    public void start(Stage primaryStage) {
        ListView<String> listView = new ListView<>();
        IntStream.rangeClosed(1, 20).mapToObj(Integer::toString)
            .map("Item "::concat).forEach(listView.getItems()::add);
        Scene scene = new Scene(new BorderPane(listView), 250, 400);
        scene.getStylesheets().add("list-view-cell-gap.css");
        primaryStage.setScene(scene);
        primaryStage.show();
    }


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