使用PropertyEditor的属性表示例(ControlsFX)

10

我一直在搜索使用ControlsFX PropertySheet的好例子,但除了这个之外,我什么都找不到。

https://www.google.nl/search?q=Main.java+amazonaws.com&ie=utf-8&oe=utf-8&aq=t&rls=org.mozilla:nl:official&client=firefox-a&channel=sb&gfe_rd=cr&ei=d5aeU5bvBI3k-gan94HQBA#channel=sb&q=https%3A%2F%2Fbitbucket-assetroot.s3.amazonaws.com%2Fcontrolsfx%2Fcontrolsfx+Main.java&rls=org.mozilla:nl:official

在这个例子中,包含NameItem对象的ObservableList项目被添加到PropertySheet对象的构造函数中,就像文档所说的那样。

http://controlsfx.bitbucket.org/org/controlsfx/control/PropertySheet.html

然而,正如这份文档所说,属性表的列“提供了一个属性编辑器,允许最终用户操纵属性”。它甚至说,“在编辑器包中有许多可用的编辑器,包括CheckEditor、ChoiceEditor、TextEditor和FontEditor。”
我不想局限于NameItem示例。我还想添加复选框、选择框和其他动态编辑器元素。请问是否有人可以举个例子,说明如何使用一个或多个编辑器来构建一个简单的属性表?

你看过示例吗?特别是HelloPropertySheet示例。 - Eugene Ryzhikov
4个回答

10

PropertySheet支持几种属性编辑器,具体取决于属性类型。

以下示例是从ControlsFX示例应用程序中的扩展。它展示了如何将字符串、本地日期、枚举、布尔和整数类型分别映射到TextField、DatePicker、ChoiceBox、CheckBox和NumericField。

public class PropertySheetExample extends VBox {
    private static Map<String, Object> customDataMap = new LinkedHashMap<>();
    static {
        customDataMap.put("Group 1#My Text", "Same text"); // Creates a TextField in property sheet
        customDataMap.put("Group 1#My Date", LocalDate.of(2000, Month.JANUARY, 1)); // Creates a DatePicker
        customDataMap.put("Group 2#My Enum Choice", SomeEnumType.EnumValue); // Creates a ChoiceBox
        customDataMap.put("Group 2#My Boolean", false); // Creates a CheckBox
        customDataMap.put("Group 2#My Number", 500); // Creates a NumericField
    }

    class CustomPropertyItem implements PropertySheet.Item {
        private String key;
        private String category, name;

        public CustomPropertyItem(String key) {
            this.key = key;
            String[] skey = key.split("#");
            category = skey[0];
            name = skey[1];
        }

        @Override
        public Class<?> getType() {
            return customDataMap.get(key).getClass();
        }

        @Override
        public String getCategory() {
            return category;
        }

        @Override
        public String getName() {
            return name;
        }

        @Override
        public String getDescription() {
            return null;
        }

        @Override
        public Object getValue() {
            return customDataMap.get(key);
        }

        @Override
        public void setValue(Object value) {
            customDataMap.put(key, value);
        }
    }

    public PropertySheetExample {
        ObservableList<PropertySheet.Item> list = FXCollections.observableArrayList();
        for (String key : customDataMap.keySet())
            list.add(new CustomPropertyItem(key));

        PropertySheet propertySheet = new PropertySheet(list);
        VBox.setVgrow(propertySheet, Priority.ALWAYS);
        getChildren().add(propertySheet);
    }
}

该行为可以通过两种方式进行进一步扩展。首先,可以使用现有编辑器来处理默认属性编辑器工厂不支持的类型。以下示例设置了新的属性编辑器工厂,它将为List<String>类型创建ChoiceBox。对于其他类型,它将委托编辑器创建给默认工厂。

SimpleObjectProperty<Callback<PropertySheet.Item, PropertyEditor<?>>> propertyEditorFactory = new SimpleObjectProperty<>(this, "propertyEditor", new DefaultPropertyEditorFactory());

propertySheet.setPropertyEditorFactory(new Callback<PropertySheet.Item, PropertyEditor<?>>() {
    @Override
    public PropertyEditor<?> call(PropertySheet.Item param) {
        if(param.getValue() instanceof List) {
            return Editors.createChoiceEditor(param, (List) param.getValue());
        }

        return propertyEditorFactory.get().call(param);
    }
});

最后,我们可以创建自定义编辑器并覆盖PropertySheet.ItemgetPropertyEditorClass()方法以返回自定义编辑器类型。在这种情况下,默认属性编辑器工厂将创建编辑器,无需覆盖工厂方法。


1
你的答案很棒,但我找不到该将此列表放置到哪个属性中。当我的数据被选择时,由于某种原因它又变成了文本。 - Jeredriq Demas
不确定是否因为属性表而发生这种情况 - 如果在创建窗口时看到ComboBox,则应始终保持ComboBox。我通常会扩展PropertySheet类并在构造函数中调用setPropertyEditorFactory()方法。然后我将我的类放入窗口中,就这样。 - user645859

3
即使看了示例并试图找到更多信息,我仍然非常困惑如何在属性表中更改用户输入类型。经过一段时间的努力,我发现答案是相对简单的。
关键是 PropertyEditorFactory,它可以直接使用 setPropertyEditorFactory(Callback<PropertySheet.Item,PropertyEditor<?>> factory) 设置到 PropertySheet 中。在这个回调中,方法返回一个 PropertyEditor 类型,这些类型包含在 Editors 包中。由于该调用提供 PropertySheet.Item 参数,因此您可以检索正在设置的值,例如:在我的示例中,我检查了返回对象的类型以提供相关编辑器。
propertySheet.setPropertyEditorFactory(new Callback<PropertySheet.Item, PropertyEditor<?>>() {
    @Override
    public PropertyEditor<?> call(Item param) {
        if(param.getValue() instanceof String[]) {   
            return Editors.createChoiceEditor(param, choices);
         } else if (param.getValue() instanceof Boolean) {
            return Editors.createCheckEditor(param);
         } else if (param.getValue() instanceof Integer) {
            return Editors.createNumericEditor(param);
         } else {
            return Editors.createTextEditor(param);
         }
     }
});

一旦您覆盖了此编辑器工厂,您必须为每种设置类型提供一个PropertyEditor。例如,如果您仅返回Editors.createNumericEditor(param);但有字符串选项,则会收到异常。另外,请不要覆盖PropertySheet.Item中的getPropertyEditorClass()方法,这是我浪费大量时间的地方。希望这能帮助其他尝试这样做的人!

1
我应该在哪里输入这个,因为每当我从选择编辑器中选择某些内容时,它就会再次变成文本框和字符串。 - Jeredriq Demas

1

我找不到任何关于在PropertySheet中自定义Editor的示例,但我想现在我已经弄清楚了。在我的情况下,我只想使用一个Slider作为Number的编辑器。这可能不太实用,因为你无法看到滑块的值,但我想滑块可以被简单地替换为带有滑块和标签的面板。

首先,我们需要实现Item,这里是稍微修改过的controlsfx-samples版本。 Map已移动到此类中,但可以放置在任何位置。尽管如此,您可能不想使用映射,因为将类别和名称组合在一起已经有些不实用;而且没有为项目创建描述的空间。

public class CustomPropertyItem implements PropertySheet.Item {
    public static Map<String, Object> customDataMap = new LinkedHashMap<>();
    static {
        customDataMap.put("basic.My Text", "Same text"); // Creates a TextField in property sheet
        customDataMap.put("basic.My Date", LocalDate.of(2016, Month.JANUARY, 1)); // Creates a DatePicker
        customDataMap.put("misc.My Enum", SomeEnum.ALPHA); // Creates a ChoiceBox
        customDataMap.put("misc.My Boolean", false); // Creates a CheckBox
        customDataMap.put("misc.My Number", 500); // Creates a NumericField
        customDataMap.put("misc.My Color", Color.ALICEBLUE); // Creates a ColorPicker
    }

    private String key;
    private String category, name;

    public CustomPropertyItem(String key) 
    {
        this.key = key;
        String[] skey = key.split("\\.", 2);
        category = skey[0];
        name = skey[1];
    }

    @Override
    public Class<?> getType() {
        return customDataMap.get(key).getClass();
    }

    @Override
    public String getCategory() {
        return category;
    }

    @Override
    public String getName() {
        return name;
    }

    @Override
    public String getDescription() {
        // doesn't really fit into the map
        return null;
    }

    @Override
    public Object getValue() {
        return customDataMap.get(key);
    }

    @Override
    public void setValue(Object value) {
        customDataMap.put(key, value);
    }

    @Override
    public Optional<ObservableValue<? extends Object>> getObservableValue() {
        return Optional.empty();
    }

    @Override
    public Optional<Class<? extends PropertyEditor<?>>> getPropertyEditorClass() {
        // for an item of type number, specify the type of editor to use
        if (Number.class.isAssignableFrom(getType())) return Optional.of(NumberSliderEditor.class);

        // ... return other editors for other types

        return Optional.empty();
    }
}

接下来是PropertyEditor实现,它是一个Node和一组方法,用于将属性项值与控件连接起来。第一个构造函数是实现所必需的,第二个构造函数是必需的,因为方法Editors.createCustomEditor(Item)使用反射查找此构造函数。您不必使用此方法,但默认的PropertyEditorFactory很可能依赖于此。 如果出于某种原因要避免使用反射,则不需要在您的Item中覆盖getPropertyEditorClass(),并且可以使用setPropertyEditorFactory(Callback)在其中创建新的PropertyEditor实例。 请注意,在这个示例中,您根本不需要使用setPropertyEditorFactory(Callback)
public class NumberSliderEditor extends AbstractPropertyEditor<Number, Slider> {

    public NumberSliderEditor(Item property, Slider control) 
    {
        super(property, control);
    }

    public NumberSliderEditor(Item item)
    {
        this(item, new Slider());
    }

    @Override
    public void setValue(Number n) {
        this.getEditor().setValue(n.doubleValue());
    }

    @Override
    protected ObservableValue<Number> getObservableValue() {
        return this.getEditor().valueProperty();
    }

}

从这里开始,您只需创建您的PropertySheet并添加所有映射条目。
PropertySheet propertySheet = new PropertySheet();
for (String key : CustomPropertyItem.customDataMap.keySet()) propertySheet.getItems().add(new CustomPropertyItem(key));

我希望这对任何人都有所帮助,因为似乎没有任何示例展示如何使用自定义的Editor。唯一提到这一点的是Item.getPropertyEditorClass()的javadoc,它有一个默认的接口实现,所以你通常不会查看它。这个答案中说不要查看这个方法的事实也没有帮助 :/

1

最近我一直在使用Javafx和PropertySheet,以下是简单而快速的练习: 首先,我们需要一个模型类来反映GUI:

public class Person {
    int age;
    boolean isLive = true;
    String name = "Yimkong";
    // ... getter and setter method
}

然后是主类:
public class PropertiesSheetTest extends Application {
    public static void main(String[] args) {
        launch(args);
    }

    @Override
    public void start(Stage primaryStage) throws Exception {
        Person bean = new Person();
        ObservableList<PropertySheet.Item> properties = BeanPropertyUtils.getProperties(bean);
        PropertySheet propertySheet = new PropertySheet(properties);
        propertySheet.setSearchBoxVisible(false);
        propertySheet.setModeSwitcherVisible(false);
        DefaultPropertyEditorFactory defaultPropertyEditorFactory = new DefaultPropertyEditorFactory();
        propertySheet.setPropertyEditorFactory(new Callback<PropertySheet.Item, PropertyEditor<?>>() {
            @Override
            public PropertyEditor<?> call(PropertySheet.Item param) {
                if(param.getName().equals("age")){
                    List<Integer> ageList = new ArrayList<>();
                    ageList.add(3);
                    ageList.add(5);
                    ageList.add(10);
                    return Editors.createChoiceEditor(param,ageList);
                }
                return defaultPropertyEditorFactory.call(param);
            }
        });
        VBox vBox = new VBox(propertySheet);
        Scene scene = new Scene(vBox);
        primaryStage.setScene(scene);
        primaryStage.show();
    }
}

这是结果: result gui 优点:
  • 通过BeanPropertyUtils易于开发,反射到Java Bean
  • 如果我们不希望用户在GUI上更改任何内容,我们可以删除模型类中的某些setter方法
  • 如果我们对默认PropertyEditor不满意,我们可以自己重写。

这基本上满足大多数场景。顺便说一下,它还可以支持模型类中的枚举字段,并使用ChoiceEditor作为默认值。


1
不错的回答。此外,如果您希望模型中的属性更改可观察,则使用JavaFX属性来表示它们,而不是原始类型。 - jewelsea

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接