Search code examples
qtqtstylesheetsqtwidgets

How to remove QScrollbar scroll buttons?


I want to style QScrollBar to look like this without the indicators in the end

I tried with the stylesheets:

QScrollBar::up-arrow:vertical, QScrollBar::down-vertical  
{  
      border: none;  
      background: none;  
      color: none;  
}

But this hides the indicator arrow not the 2 buttons at the end
This is what I have when I used the above style


Solution

  • You can use something like this:

    QScrollBar:vertical {
    background: #2f2f2f;
    width: 15px;
    margin: 0;
    }
    
    QScrollBar::handle:vertical {
    background: #5b5b5b;
    }
    
    QScrollBar::add-line:vertical {
    height: 0px;
    }
    
    QScrollBar::sub-line:vertical {
    height: 0px;
    }
    
    QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {
    height: 0px;
    }
    

    The classes you were looking for are add-line, sub-line, add-page and sub-page. Since they support the box-model, you can just set their height to 0 to make them disappear.

    The code above was tested with Qt 5.9.