model-view-controller - 如何在 JavaFX 中使用 ObservableLists

Question

我正在尝试使用 ObservableLists 来帮助我在我正在构建的新应用程序中编排 MVC 框架。我有一个 LineData 对象，其中包含在屏幕上绘制线条所需的信息，并且我想在我的程序后端维护一个 LineData 列表。然后，每当在后端绘制 LineData 列表时，我希望通过前端在屏幕上绘制相应的线条。我相信要做到这一点，我需要在前端有一个列表绑定到后端列表，然后我需要在这个列表上有某种监听器，触发新数据变成行和画？我只是对如何做到这一点感到困惑——任何帮助将不胜感激！谢谢！

Answer 1

您可以“手动”执行此操作，向 a 注册侦听器，ObservableList<LineData>并根据需要从 a 的子列表中添加或删除元素Pane。所以像

public class Model {

    // ...

    public ObservableList<LineData> getLineData() { ... }

    // ...

}

接着

public class MyController {

    Model model ;

    @FXML
    private Pane pane ; // contains lines...

    public void initialize() {
        model.getLineData().addListener((ListChangeListener.Change change) -> {
            while (change.next()) { 
                if (change.wasAdded()) {
                    change.getAddedSubList().stream()
                        .map(this::createLineForLineData)
                        .forEach(pane.getChildren()::add);
                } else if (change.wasRemoved()) {
                    change.getRemoved().forEach(lineData -> 
                        pane.getChildren().removeIf((Line line) -> lineMatchesLineData(line, lineData));
                }
            }
        });

        // ...

    }


    // ...

    private Line createLineForLineData(LineData lineData) {
        // create Line matching data in lineData and return it
    }

    private boolean lineMatchesLineData(Line line, LineData lineData) {
        // return true if line's state matches data in lineData, false otherwise
    }
}

请注意，EasyBind框架为此提供了内置功能：

public class MyController {

    Model model ;

    @FXML
    private Pane pane ;

    public void initialize() {
        Bindings.bindContent(pane.getChildren(),
            EasyBind.map(model.getLineData(), this::createLineForLineData));

        // ...
    }

    private Line createLineForLineData(LineData lineData) { ... }

}