How to hide the knob of jSlider?

Question

I need to customize the knob of JSlider. I need to put my own knob\'s image over default knob of Jslider. The problem is that currently two knobs are coming in response. One my

Answer 1

The UIManager solution only works in the Metal LAF from what I can tell.

If you want to change the behavour of the UI then you need to change the UI. In this case you would need to the BasicSliderUI (or one of its sub classes). Then I believe you would need to override the paintThumb() method.

Answer 2

A solution with a different BasicSliderUI looks like this:

public class SuperSlider extends JSlider {
    public SuperSlider(int min, int max, int value) {
        super(min,max,value);
        setUI(new SuperSliderUI(this));
    }
    private class SuperSliderUI extends BasicSliderUI {
        @Override
        public void paintThumb(Graphics g) {
        }
    }
}

Answer 3

To hide the knob, override the UIManager's Slider.horizontalThumbIcon property with an blank icon, like this:

public static void main(String[] args) throws Exception {

    UIManager.getLookAndFeelDefaults().put("Slider.horizontalThumbIcon",new Icon(){
        @Override
        public int getIconHeight() {
            return 0;
        }
        @Override
        public int getIconWidth() {
            return 0;
        }
        @Override
        public void paintIcon(Component c, Graphics g, int x, int y) {
            //do nothing
        }
    });

    JFrame f = new JFrame();
    JSlider slider = new JSlider(JSlider.HORIZONTAL, 0, 30, 15);
    slider.setMajorTickSpacing(10);
    slider.setMinorTickSpacing(1);
    slider.setPaintTicks(true);
    slider.setPaintLabels(true);

    f.add(slider);
    f.setSize(200,200);
    f.setVisible(true);

}