2

I was trying to create a new UI component for the user to specify an integer value in two ways: using either a scrollbar, or a textfield. I wanted this to be a single UI component from which I can call something like integerField.getValue() and have it return the current integer value represented by the component.

My problem is, a classic cyclical update situation: when the underlying integer value is changed using the scrollbar, the textfield value needs to be updated, which triggers another event that causes the scrollbar to update - cycle complete.

In other words, scrollbar.setValue()->component.setValue()->textField.setText()->component.valueChanged()->component.setValue()->scrollbar.setValue()

Now, I can prevent this by having the first item in this chain setting a boolean flag and the other items in the component checking the flag before responding to a value change event. However, I'm not convinced that's an elegant solution.

Anyone have any better ideas?

Thanks!

anishthecoder
  • 940
  • 6
  • 20
  • 1
    Nit pick, a `JSlider` would be a better choice over `JScrollBar` – MadProgrammer Apr 15 '15 at 02:10
  • Yeah, I actually have another component which uses the JSlider, but having the same issue there =) – anishthecoder Apr 15 '15 at 02:11
  • Without any code to go by, you need to setup a flag, which when set to true, all the other event triggers ignore. You could pipe all the event triggers through a central method which checks the flag state, if it's false, it sets it to true and process the updates, if its already false, the method simply does nothing... – MadProgrammer Apr 15 '15 at 02:12
  • The best solution here may be to look at your control from a user experience perspective. Should there really be two ways to enter the same data? Does your workflow require instant feedback? Can it use a "submit" or "update" button to trigger [re]reading the value set by your slider/text controls? – Freiheit Apr 15 '15 at 02:13
  • @MadProgrammer, that's what I'm doing right now. I wanted to know if there might be a better solution that a flag. – anishthecoder Apr 15 '15 at 02:13
  • 2
    @Freiheit, in the app I'm developing, users have repeated requested both types of control. The value adjustment is sometimes more intuitive using the slider, and sometimes finer control using explicit values is needed. A submit / update button would be cumbersome, because it's a series of values that the user will want to manipulate and have realtime feedback on. – anishthecoder Apr 15 '15 at 02:14
  • 1
    `JSpinner`......? Best of both worlds? – MadProgrammer Apr 15 '15 at 02:15
  • @MadProgrammer the `JSpinner` wouldn't work because it wouldn't give a "tactile" way to make large value changes. – anishthecoder Apr 15 '15 at 02:16
  • @anishthecoder That would depend (but it's your requirements not mine) as you could set the step value to larger values. But if it doesn't work, it doesn't work :) – MadProgrammer Apr 15 '15 at 02:17
  • @MadProgrammer In this situation, the user doesn't have a fixed step value; it needs to be flexible. So with my current requirements, the `JSpinner` wouldn't work =). As an example, think of this component being used to adjust the brightness of an image and how the user would want the component to behave when they manipulate it – anishthecoder Apr 15 '15 at 02:19
  • 1
    Remove and re-add the listeners ... but I think the use of a "control" flag is a lot simpler – MadProgrammer Apr 15 '15 at 02:24
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/75246/discussion-between-anishthecoder-and-madprogrammer). – anishthecoder Apr 15 '15 at 02:25

2 Answers2

1

A technical solution to the problem would be to read your text field and the last update time then your slider and the last update time. On the firing of the event, you would read the most recently updated value and if the values match stop updating and reacting.

Freiheit
  • 8,408
  • 6
  • 59
  • 101
1

SpinSlider, seen here and here, may be a good choice. It combines a JSpinner and a JSlider so that each component's ChangeListener listens to the other's ChangeListener.

image

Community
  • 1
  • 1
trashgod
  • 203,806
  • 29
  • 246
  • 1,045