Applying stylesheet on QScrollArea making horizontal scrollbar disappear but working perfectly for vertical scrollbar



  • I am trying to apply some style-sheet for scrollbars of QScrollArea and my style sheet as follows.

    @QScrollBar:vertical {

    border-color: rgb(227, 227, 227);
    border-width: 1px;
    border-style: solid;

    background-color: rgb(240, 240, 240);
    width: 15px;
    margin: 21px 0 21px 0;
    }

    QScrollBar::handle:vertical {

    background-color: rgb(200, 200, 200);
    min-height: 25px;

    }

    QScrollBar::add-line:vertical {
    border: 1px solid grey;
    background-color: rgb(241, 241, 241);
    height: 20px;
    subcontrol-position: bottom;
    subcontrol-origin: margin;
    }

    QScrollBar::sub-line:vertical {
    border: 1px solid grey;
    background-color: rgb(241, 241, 241);
    height: 20px;
    subcontrol-position: top;
    subcontrol-origin: margin;
    }

    QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {
    background: none;
    }

    QScrollBar::up-arrow:vertical
    {
    image: url(:/BarIcon/Icons/uparrow.png);
    }

    QScrollBar::down-arrow:vertical
    {
    image: url(:/BarIcon/Icons/downarrow.png);
    }

    QScrollBar:horizontal {
    border-color: rgb(227, 227, 227);
    border-width: 1px;
    border-style: solid;
    background-color: rgb(240, 240, 240);
    width: 15px;
    margin: 0px 21px 0 21px;
    }

    QScrollBar::handle:horizontal {
    background-color: rgb(200, 200, 200);
    min-height: 25px;
    }
    QScrollBar::add-line:horizontal {
    border: 1px solid grey;
    background-color: rgb(241, 241, 241);
    width: 20px;
    subcontrol-position: right;
    subcontrol-origin: margin;
    }

    QScrollBar::sub-line:horizontal {
    border: 1px solid grey;
    background-color: rgb(241, 241, 241);
    width: 20px;
    subcontrol-position: left;
    subcontrol-origin: margin;
    }

    QScrollBar:left-arrow:horizontal
    {
    image: url(:/BarIcon/Icons/leftarrow.png);
    }

    QScrollBar::right-arrow:horizontal
    {
    image: url(:/BarIcon/Icons/rightarrow.png);
    }

    QScrollBar::add-page:horizontal, QScrollBar::sub-page:horizontal {
    background: none;
    }@

    This stylesheet perfectly does what it was supposed to for vertical scrollbar but with presence of any single stylesheet related to QScrollBar:horizontal, the bar just disappears.

    Please can anyone point out my flaw and what should I do?

    Notes: The styleSheet have been applied on QScrollArea object by using Change styleSheet option of Qt Designer. And I am using Qt Creator 3.1.1 based on Qt 5.2.1.



  • @QScrollBar:horizontal
    {
    ...
    ...
    ...
    ...
    width: 15px;
    ...
    }@

    should be height: 15px;

    @QScrollBar::handle:horizontal
    {
    ...
    min-height: 25px;
    }@

    should be min-width: 25px;

    If you go to Help and do a search for style sheets the second item listed is 'Qt Style Sheet Reference'. Go there and you will find an example which should be useful.

    Hope this helps.



  • Thanks... a foul mistake :(


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.