How to remove the Border of jSlider

1.6k views Asked by At

I`ve customized an jSlider facing a little problem-

After changing values, on my custom jSlider is a border shown. Sorry, I´ve made pictures but Iàm not allowed to post it. The not customized jSlider do not show such border after click on it.

Is there an Method i have to Override to get rid of this border? Thank you in advance!

Sorry for my english! Hope anyone can help me! This is my Customized UI:

    public class RedGreenSliderUI extends BasicSliderUI{
    Image knobImage ;
    private BasicStroke stroke = new BasicStroke(1f, BasicStroke.CAP_ROUND, 
            BasicStroke.JOIN_ROUND, 0f, new float[]{1f, 2f}, 0f);
    private static final float[] fractions = {0.0f, 0.5f};   
  private static final Color[] fillColors = {   
   /* new Color(0x2687AE),*/ 
   /* new Color(0x1658AE)*/ 
      new Color(0xc8041b),
      new Color(0xc8041b)
  };   
  private static final Color[] backColors = {   
    new Color(0x04c814),   
    new Color(0x04c814)   
  };   

    private static final Paint hFillGradient = new LinearGradientPaint(0, 0, 0, 11,   
          fractions, fillColors, MultipleGradientPaint.CycleMethod.NO_CYCLE);   
  private static final Paint hBackGradient = new LinearGradientPaint(0, 0, 0, 11,   
          fractions, backColors, MultipleGradientPaint.CycleMethod.NO_CYCLE);   
  private static final Paint vFillGradient = new LinearGradientPaint(0, 0, 11, 0,   
          fractions, fillColors, MultipleGradientPaint.CycleMethod.NO_CYCLE);   
  private static final Paint vBackGradient = new LinearGradientPaint(0, 0, 11, 0,   
          fractions, backColors, MultipleGradientPaint.CycleMethod.NO_CYCLE);   
  private static final Stroke roundEndStroke = new BasicStroke(5,   
          BasicStroke.CAP_BUTT, BasicStroke.JOIN_ROUND);   

        public RedGreenSliderUI( JSlider aSlider ) {

            super( aSlider );

            try {

                this.knobImage = ImageIO.read(getClass().getResource("ringelblumensalbe-             Updater-Grafiken/tongThumb01.png")); //.getClassLoader()


            } catch ( IOException e ) {

                e.printStackTrace();
            }
        }
        public void paintThumb(Graphics g)  {        

            g.drawImage( this.knobImage, thumbRect.x, thumbRect.y, 15, 30, null );

        }
         @Override
    protected Dimension getThumbSize() {
        return new Dimension(15, 30);
    }

         @Override
    protected Color getHighlightColor() {
             return new Color(98, 94, 0);
         }

          public void paintTrack(Graphics g) {   
    Graphics2D g2 = (Graphics2D) g;   
    g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING,           RenderingHints.VALUE_ANTIALIAS_ON);   

    if (slider.getOrientation() == JSlider.HORIZONTAL) {   
      int cy = (trackRect.height / 2) - 2;   
      g.translate(trackRect.x, trackRect.y + cy);   

      g2.setStroke(roundEndStroke);   
      g2.setPaint(hBackGradient);   
      g2.drawLine(thumbRect.x, 2, trackRect.width, 2);   
      g2.setPaint(hFillGradient);   
      g2.drawLine(0, 2, thumbRect.x, 2);   

      g.translate(-trackRect.x, -(trackRect.y + cy));   
    } else {   
      int cx = (trackRect.width / 2) - 2;   
      g.translate(trackRect.x + cx, trackRect.y);   

      g2.setStroke(roundEndStroke);   
      g2.setPaint(vBackGradient);   
      g2.drawLine(2, 0, 2, thumbRect.y);   
      g2.setPaint(vFillGradient);   
      g2.drawLine(2, thumbRect.y, 2, trackRect.height);   

      g.translate(-(trackRect.x + cx), -trackRect.y);   
    }   
  }  

EDIT: I`ve got it. The answer is to override getFocusColor().

@Override
     protected Color getFocusColor(){
         return new Color(255,255,255);
     }
3

There are 3 answers

2
Kishori On

You can try using border:0px; property for particular class where border is shown.

1
trashgod On

The focus rectangle is renderered by the slider's UI delegate, typically based on BasicSliderUI. Although I can't advocate defeating the focus indicator, you can try one of the following:

  • Use the UIManager to set the "Slider.focus" color to match the "Slider.background".

  • Override the paintFocus() method to do nothing; a related example is seen here.

0
Lorne K On

Trashgod's answer works nicely. For noob's like me the syntax is;

UIManager.put("Slider.focus", UIManager.get("Slider.background"));