Changing the thumb color and background color of a JScrollPane?

Question

I am having trouble styling a JScrollPane. I just want to be able to change the color of both the thumb and the background (and also remove the increase/decrease buttons). So far I have tried the following:

    this.setBackground(new Color(0,0,0));
    this.viewport.setBackground(new Color(0,0,0));
    this.getViewport().setBackground(Color.BLACK);
    this.setOpaque(false);
    this.getVerticalScrollBar().setUI(new BasicScrollBarUI()
    {   
        @Override
        protected JButton createDecreaseButton(int orientation) {
            return createZeroButton();
        }

        @Override    
        protected JButton createIncreaseButton(int orientation) {
              return createZeroButton();
        }
        @Override 
        protected void configureScrollBarColors(){

        }

    });

    this.getHorizontalScrollBar().setUI(new BasicScrollBarUI()
    {   
        @Override
        protected JButton createDecreaseButton(int orientation) {
            return createZeroButton();
        }

        @Override    
        protected JButton createIncreaseButton(int orientation) {
              return createZeroButton();
        }


    });
}
private JButton createZeroButton() {
    JButton jbutton = new JButton();
    jbutton.setPreferredSize(new Dimension(0, 0));
    jbutton.setMinimumSize(new Dimension(0, 0));
    jbutton.setMaximumSize(new Dimension(0, 0));
    return jbutton;
}

Also

   UIManager.put("ScrollBar.trackHighlightForeground", (new Color(57,57,57))); 
    UIManager.put("scrollbar", (new Color(57,57,57))); 
    UIManager.put("ScrollBar.thumb", new ColorUIResource(new Color(57,57,57))); 
    UIManager.put("ScrollBar.thumbHeight", 2); 
    UIManager.put("ScrollBar.background", (new Color(57,57,57)));
    UIManager.put("ScrollBar.thumbDarkShadow", new ColorUIResource(new Color(57,57,57)));
    UIManager.put("ScrollBar.thumbShadow", new ColorUIResource(new Color(57,57,57)));
    UIManager.put("ScrollBar.thumbHighlight", new ColorUIResource(new Color(57,57,57)));
    UIManager.put("ScrollBar.trackForeground", new ColorUIResource(new Color(57,57,57)));
    UIManager.put("ScrollBar.trackHighlight", new ColorUIResource(new Color(57,57,57)));
    UIManager.put("ScrollBar.foreground", new ColorUIResource(new Color(57,57,57)));
    UIManager.put("ScrollBar.shadow", new ColorUIResource(new Color(57,57,57)));
    UIManager.put("ScrollBar.highlight", new ColorUIResource(new Color(57,57,57)));

With all of the above code I get a darkened thumb with a white background. Funnily enough if I remove the setUI functions, I get a default thumb with a darkened background..

Any ideas?

Thanks

---

SOLVED******

---

the configureScrollBarColors function above can be used in the following way:

 @Override 
        protected void configureScrollBarColors(){
            this.thumbColor = Color.GREEN;
        }

That changes the color of the thumb to green.

Answer 1

Just in case someone out there is still falling on this thread looking for help:

The following line can be used to change to look of your scrollbar. The fields surrounded by "_" characters can be changed (key and COLOR).

UIManager.put("ScrollBar._key_", new ColorUIResource(_COLOR_));

The most relevant keys for changing the color of your bar are:

• thumb (General color of thumb)
• thumbDarkShadow (Remaining shadowed part of thumb)
• thumbShadow (Essentially a border for the thumb which is split in half with highlight)
• thumbHighlight (Second half of said border kind of)
• track (background)

---

So an example would be:

UIManager.put("ScrollBar.thumb", new ColorUIResource(Color.black));

This would make the main part of the thumb black.

If you are going for a full single color thumb then use all keys except track and set them to the same color.

If you are going for an outline set the first two as color1 and the second two as color2.

I fell on this while trying to ameliorate my own GUI and after some minor tweaking thought I'd share my findings.

For more keys click me!