Search code examples
javaswinguser-interfacejslider

Movable bars with value using java


I want to create a bar with a value. If i move the circle, then the value in the field should change. How can i do this? Here is the screen shot. How can i achieve this?

Something similar to this is also ok. Please help me with this. Thank you in advance :)

enter image description here


Solution

  • SpinSlider may be a useful example.

    Addendum: Here's an example using a suitable format string for JSpinner.NumberEditor.

    Addendum: You can change the color of the slider by overriding paintTrack(), as shown here.

    SpinSlider image

    import java.awt.EventQueue;
    import java.awt.FlowLayout;
    import javax.swing.JFrame;
    import javax.swing.JPanel;
    import javax.swing.JSlider;
    import javax.swing.JSpinner;
    import javax.swing.SpinnerNumberModel;
    import javax.swing.event.ChangeEvent;
    import javax.swing.event.ChangeListener;
    
    /** @see https://stackoverflow.com/questions/6067898 */
    public class SpinSlider extends JPanel {
    
        public static void main(String args[]) {
            EventQueue.invokeLater(new Runnable() {
                @Override
                public void run() {
                    JFrame f = new JFrame("SpinSlider!");
                    f.add(new SpinSlider());
                    f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                    f.pack();
                    f.setVisible(true);
                }
            });
        }
    
        public SpinSlider() {
            this.setLayout(new FlowLayout());
            final JSpinner spinner = new JSpinner();
            final JSlider slider = new JSlider();
            slider.addChangeListener(new ChangeListener() {
                @Override
                public void stateChanged(ChangeEvent e) {
                    JSlider s = (JSlider) e.getSource();
                    spinner.setValue(s.getValue());
                }
            });
            this.add(slider);
            spinner.setModel(new SpinnerNumberModel(50, 0, 100, 1));
            spinner.setEditor(new JSpinner.NumberEditor(spinner, "0'%'"));
            spinner.addChangeListener(new ChangeListener() {
                @Override
                public void stateChanged(ChangeEvent e) {
                    JSpinner s = (JSpinner) e.getSource();
                    slider.setValue((Integer) s.getValue());
                }
            });
            this.add(spinner);
        }
    }