SpinnerField [Archive] - Sencha Forum

bartolomiew

15 Dec 2009, 8:09 AM

I need a component acting/looking like a JSpinner in java Swing, so I made it
http://img710.imageshack.us/img710/5339/spinners.png

Here you can find the full eclipse project : http://www.2shared.com/file/10006617/3bc90567/Spinner.html
Real usefull things are :
- war/css/gxt-spinner.css (must be added to you HTML page like gxt-all.css)
- war/images/default/form/spinner_down.gif
- war/images/default/form/spinner_up.gif
- src/com/wcs/client/SpinnerField.java

This version is built with GXT 2.1.0 sources, you're free to use this code. Css file and images are home made but based on existing one in GXT.

varun_tamiri

22 Dec 2009, 9:48 PM

Hi,

Thanks for your work.
Is it possible to post the code as an attachment here in the forum.

Regards,
Varun Tamiri

bartolomiew

23 Dec 2009, 5:29 AM

Shrinked sources attached

varun_tamiri

23 Dec 2009, 6:41 AM

Thank you very much,
But i'm found some errors in the file
SpinnerField.JAVA

ensureVisibilityOnSizing = true; at line 99

} else if (ce.getTarget() == input.dom) { at line 175

el().setStyleName(readOnlyFieldStyle, readOnly); at line 243

protected Size adjustInputSize() { at line 251

input = new El(DOM.createInputText()); at line 358

input.addStyleName(fieldStyle); at line 362

el().appendChild(input.dom); at line 372

if ((y = input.getY()) != spinner_up.getY()) { at line 393

The underline items are the one showing the errors

Regards,
Varun Tamiri

bartolomiew

26 Dec 2009, 4:11 AM

I'm sorry but I do not understand what you mean by errors.
It does not compile?
The spinner is an adaptation of one of the TriggerField GXT 2.1.0, maybe I made some mistakes, feel free to correct them and explain to everyone how.

varun_tamiri

27 Dec 2009, 11:25 PM

i hav some problem with down arrow of the field
it goes up some where in the page and it is not working for any fields(integer,double or disabled).
i'm trying to upload the screenshot but i facing some issue with uploading the image so i'm compressing it and uploading.

Thanks & Regards,
Varun Tamiri

bartolomiew

28 Dec 2009, 12:45 AM

Are you sure you have added gxt-all.css to your HTML page ?

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">




<link type="text/css" rel="stylesheet" href="Spinner.css">
<link rel="stylesheet" type="text/css" href="css/gxt-all.css" />
<link rel="stylesheet" type="text/css" href="css/gxt-spinner.css" />




<title>Spinner Project</title>






<script type="text/javascript" language="javascript" src="spinner/spinner.nocache.js"></script>
</head>






<body>


<iframe src="javascript:''" id="__gwt_historyFrame" tabIndex='-1' style="position:absolute;width:0;height:0;border:0"></iframe>

</body>
</html>

You should try to download the full project

varun_tamiri

28 Dec 2009, 1:31 AM

s I added the gxt-all.css to my html

varun_tamiri

4 Jan 2010, 4:15 AM

s i got when i dnld'd full project

Thanks,
Varun Tamiri

gaspo100

10 Feb 2010, 3:48 AM

Thanks for the nice component.
It work fine in my program, however, one thing I could not get working is to respond to some of the inherited events. For example Events.Change or Events.TriggerClick.

Here is the code sample:

SpinnerField seqSpinner = new SpinnerField();
seqSpinner.setSize("65px", "22px");
seqSpinner.setStepValue(Integer.valueOf(1));
seqSpinner.setMinValue(1);
seqSpinner.setMaxValue(5);
seqSpinner.setEditable(false);
seqSpinner.setPropertyEditorType(Integer.class);
seqSpinner.setFormat(NumberFormat.getFormat("0"));
seqSpinner.addListener(Events.Change, new Listener<FieldEvent>() {
@Override
public void handleEvent(FieldEvent be) {
doSomething();
}
});
add(seqSpinner, new AbsoluteData(123, 45));

micgala

10 Feb 2010, 4:30 AM

Thanks for the nice component.
It work fine in my program, however, one thing I could not get working is to respond to some of the inherited events. For example Events.Change or Events.TriggerClick.

Is your field added to a FormPanel?

gaspo100

12 Feb 2010, 1:42 AM

No, I add it into ContentPanel with AbsoluteLayout.

micgala

12 Feb 2010, 1:50 AM

Try wrapping then to a FormPanel.
This is needed for Field events to work properly.

Regards,
Michel.

Atum

1 Mar 2010, 7:15 AM

Thanks for the nice component!

please tell me how to create a Template for Date and Time SpinnerField ?

like HH:mm
or
DD:MM:YYYY ?

jgarrido

14 Apr 2010, 11:49 AM

i've found a litte ¿bug?

When readOnly is true, spinner stills change the value of property in key events.

Mi solution:
1º setHideTrigger(true)
2º inspect readOnly in onSpinnerUpClick and onSpinnerDownClick

the result:

protected void onSpinnerUpClick(ComponentEvent ce) {
if (getValue() == null || isValid() == false) {
return;
}
Number newValue = getValue().doubleValue() + getStepValue().doubleValue();
if (newValue.doubleValue() <= getMaxValue().doubleValue() && !readOnly) {
setValue(newValue);
fireEvent(SpinnerUpClick, ce);
}
}

protected void onSpinnerDownClick(ComponentEvent ce) {
if (getValue() == null || isValid() == false) {
return;
}
Number newValue = getValue().doubleValue() - getStepValue().doubleValue();
if (newValue.doubleValue() >= getMinValue().doubleValue() && !readOnly) {
setValue(newValue);
fireEvent(SpinnerDownClick, ce);
}
}

Suggestions:
i think it would be more visual to a new arrow to indicate the readOnly state.
like atum, be nice if Spinner dismiss TimeField (with his combo behavior)

Thaks a lot for this field, i love it!!!

Ixtinkt

9 Aug 2011, 1:01 AM

How to set new value of spinnerfield. method setValue do not work!

Zuhaib Sarfraz

16 Nov 2011, 1:56 PM

Thanks man this is what i was searching for :) pleased to get it free :) Cheers