java - 使用EasyBind绑定(bind)到ObservableValue 而不是ObservableList

Question

我有一个包含ModelItem项的主/详细面板。每个ModelItem有一个ListProperty<ModelItemDetail>，每个ModelItemDetail有几个StringProperty。

在详细信息面板中，我想显示一个Label，其文本将绑定到当前选定的ModelItemDetail的每个ModelItem的属性并从中派生。最终值可能取决于其他外部属性，例如在“详细信息”面板上选择CheckBox（即，如果选中此复选框，则结果中将不包含bProperty的值）。

此绑定使用Bindings.createStringBinding()完成了我想要的：

ObservableValue<ModelItem> selectedItemBinding = EasyBind.monadic(mdModel.selectedItemProperty()).orElse(new ModelItem());

// API Label Binding
apiLabel.textProperty().bind(Bindings.createStringBinding( 
    () -> selectedItemBinding.getValue().getDetails().stream()
        .map(i -> derivedBinding(i.aProperty(), i.bProperty()))
        .map(v->v.getValue())
        .collect(Collectors.joining(", "))
    , mdModel.selectedItemProperty(), checkBox.selectedProperty()));

例如：

private ObservableValue<String> derivedBinding(ObservableValue<String> aProp, ObservableValue<String> bProp) {
    return EasyBind.combine(aProp, bProp, checkBox.selectedProperty(), 
            (a, b, s) -> Boolean.TRUE.equals(s) ? new String(a + " <" + b + ">") : a);
}

我最近发现了EasyBind，并尝试用它替换一些API绑定。我找不到用EasyBind表达这种绑定的方法。显然，我的代码的主要问题在于，因为selectedItem是一个属性，所以我不能将其详细信息用作 ObservableList，而必须坚持使用 ObservableValue<ObservableList>>。通过 EasyBind.map(ObservableList)和 EasyBind.combine(ObservableList)将转换链接起来很不方便，这似乎是实现此绑定的理想选择。在某些时候，我已经考虑过创建一个本地ListProperty并将其通过selectedItem上的侦听器绑定到selectedItem的详细信息，但是它看起来太冗长和不干净。

我试过像这样强制使用EasyBind API：

ObservableValue<ObservableList<ModelItemDetail>> ebDetailList = EasyBind.select(selectedItemBinding).selectObject(ModelItem::detailsProperty);
MonadicObservableValue<ObservableList<ObservableValue<String>>> ebDerivedList = EasyBind.monadic(ebDetailList).map(x->EasyBind.map(x, i -> derivedBinding(i.aProperty(), i.bProperty())));
MonadicObservableValue<ObservableValue<String>> ebDerivedValueBinding = ebDerivedList.map(x->EasyBind.combine(x, stream -> stream.collect(Collectors.joining(", "))));
easyBindLabel.textProperty().bind(ebDerivedValueBinding.getOrElse(new ReadOnlyStringWrapper("Nothing to see here, move on")));

但是我感觉到最后一个 getOrElse仅在初始化时被调用，并且在 selectedItem更改时不会更新。

我也尝试过立即获取 ObservableList，但是没想到其他任何事情都会成为空列表：

ObservableList<ModelItemDetail> ebDetailList = EasyBind.select(selectedItemBinding).selectObject(ModelItem::detailsProperty).get();
ObservableList<ObservableValue<String>> ebDerivedList = EasyBind.map(ebDetailList, i -> derivedBinding(i.aProperty(), i.bProperty()));
ObservableValue<String> ebDerivedValueBinding = EasyBind.combine(ebDerivedList, stream -> stream.collect(Collectors.joining(", "))).orElse("Nothing to see here, move on");
easyBindLabel2.textProperty().bind(ebDerivedValueBinding);

我什至尝试使用 EasyBind.subscribe来侦听selectedItem的更改并重新绑定（对此不太确定，但是我认为不需要重新绑定，所有东西都可以执行计算）：

EasyBind.subscribe(selectedItemBinding, newValue -> {
    if (newValue != null) {
            ObservableList<ObservableValue<String>> l = 
                EasyBind.map(newValue.getDetails(), 
                             i -> derivedBinding(i.aProperty(), i.bProperty()));
            easyBindLabelSub.textProperty().bind(
                    EasyBind.combine(l, 
                            strm -> strm.collect(Collectors.joining(", "))
                    ));}});

这部分起作用，实际上它正在侦听复选框更改，但奇怪的是，它仅侦听第一个更改。我不知道为什么（很高兴知道）。
如果我添加另一个 EasyBind.Subscribe来订阅checkbox.selectedProperty，它会按预期工作，但这也太冗长和不干净。如果我自己将API侦听器添加到selectedItemProperty并在那里执行绑定，也会发生同样的情况。

我使用EasyBind来表达此绑定的动机恰恰是摆脱了显式表达该绑定的依赖关系并试图进一步简化它的需要。我想出的所有方法都比API差，因为我对它并不完全满意。

我对JavaFX还是很陌生，我正在努力解决这个问题。我想了解正在发生的事情，并找出是否有一种简短简洁的方法来使用EasyBind来表达此Binding。我开始怀疑EasyBind是否不为此用例做准备（顺便说一句，我认为这种情况很少见）。不过，可能我缺少一些琐碎的东西。

这是MVCE，显示了我尝试过的一些方法，并且API绑定按预期工作：

package mcve.javafx;

import java.util.*;
import java.util.stream.*;

import javafx.application.*;
import javafx.beans.binding.*;
import javafx.beans.property.*;
import javafx.beans.value.*;
import javafx.collections.*;
import javafx.scene.*;
import javafx.scene.control.*;
import javafx.scene.layout.*;
import javafx.stage.*;

import org.fxmisc.easybind.*;
import org.fxmisc.easybind.monadic.*;

public class Main extends Application {
    public static void main(String[] args) {
        launch(args);
    }

    private CheckBox checkShowMore;

    @Override
    public void start(Stage primaryStage) {
        try {
            // Initialize model
            MasterDetailModel mdModel = new MasterDetailModel();
            ObservableList<ModelItem> itemsList = FXCollections.observableArrayList();
            for (int i=0;i<5;i++) { itemsList.add(newModelItem(i)); }

            // Master
            ListView<ModelItem> listView = new ListView<ModelItem>();
            listView.setItems(itemsList);
            listView.setPrefHeight(150);
            mdModel.selectedItemProperty().bind(listView.getSelectionModel().selectedItemProperty());

            //Detail
            checkShowMore = new CheckBox();
            checkShowMore.setText("Show more details");
            VBox detailVBox = new VBox();           
            Label apiLabel = new Label();
            Label easyBindLabel = new Label();
            Label easyBindLabel2 = new Label();
            Label easyBindLabelSub = new Label();
            Label easyBindLabelLis = new Label();
            detailVBox.getChildren().addAll(
                    checkShowMore, 
                    new TitledPane("API Binding", apiLabel), 
                    new TitledPane("EasyBind Binding", easyBindLabel),
                    new TitledPane("EasyBind Binding 2", easyBindLabel2),
                    new TitledPane("EasyBind Subscribe", easyBindLabelSub),
                    new TitledPane("Listener+EasyBind Approach", easyBindLabelLis)
            );

            // Scene
            Scene scene = new Scene(new VBox(listView, detailVBox),400,400);
            primaryStage.setScene(scene);
            primaryStage.setTitle("JavaFX/EasyBind MVCE");

            // --------------------------
            // -------- BINDINGS --------
            // --------------------------
            ObservableValue<ModelItem> selectedItemBinding = EasyBind.monadic(mdModel.selectedItemProperty()).orElse(new ModelItem());

            // API Label Binding
            apiLabel.textProperty().bind(Bindings.createStringBinding( 
                () -> selectedItemBinding.getValue().getDetails().stream()
                    .map(i -> derivedBinding(i.aProperty(), i.bProperty()))
                    .map(v->v.getValue())
                    .collect(Collectors.joining(", "))
                , mdModel.selectedItemProperty(), checkShowMore.selectedProperty()));

            // EasyBind Binding Approach 1
            {
            ObservableValue<ObservableList<ModelItemDetail>> ebDetailList = EasyBind.select(selectedItemBinding).selectObject(ModelItem::detailsProperty);
            MonadicObservableValue<ObservableList<ObservableValue<String>>> ebDerivedList = EasyBind.monadic(ebDetailList).map(x->EasyBind.map(x, i -> derivedBinding(i.aProperty(), i.bProperty())));
            MonadicObservableValue<ObservableValue<String>> ebDerivedValueBinding = ebDerivedList.map(x->EasyBind.combine(x, stream -> stream.collect(Collectors.joining(", "))));
            easyBindLabel.textProperty().bind(ebDerivedValueBinding.getOrElse(new ReadOnlyStringWrapper("Nothing to see here, move on")));
            }

            // EasyBind Binding Approach 2
            {
            ObservableList<ModelItemDetail> ebDetailList = EasyBind.select(selectedItemBinding).selectObject(ModelItem::detailsProperty).get();
            ObservableList<ObservableValue<String>> ebDerivedList = EasyBind.map(ebDetailList, i -> derivedBinding(i.aProperty(), i.bProperty()));
            ObservableValue<String> ebDerivedValueBinding = EasyBind.combine(ebDerivedList, stream -> stream.collect(Collectors.joining(", "))).orElse("Nothing to see here, move on");
            easyBindLabel2.textProperty().bind(ebDerivedValueBinding);
            }

            // Subscribe approach
            EasyBind.subscribe(selectedItemBinding, newValue -> {
                if (newValue != null) {
                        ObservableList<ObservableValue<String>> l = EasyBind.map(newValue.getDetails(), i -> derivedBinding(i.aProperty(), i.bProperty()));
                        easyBindLabelSub.textProperty().bind(
                                EasyBind.combine(l, 
                                        strm -> strm.collect(Collectors.joining(", "))
                                ));
                }
            });
            //With this it works as intended, but something feels very wrong about this
             /*
            EasyBind.subscribe(checkShowMore.selectedProperty(), newValue -> {
                if (selectedItemBinding != null) {
                        ObservableList<ObservableValue<String>> l = EasyBind.map(selectedItemBinding.getValue().getDetails(), i -> derivedBinding(i.aProperty(), i.bProperty()));
                        easyBindLabelSub.textProperty().bind(
                                EasyBind.combine(l, 
                                        strm -> strm.collect(Collectors.joining(", "))
                                ));
                }
                });
            */

            // Listener approach
            selectedItemBinding.addListener( (ob, o, n) -> {
                ObservableList<ModelItemDetail> ebDetailList = n.getDetails();
                ObservableList<ObservableValue<String>> ebDerivedList = EasyBind.map(ebDetailList, i -> derivedBinding(i.aProperty(), i.bProperty()));
                ObservableValue<String> ebDerivedValueBinding = EasyBind.combine(ebDerivedList, stream -> stream.collect(Collectors.joining(", "))).orElse("Nothing to see here, move on");
                easyBindLabelLis.textProperty().bind(ebDerivedValueBinding);                
            });





            primaryStage.show();
        } catch(Exception e) {
            e.printStackTrace();
        }
    }

    private ObservableValue<String> derivedBinding(ObservableValue<String> aProp, ObservableValue<String> bProp) {
        return EasyBind.combine(aProp, bProp, checkShowMore.selectedProperty(), 
                (a, b, s) -> Boolean.TRUE.equals(s) ? new String(a + " <" + b + ">") : a);
    }   

    private ModelItem newModelItem(int number) { 
        ModelItem item = new ModelItem();
        item.itemNumber = number+1;
        for (int i=0;i<2;i++) { 
            ModelItemDetail detail = new ModelItemDetail();
            detail.setA("A" + (i+item.itemNumber));
            detail.setB("B" + (i+item.itemNumber));
            item.getDetails().add(detail);
        }
        return item;
    }

    /** GUI Model class */ 
    private static class MasterDetailModel {
        private ObjectProperty<ModelItem> selectedItemProperty = new SimpleObjectProperty<>();
        public ObjectProperty<ModelItem> selectedItemProperty() { return selectedItemProperty; }
        public ModelItem getSelectedItem() { return selectedItemProperty.getValue(); }
        public void setSelectedItem(ModelItem item) { selectedItemProperty.setValue(item); }
    }

    /** Domain Model class */
    private static class ModelItem { 
        int itemNumber;
        private ListProperty<ModelItemDetail> detailsProperty = new SimpleListProperty<>(FXCollections.observableArrayList());
        public ListProperty<ModelItemDetail> detailsProperty() { return detailsProperty; }
        public ObservableList<ModelItemDetail> getDetails() { return detailsProperty.getValue(); }
        public void setDetails(List<ModelItemDetail> details) { detailsProperty.setValue(FXCollections.observableList(details)); }
        public String toString() { return "Item " + itemNumber; }
    }

    /** Domain Model class */
    private static class ModelItemDetail {
        private StringProperty aProperty = new SimpleStringProperty();
        public StringProperty aProperty() { return aProperty; }
        public String getA() { return aProperty.get(); }
        public void setA(String a) { aProperty.set(a); }

        private StringProperty bProperty = new SimpleStringProperty();
        public StringProperty bProperty() { return bProperty; }
        public String getB() { return bProperty.get(); }
        public void setB(String b) { bProperty.set(b); }
    }
}

更新：我已经取得了一些进展。

以下代码可以正常工作，但是神秘地仍然只侦听CheckBox上的第一个更改：

ListProperty<ModelItemDetail> obsList = new SimpleListProperty<>(FXCollections.observableArrayList(i->new Observable[] { i.aProperty(), i.bProperty(), checkShowMore.selectedProperty()}));
obsList.bind(selectedItemBinding.flatMap(ModelItem::detailsProperty));
ObservableList<ModelItemDetail> ebDetailList = obsList; // WHY ??
ObservableList<ObservableValue<String>> ebDerivedList = EasyBind.map(ebDetailList, i -> derivedBinding(i.aProperty(), i.bProperty()));
ObservableValue<String> ebDerivedValueBinding = EasyBind.combine(ebDerivedList, stream -> stream.collect(Collectors.joining(", "))).orElse("Nothing to see here, move on");
labelPlayground.textProperty().bind(ebDerivedValueBinding);

显然，我遇到麻烦的主要原因是因为我没有看到如何使用EasyBind fluent API从绑定的当前 ObservableList中获取 selectedItem。声明一个本地 ListProperty并将其绑定到所选项目上，我可以利用 ListProperty作为 ObservableList的优势。我认为EasyBind不会跟随某个地方。感觉类型信息在某处迷路了。我不能在最后的代码中将所有这些变量放在一起，而且我不明白为什么EasyBind.map（）在最后的代码中会接受 ebDetailList，但不接受 obsList。

因此，现在的问题是，为什么此绑定仅在第一次侦听CheckBox事件？ ListProperty的后备列表中的提取器不执行任何操作。我猜 obsList.bind()正在用没有提取器的Model中的列表替换后备列表。

Answer 1

如果我理解正确，则希望标签显示所选ModelItem的文本，该文本由其中包含的所有ModelItemDetail组成。每当添加或删除ModelItemDetail以及列表中任何a的b或ModelItemDetail属性更新时，此文本都应更新。

您不需要外部库来进行此1级深度绑定（ModelItemDetail-> a，b）。 ModelItemDetail列表的更改由ObservableList报告。列表中各项属性的更改可以通过extractor报告：

ListProperty<ModelItemDetail> detailsProperty = new SimpleListProperty<>(
                FXCollections.observableArrayList(i -> new Observable[]{i.aProperty(), i.bProperty()}));

实际上，您不需要 ListProperty，一个简单的 ObservableList就足够了。

在以下示例中，


ModelItem中显示一个 ListView。使用具有某些 ModelItemDetail和 a属性的3 b对其进行初始化。
底部的文本标签显示了组合的 ModelItemDetail的文本。
顶部的 CheckBox确定是否显示 b属性。请注意，即使未选中它，也会继续报告对 b的更改（但未显示）。
右侧的“添加项目详细信息”按钮会将另一个随机编号的 ModelItemDetail添加到列表中。此更改将立即通过 ObservableList反映出来。
右侧的“更改A”按钮将设置从列表中随机选择的 a的 ModelItemDetail属性的值。此更改将立即通过 ObservableList的提取器反映出来。

public class Main extends Application {

    public Main() {}

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

    @Override
    public void start(Stage stage) throws Exception {
        // Mock initial data
        ModelItem item = new ModelItem();
        ModelItemDetail mid1 = new ModelItemDetail();
        mid1.setA("a1");
        mid1.setB("b1");
        ModelItemDetail mid2 = new ModelItemDetail();
        mid2.setA("a2");
        mid2.setB("b2");
        ModelItemDetail mid3 = new ModelItemDetail();
        mid3.setA("a3");
        mid3.setB("b3");
        ObservableList<ModelItemDetail> details = item.getDetails();
        details.add(mid1);
        details.add(mid2);
        details.add(mid3);

        // Create binding

        CheckBox showB = new CheckBox("Show b");
        Label label = new Label();

        label.textProperty().bind(Bindings.createStringBinding(() -> {
            return details.stream()
                .map(mid ->
                    Boolean.TRUE.equals(showB.isSelected()) ? new String(mid.getA() + " <" + mid.getB() + ">") : mid.getA()
                ).collect(Collectors.joining(", "));
        }, details, showB.selectedProperty()));

        // Create testing components

        Button add = new Button("Add item detail");
        add.setOnAction(e -> {
            Random r = new Random();
            int i = r.nextInt(100) + 3;
            ModelItemDetail mid = new ModelItemDetail();
            mid.setA("a" + i);
            mid.setB("b" + i);
            details.add(mid);
        });
        Button changeA = new Button("Change some A");
        changeA.setOnAction(e -> {
            Random r = new Random();
            ModelItemDetail detail = details.get(r.nextInt(details.size()));
            detail.setA("a" + r.nextInt(100) + 3);
        });

        // Display everything

        BorderPane pane = new BorderPane();
        ListView<ModelItem> list = new ListView<>();
        list.getItems().add(item);
        pane.setCenter(list);
        pane.setRight(new VBox(add, changeA));
        pane.setTop(showB);
        pane.setBottom(label);
        stage.setScene(new Scene(pane));
        stage.show();
    }

    private static class ModelItem {
        int itemNumber;
        private ObservableList<ModelItemDetail> detailsProperty = FXCollections.observableArrayList(i -> new Observable[]{i.aProperty(), i.bProperty()});
        public ObservableList<ModelItemDetail> getDetails() { return detailsProperty; }
        @Override public String toString() { return "Item " + itemNumber; }
    }

    /** Domain Model class */
    private static class ModelItemDetail {
        private StringProperty aProperty = new SimpleStringProperty();
        public StringProperty aProperty() { return aProperty; }
        public String getA() { return aProperty.get(); }
        public void setA(String a) { aProperty.set(a); }

        private StringProperty bProperty = new SimpleStringProperty();
        public StringProperty bProperty() { return bProperty; }
        public String getB() { return bProperty.get(); }
        public void setB(String b) { bProperty.set(b); }
    }
}

您可以在 ModelItem中添加更多 ListView，并让标签显示所选文本。