Question

水平方向的列表视图可以在项目集之后按行分割，例如我们有20个项目，并将它们显示在2行中，每行10个项目。

Answer 1

我在这里发现ListView的使用不必要。即使你设法用ListView做到这一点，也有一种更简单的方法，只需使用 TilePane ，至少我会怎样做：

TilePane tilePane = new TilePane();
tilePane.setVgap(3);
tilePane.setHgap(3);
tilePane.setPrefColumns(10);

这会将项目对齐成行。别忘了根据自己的意愿指定prefColumns。之后，您需要自己管理内部节点上的选择。

完整示例：

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.TilePane;
import javafx.stage.Stage;

public class TilePaneExample extends Application {

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

    private TilePane tilePane;
    private Label selectedLabel;

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

        String items[] = { "A", "B", "C", "D", "E", "F", "G", "H", "I", "J" };

        tilePane = new TilePane();
        tilePane.setStyle("-fx-background-color: white ;");
        tilePane.setVgap(10);
        tilePane.setHgap(10);
        tilePane.setPrefColumns(5);

        for (int i = 0; i < items.length; i++) {
            addTileNode(items[i]);
        }

        stage.setScene(new Scene(tilePane));
        stage.show();
    }

    private void addTileNode(String text) {
        Label l = new Label(text);
        l.setPrefSize(100, 50);
        // l.setGraphic(new ImageView(new Image("your image")));
        l.setOnMouseClicked(e -> {
            if (selectedLabel != l) {
                clearSelection();
                selectLabel(l);
                doSomething();
            } else {
                clearSelection();
            }
        });
        tilePane.getChildren().add(l);
    }

    private void selectLabel(Label label) {
        label.setStyle("-fx-background-color: #AFEEEE ;");
        selectedLabel = label;
    }

    private void clearSelection() {
        if (selectedLabel != null)
            selectedLabel.setStyle("-fx-background-color: white ;");
    }

    private void doSomething() {}
}

如果你真的想坚持使用ListView我唯一能想到的方法是将前10个节点放入包裹在HBox（或类似的东西）中的第一个Row中，并为其余的节点执行相同操作第二排。

P.S。使用ListView

这不是一个漂亮的解决方案

请求的代码：

上面的实现，在按住Ctrl键的同时进行多项选择

import java.util.ArrayList;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.layout.TilePane;
import javafx.stage.Stage;

public class TilePaneExample extends Application {

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

    private TilePane tilePane;
    private ArrayList<Label> allSelectedLabels = new ArrayList<>();

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

        String items[] = { "A", "B", "C", "D", "E", "F", "G", "H", "I", "J" };

        tilePane = new TilePane();
        tilePane.setStyle("-fx-background-color: white ;");
        tilePane.setVgap(10);
        tilePane.setHgap(10);
        tilePane.setPrefColumns(5);

        for (int i = 0; i < items.length; i++) {
            addTileNode(items[i]);
        }

        stage.setScene(new Scene(tilePane));
        stage.show();
    }

    private void addTileNode(String text) {
        Label l = new Label(text);
        l.setPrefSize(100, 50);

        l.setOnMouseClicked(e -> {
            if (!allSelectedLabels.contains(l)) {
                if (!e.isControlDown()) {
                    clearSelection();
                }
                selectLabel(l);
                doSomething();
            } else {
                if (e.isControlDown()) {
                    clearSelection(l);
                } else {
                    clearSelection();
                }
            }
        });
        tilePane.getChildren().add(l);
    }

    private void clearSelection(Label label) {
        if (label != null){
            label.setStyle("-fx-background-color: white ;");
            allSelectedLabels.remove(label);
        }
    }

    private void selectLabel(Label label) {
        label.setStyle("-fx-background-color: #AFEEEE ;");
        allSelectedLabels.add(label);
    }

    private void clearSelection() {

        for (Label l : allSelectedLabels) {
            l.setStyle("-fx-background-color: white ;");
        }

        allSelectedLabels.clear();

    }

    private void doSomething() {
    }
}

具有水平方向的Listview可以按行分割吗？

1 个答案: