【问题标题】:ListView with custom content in JavaFX在 JavaFX 中具有自定义内容的 ListView
【发布时间】:2015-02-10 20:50:16
【问题描述】:

如何使用 JavaFx 为我的应用程序制作自定义 ListView。我需要 HBox 与图像和每行 listView 的 2 个标签。

【问题讨论】:

  • 你需要一个自定义的单元工厂,并用listView.setCellFactory设置,我会尽快写一个答案。
  • 谢谢。我只看到了在可观察列表中使用自定义对象的 listView 示例,而不是在单元格中使用自定义小部件。
  • 我添加了添加任意内容的示例,可以是任何 Node、TextField 等。

标签: java user-interface javafx javafx-8


【解决方案1】:

您可以通过查看 ListView.setCellFactory(...) 提供自定义 CellFactory

工作示例

import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.ListCell;
import javafx.scene.control.ListView;
import javafx.scene.layout.HBox;
import javafx.scene.layout.StackPane;
import javafx.scene.layout.VBox;
import javafx.scene.text.Text;
import javafx.stage.Stage;
import javafx.util.Callback;

public class CustomListView extends Application {
    private static class CustomThing {
        private String name;
        private int price;
        public String getName() {
            return name;
        }
        public int getPrice() {
            return price;
        }
        public CustomThing(String name, int price) {
            super();
            this.name = name;
            this.price = price;
        }
    }

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

    @Override
    public void start(Stage primaryStage) {
        ObservableList<CustomThing> data = FXCollections.observableArrayList();
        data.addAll(new CustomThing("Cheese", 123), new CustomThing("Horse", 456), new CustomThing("Jam", 789));

        final ListView<CustomThing> listView = new ListView<CustomThing>(data);
        listView.setCellFactory(new Callback<ListView<CustomThing>, ListCell<CustomThing>>() {
            @Override
            public ListCell<CustomThing> call(ListView<CustomThing> listView) {
                return new CustomListCell();
            }
        });

        StackPane root = new StackPane();
        root.getChildren().add(listView);
        primaryStage.setScene(new Scene(root, 200, 250));
        primaryStage.show();
    }

    private class CustomListCell extends ListCell<CustomThing> {
        private HBox content;
        private Text name;
        private Text price;

        public CustomListCell() {
            super();
            name = new Text();
            price = new Text();
            VBox vBox = new VBox(name, price);
            content = new HBox(new Label("[Graphic]"), vBox);
            content.setSpacing(10);
        }

        @Override
        protected void updateItem(CustomThing item, boolean empty) {
            super.updateItem(item, empty);
            if (item != null && !empty) { // <== test for null item and empty parameter
                name.setText(item.getName());
                price.setText(String.format("%d $", item.getPrice()));
                setGraphic(content);
            } else {
                setGraphic(null);
            }
        }
    }

}

【讨论】:

  • 是的!就是这个!谢谢!
  • 我可以使用fxml(项目)吗?
  • 你是如何将“数据”可观察列表与表格视图绑定的?这里好像少了什么?
  • @csotiriou 它在构造函数中传递它...参见“new ListView(data)
猜你喜欢
  • 2015-02-09
  • 2018-09-08
  • 2016-06-09
  • 2020-10-01
  • 2013-11-04
  • 1970-01-01
  • 2014-10-01
  • 2019-02-06
  • 1970-01-01
相关资源
最近更新 更多