Question

我正在使用Vaadin文本字段，我想将其限制为仅支持数字。我试图覆盖setValue()并在不调用super的情况下返回。 setValue()如果文字不是数字。但它似乎没有起作用。我怎么能纠正这个？我正在使用Vaadin 7.我认为它也不支持NumberField。

Answer 1

如果我理解你的问题是正确的，你想要一个忽略所有非数字输入的字段，而不仅仅是将该字段标记为无效。 Vaadins体系结构的设计是浏览器中的每个字段都在服务器上表示。在我看来，实现这一目标的最简洁方法是拥有一个允许输入字母和其他错误字符的浏览器字段。我无法在Vaadin 7中找到这样一个字段.Vaaadin 6似乎有一个名为Number Field的附加组件，但我没有测试它。
您有多种选择：

将此附加组件移植到vaadin 7或要求作者执行此操作
编写自己的字段。也许扩展VTextField和TextFieldConnector
在服务器端执行所有操作并接受延迟和流量（恕我直言）

由于我认为选项3 不的方式，我可能不应该显示此代码，但它是实现此功能的最快方式。

public class IntegerField extends TextField implements TextChangeListener {
String lastValue;

public IntegerField() {
    setImmediate(true);
    setTextChangeEventMode(TextChangeEventMode.EAGER);
    addTextChangeListener(this);
}

@Override
public void textChange(TextChangeEvent event) {
    String text = event.getText();
    try {
        new Integer(text);
        lastValue = text;
    } catch (NumberFormatException e) {
        setValue(lastValue);
    }
}
}

Answer 2

Vaadin 7允许扩展他们内置的小部件（如果你想对此有更多的了解我真的推荐这个post）这里有一个使用该机制的解决方案。

它由两个类组成：连接器和扩展

扩展程序

package com.infosystem.widgets.vaadin;
import com.vaadin.server.AbstractClientConnector;
import com.vaadin.server.AbstractExtension;
import com.vaadin.ui.TextField;

public class NumberField extends AbstractExtension {

        public static void extend(TextField field) {
            new NumberField().extend((AbstractClientConnector) field);
        }
}

连接器：

package com.infosystem.widgets.vaadin.client.numberField;
import com.google.gwt.event.dom.client.KeyCodes;
import com.google.gwt.event.dom.client.KeyPressEvent;
import com.google.gwt.event.dom.client.KeyPressHandler;
import com.infosystem.widgets.vaadin.NumberField;
import com.vaadin.client.ComponentConnector;
import com.vaadin.client.ServerConnector;
import com.vaadin.client.extensions.AbstractExtensionConnector;
import com.vaadin.client.ui.VTextField;
import com.vaadin.shared.ui.Connect;

@Connect(NumberField.class)
public class NumberFieldConnector extends AbstractExtensionConnector {
            private static final long serialVersionUID = -737765038361894693L;

private VTextField textField;
private KeyPressHandler keyPressHandler = new KeyPressHandler() {
    @Override
    public void onKeyPress(KeyPressEvent event) {
        if (textField.isReadOnly() || !textField.isEnabled()) {
            return;
        }
        int keyCode = event.getNativeEvent().getKeyCode();
        switch (keyCode) {
        case KeyCodes.KEY_LEFT:
        case KeyCodes.KEY_RIGHT:
        case KeyCodes.KEY_BACKSPACE:
        case KeyCodes.KEY_DELETE:
        case KeyCodes.KEY_TAB:
        case KeyCodes.KEY_UP:
        case KeyCodes.KEY_DOWN:
        case KeyCodes.KEY_SHIFT:
            return;
        }
        if (!isValueValid(event)) {
            textField.cancelKey();
        }
    }
};

@Override
protected void extend(ServerConnector target) {
    textField = (VTextField) ((ComponentConnector) target).getWidget();
    textField.addKeyPressHandler(keyPressHandler);
}

private boolean isValueValid(KeyPressEvent event) {
    String newText = getFieldValueAsItWouldBeAfterKeyPress(event.getCharCode());
    try {
        parseValue(newText);
        return true;
    } catch (Exception e) {
        return false;
    }
}

protected long parseValue(String value) {
    return Long.valueOf(value);
}

private String getFieldValueAsItWouldBeAfterKeyPress(char charCode) {
    int index = textField.getCursorPos();
    String previousText = textField.getText();
    StringBuffer buffer = new StringBuffer();
    buffer.append(previousText.substring(0, index));
    buffer.append(charCode);
    if (textField.getSelectionLength() > 0) {
        buffer.append(previousText.substring(index + textField.getSelectionLength(),
                previousText.length()));
    } else {
        buffer.append(previousText.substring(index, previousText.length()));
    }
    return buffer.toString();
}
}

要使用上面的代码，您需要将其添加到当前的窗口小部件集。之后使用它如下：

TextField field = new TextField();
NumberField.extend(field);

Answer 3

TextField是一个始终具有String类型值的组件。将另一种类型的属性绑定到文本字段时，如果支持两种类型之间的转换，则会自动转换该值。

public class MyBean {
    private int value;

    public int getValue() {
        return value;
    }

    public void setValue(int integer) {
        value = integer;
    }
}

BeanItem构建的MyBean中名为“value”的属性属于Integer类型。将属性绑定到TextField将自动使无法转换为整数的文本的验证失败。

final MyBean myBean = new MyBean();

BeanItem<MyBean> beanItem = new BeanItem<MyBean>(myBean);

final Property<Integer> integerProperty = (Property<Integer>) beanItem
        .getItemProperty("value");
final TextField textField = new TextField("Text field", integerProperty);

Button submitButton = new Button("Submit value", new ClickListener() {
    public void buttonClick(ClickEvent event) {
        String uiValue = textField.getValue();
        Integer propertyValue = integerProperty.getValue();
        int dataModelValue = myBean.getValue();

        Notification.show("UI value (String): " + uiValue
                + "\nProperty value (Integer): " + propertyValue
                + "\nData model value (int): " + dataModelValue);
     }
});

addComponent(new Label("Text field type: " + textField.getType()));
addComponent(new Label("Text field type: " + integerProperty.getType()));
addComponent(textField);
addComponent(submitButton);

通过此示例，输入数字并按下按钮会使TextField的值为String，属性值将为Integer，表示相同的值，并且bean中的值将是相同的int。如果是在字段中输入一个字母并按下该按钮，验证将失败。这会导致显示该字段的通知。字段值仍然更新，但属性值和bean值保持为先前的值。

Answer 4

在Vaadin 7中，您可以使用TextField并设置验证器以仅允许数字：

TextField textField;
textField.addValidator(new RegexpValidator("[-]?[0-9]*\\.?,?[0-9]+"), "This is not a number!");

更改正则表达式以满足您的需求。请记住，仍在处理字符串，因此您仍需要转换TextField的返回值：

Long.parseLong(textField.getValue())

Answer 5

这是@raffael回复的更新（2017年，vaadin 8）：

public class DoubleField extends TextField implements ValueChangeListener<String>  {

public String lastValue;

public DoubleField() {
    setValueChangeMode(ValueChangeMode.EAGER);
    addValueChangeListener(this);
    lastValue="";
}

@Override
public void valueChange(ValueChangeEvent<String> event) {
    String text = (String) event.getValue();
    try {
        new Double(text);
        lastValue = text;
    } catch (NumberFormatException e) {
        setValue(lastValue);
    }

}

Answer 6

使用Vaadin 8，您可以使用Binder：

Binder<YouBean> binder = new Binder<>();
binder.forField(textField)
      .withConverter(new StringToIntegerConverter("Must be Integer"))
      .bind(YouBean::getter, YouBean::setter);
binder.setBean(bean);  //optional

Answer 7

目前，

NumberField可用于Vaadin 7和8。

如何创建仅在vaadin中支持数字的文本字段

7 个答案: