tags:

views:

223

answers:

2

I need a text field very similar in behavior to Gxt's NumberField. Unfortunately I am not using Gxt in my application and GWT 2.0 does not have a Numeric text field implementation as yet.

So that currently leaves me with an option to simulate a NumberField by filtering out non-numeric keystrokes using a keyboardHandler.

Is this the the best way to approach the problem? Does anyone here have a better solution/approach in mind?

Thanks in advance :)

+2  A: 

Hi Ashwin,

Here you can find the code that I use in one of my classes. The features are much more limited that those of GXT, but should put you in the proper track.

It's a really basic widget, but does what I need to.

public class ValueTextBox extends TextBox {

    private int min = 0;
    private int max = 100;
    private boolean minConstrained = true;
    private boolean maxConstrained = true;
    private int minDigits = 1;
    private int step = 1;

    private KeyUpHandler keyUpHandler = new KeyUpHandler() {

        @Override
        public void onKeyUp(KeyUpEvent event) {
            if (isReadOnly() || !isEnabled()) {
                return;
            }

            int keyCode = event.getNativeEvent().getKeyCode();

            boolean processed = false;

            switch (keyCode) {
            case KeyCodes.KEY_LEFT:
            case KeyCodes.KEY_RIGHT:
            case KeyCodes.KEY_BACKSPACE:
            case KeyCodes.KEY_DELETE:
            case KeyCodes.KEY_TAB:
                if (getText().isEmpty()) {
                    setValue(formatValue(min));
                }
                return;
            case KeyCodes.KEY_UP:
                if (step != 0) {
                    increaseValue();
                    processed = true;
                }
                break;
            case KeyCodes.KEY_DOWN:
                if (step != 0) {
                    decreaseValue();
                    processed = true;
                }
                break;
            }

            if (processed) {
                cancelKey();
            }
        }

    };

    private KeyPressHandler keyPressHandler = new KeyPressHandler() {
        @Override
        public void onKeyPress(KeyPressEvent event) {

            if (isReadOnly() || !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:
                return;
            }

            int index = getCursorPos();
            String previousText = getText();
            String newText;
            if (getSelectionLength() > 0) {
                newText = previousText.substring(0, getCursorPos())
                        + event.getCharCode()
                        + previousText.substring(getCursorPos()
                                + getSelectionLength(), previousText.length());
            } else {
                newText = previousText.substring(0, index)
                        + event.getCharCode()
                        + previousText.substring(index, previousText.length());
            }
            cancelKey();

            setValue(newText, true);
        }
    };

    public ValueTextBox(int value) {
        this(value, 0, 100);
    }

    public ValueTextBox(int value, int min, int max) {
        this(value, min, max, true);
    }

    public ValueTextBox(int value, int min, int max, boolean constrained) {
        this(value, min, max, constrained, constrained);
    }

    public ValueTextBox(int value, int min, int max, boolean minConstrained,
            boolean maxConstrained) {
        super();

        addKeyPressHandler(keyPressHandler);
        addKeyUpHandler(keyUpHandler);

        this.min = min;
        this.max = max;
        this.minConstrained = minConstrained;
        this.maxConstrained = maxConstrained;

        setValue(formatValue(value), false);
        setTextAlignment(TextBoxBase.ALIGN_CENTER);
        setStyleName(Resources.INSTANCE.css().fwFormEntry());
    }

    public void setMinDigits(int minDigits) {
        if (minDigits > 0) {
            this.minDigits = minDigits;

            String value = getText();
            long newValue = parseValue(value);

            setText(formatValue(newValue));
        }
    }

    public void setSteps(int step) {
        this.step = step;
    }

    protected void increaseValue() {
        if (step != 0) {
            String value = getText();
            long newValue = parseValue(value);
            newValue += step;
            if (maxConstrained && (newValue > max)) {
                return;
            }
            setValue(formatValue(newValue));
        }
    }

    protected void decreaseValue() {
        if (step != 0) {
            String value = getText();
            long newValue = parseValue(value);
            newValue -= step;
            if (minConstrained && (newValue < min)) {
                return;
            }
            setValue(formatValue(newValue));
        }
    }

    /**
     * @param value
     *            the value to format
     * @return the formatted value
     */
    protected String formatValue(long value) {
        String newValue = String.valueOf(value);

        if (minDigits > newValue.length()) {
            String leading = StringUtils.repeat("0", (minDigits - newValue
                    .length()));
            newValue = leading + newValue;
        }

        return newValue;
    }

    @Override
    public void setValue(String value) {
        setValue(value, false);
    }

    @Override
    public void setValue(String value, boolean fireEvents) {
        try {
            long newValue = parseValue(value);
            if ((maxConstrained && (newValue > max))
                    || (minConstrained && (newValue < min))) {
                return;
            }
            String prevText = getValue();
            super.setText(formatValue(newValue));
            if (fireEvents) {
                ValueChangeEvent.fireIfNotEqual(this, getValue(), prevText);
            }
        } catch (Exception ex) {
            // Do Nothing
            System.out.println(ex.getMessage());
        }
    }

    /**
     * @param value
     *            the value to parse
     * @return the parsed value
     */
    protected long parseValue(String value) {
        return Long.valueOf(value);
    }
}
Carlos Tasada
Thanks Carlos,I had implemented my version on NumberField along similar lines entirely in KeyPressHandler since I didn't need the keyUp and KeyDown - spinner like feature. I specially like your formatValue technique, since it also subtly conveys the max limit of the field - planning to borrow your idea ;) I shall post my version as soon as I get to my development workstation.Thanks :)
Ashwin Prabhu
+2  A: 

Here is my implementation of NumberField. Very similar in functionality to Carlos's version, but for decimal support and non-numeric key filtering.

public class NumberBox extends TextBox

{ private boolean isDecimal = false;

public NumberBox( )
{
}

public boolean isDecimal( )
{
    return isDecimal;
}

public void setDecimal( boolean isDecimal )
{
    this.isDecimal = isDecimal;
}

public Integer getIntegerValue( )
{
    return ( StringUtil.isEmpty( getSanitizedValue( ) ) ) ? null : Integer.parseInt( getSanitizedValue( ) );
}

@Override
protected void initialize( )
{
    super.initialize( );
    addStyleName( "number" );

    this.addKeyPressHandler( new KeyPressHandler( )
    {
        public void onKeyPress( KeyPressEvent event )
        {
            if ( !isEnabled( ) || isReadOnly( ) )
                return;

            int keyCode = event.getNativeEvent( ).getKeyCode( );

            // allow special keys
            if ( ( keyCode == KeyCodes.KEY_BACKSPACE )
                    || ( keyCode == KeyCodes.KEY_DELETE )
                    || ( keyCode == KeyCodes.KEY_ENTER ) || ( keyCode == KeyCodes.KEY_ESCAPE ) || ( keyCode == KeyCodes.KEY_RIGHT )
                    || ( keyCode == KeyCodes.KEY_LEFT ) || ( keyCode == KeyCodes.KEY_TAB ) )
                return;

            // check for decimal '.'
            if ( isDecimal( ) && '.' == (char)keyCode && !getValue( ).contains( "." ) )
                return;

            // filter out non-digits
            if ( Character.isDigit( charCode ) )
                return;

            cancelKey( );
        }
    } );
}

}


PS: Superclass TextBox is a custom class extending GWT TextBox with some additional application specific features. The method initialize() is basically invoked inside the TextBox constructor, and getSanitizedValue does some basic sanity checks with trimming.

Ashwin Prabhu