使用 JavaFX 構建 Reactive 系統

oschina發表於2016-02-27

JavaFX 是Java中用來構建圖形應用程式的新的標準庫, 但許多程式設計師仍然堅持在使用Swing甚至AWT(額滴個神啊)。關於如何利用JavaFX工具集中的新的超棒特性來構建響應式的快速應用程式,這裡有一些建議!

1. 屬性值

如果你對JavaFX元件做過完整的瞭解,移動遇到過屬性(Property)這個東西。FX庫中幾乎每個值都可以被觀察,分割槽(divider)的寬度,圖片的尺寸,文字標識(label)中的文字,一個列表中的子項以及核取方塊(checkbox)的狀態。屬性分成另類:可寫屬性和可讀屬性。可寫值可以被修改,使用設定器方法或者直接修改。 JavaFX 會處理事件處置過程並確保每個依賴於此屬性的元件都會被通知到。可讀屬性擁有能讓你在其值被修改時接收到通知的方法。

示例:

// 可讀-且可寫
StringProperty name = new SimpleStringProperty("Emil"); 
// 只讀
ObservableBooleanValue nameIsEmpty = name.isEmpty();

2. 繫結值

當你擁有一個可寫和可讀值的時候,你可以開始就這些值如何關聯定義規則。一個可寫屬性可以被繫結到一個可讀屬性,如此其值總是會匹配到可讀的這個。繫結並不會立即發生,不過它們會在值被觀察之前進行(看看我在那裡做的就明白了)。 繫結可以是單向或者雙向的。當然,如果它們之間是雙向的,就需要兩個屬性都是可寫的。

示例:

TextField fieldA = new TextField();
TextField fieldB = new TextField();
fieldA.prefWidthProperty().bind(fieldB.widthProperty());

3. 可觀察的列表

屬性並不是唯一可以被觀察的東西。如果列表是被封裝到了一個 ObservableList 中,那麼列表的成員同樣也是可以被觀察到的。ObservableList 的響應模型是相當先進的。你不僅能在列表被修改時收到通知,也可以看到列表具體是如何被修改的。

示例:

List<String> otherList = Arrays.asList("foo", "bar", "bar");
ObservableList<String> list = FXCollections.observableList(otherList);

list.addListener((ListChangeListener.Change<? extends String> change) -> {
    System.out.println("Received event.");
    while (change.next()) {
        if (change.wasAdded()) {
            System.out.println(
                "Items " + change.getAddedSubList() + " was added.");
        }

        if (change.wasRemoved()) {
            System.out.println(
                "Items " + change.getRemoved() + " was removed.");
        }
    }
});

System.out.println("Old list: " + list);
list.set(1, "foo");
System.out.println("New list: " + list);

上面程式碼的執行輸出如下:

Old list: [foo, bar, bar]
Received event.
Items [foo] was added.
Items [bar] was removed.
New list: [foo, foo, bar]

如你所見,設定操作只會觸發一次事件。

相關文章