Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. General and Desktop
  4. QTableView ... Qt Creator stylesheet
Forum Updated to NodeBB v4.3 + New Features

QTableView ... Qt Creator stylesheet

Scheduled Pinned Locked Moved Solved General and Desktop
16 Posts 3 Posters 13.7k Views 2 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • gfxxG gfxx

    ok ... ok ... but if I want to customize QTableView with verticalScrollBarr alwaysOn how do I customize the scroll bar?

    ui->mytabWidget->setStylesheet("QTableView{border: /* some definition*/;}")
    ui->mytabWidget->setStylesheet("QScrollBar:vertical { border: 2px solid grey; background: #32CC99; height: 15px; margin: 0px 20px 0 20px; }"));
    

    these is right????

    regards
    Giorgio

    mrjjM Offline
    mrjjM Offline
    mrjj
    Lifetime Qt Champion
    wrote on last edited by mrjj
    #5

    @gfxx
    Hi
    Yes except it has to be inside same string.
    The code you show set stylesheet twice and only last one counts.
    alt text

    From code you can do

     QString style = R"(
                    QScrollBar:vertical {
                     background: #32CC99;
                    }
                    QScrollBar:horizontal {
                     background: #FF0000;
                    }
                   )";
    
    ui->tableWidget->setStyleSheet(style);
    

    Note that your sample says mytabWidget->setStylesheet("QTableView
    Make sure to use right type for the actual one you will use.

    1 Reply Last reply
    1
    • gfxxG Offline
      gfxxG Offline
      gfxx
      wrote on last edited by
      #6

      I've try these with some success ...

      0_1511775029328_QTableVidget.png

      but not success about ```

      QScrollBar:vertical::up-arrow{image:/myimage up path/; with:40px; height:40px;}
      QScrollBar:vertical::down-arrow{image:/myimage down path/; with:40px; height:40px;}
      QScrollBar:vertical::handle{ border: 3px solid #5E749C;text-align: top;padding: 4px;border-radius: 5px; border-bottom-left-radius: 5px;background: blu;with:40px; height:80px;}

      
      the slider Become too little (beacuse I have meny row in table) and seems not bring the "height" sub control measure ...
      
      regards
      Giorgio

      bkt

      1 Reply Last reply
      0
      • gfxxG Offline
        gfxxG Offline
        gfxx
        wrote on last edited by
        #7

        I try these .... my image is 24*24px ...

        0_1511778493673_QTableView-1.png

        0_1511778511459_the-result.png

        Obviusly, because not so familiar with css subcontrol I makesome error but I'm unable see where and what.

        regards and thanks for the help.

        giorgio

        bkt

        1 Reply Last reply
        0
        • mrjjM Offline
          mrjjM Offline
          mrjj
          Lifetime Qt Champion
          wrote on last edited by
          #8

          Hi
          Are you sure it can load the images ?

          Maybe this can be inspiration
          https://stackoverflow.com/questions/12438095/qt-vertical-scroll-bar-stylesheets

          gfxxG 2 Replies Last reply
          0
          • mrjjM mrjj

            Hi
            Are you sure it can load the images ?

            Maybe this can be inspiration
            https://stackoverflow.com/questions/12438095/qt-vertical-scroll-bar-stylesheets

            gfxxG Offline
            gfxxG Offline
            gfxx
            wrote on last edited by
            #9

            @mrjj I'm sure .... try to play aroud your linked snippets ....

            thanks ... i hope can able to post a solution in a small time.

            giorgio

            bkt

            1 Reply Last reply
            0
            • mrjjM mrjj

              Hi
              Are you sure it can load the images ?

              Maybe this can be inspiration
              https://stackoverflow.com/questions/12438095/qt-vertical-scroll-bar-stylesheets

              gfxxG Offline
              gfxxG Offline
              gfxx
              wrote on last edited by gfxx
              #10

              @mrjj these code have somethings that I not understand:

              QTableView {border: 3px solid #5E749C;text-align: top;padding: 4px;border-radius: 7px;border-bottom-left-radius: 7px;background: QLinearGradient( x1: 0, y1: 0, x2: 1, y2: 0,stop: 0 #fff, stop: 1 #eee,stop: 0.5 #ddd,stop: 1 #eee );width: 15px;}
              QTableView::item:focus{selection-background-color: yellow;}
              QScrollBar:vertical{ width: 35px; background: none; /* only these sort effect about width ...*/}
              QScrollBar::handle:vertical{ border: 3px solid #5E749C;text-align: top;padding: 4px;border-radius: 5px; border-bottom-left-radius: 5px;background: QLinearGradient( x1: 0, y1: 0, x2: 1, y2: 0,stop: 0 #fff, stop: 1 #eee,stop: 0.5 #ddd,stop: 1 #eee ); width: 25px; min-height: 20px; max-height: 25px; /*these sort no effect*/ }
              QScrollBar::add-page:vertical {border: 3px solid red;text-align: top;padding: 4px;border-radius: 5px; border-bottom-left-radius: 5px;background:  red; /* adding width: xx px; sorting no effect .. why? */}
              QScrollBar::sub-page:vertical {border: 3px solid green;text-align: top;padding: 4px;border-radius: 5px; border-bottom-left-radius: 5px;background:  green; /* adding width: xx px; sorting no effect .. why? */ }
              

              the result ......

              bkt

              gfxxG 1 Reply Last reply
              0
              • gfxxG gfxx

                @mrjj these code have somethings that I not understand:

                QTableView {border: 3px solid #5E749C;text-align: top;padding: 4px;border-radius: 7px;border-bottom-left-radius: 7px;background: QLinearGradient( x1: 0, y1: 0, x2: 1, y2: 0,stop: 0 #fff, stop: 1 #eee,stop: 0.5 #ddd,stop: 1 #eee );width: 15px;}
                QTableView::item:focus{selection-background-color: yellow;}
                QScrollBar:vertical{ width: 35px; background: none; /* only these sort effect about width ...*/}
                QScrollBar::handle:vertical{ border: 3px solid #5E749C;text-align: top;padding: 4px;border-radius: 5px; border-bottom-left-radius: 5px;background: QLinearGradient( x1: 0, y1: 0, x2: 1, y2: 0,stop: 0 #fff, stop: 1 #eee,stop: 0.5 #ddd,stop: 1 #eee ); width: 25px; min-height: 20px; max-height: 25px; /*these sort no effect*/ }
                QScrollBar::add-page:vertical {border: 3px solid red;text-align: top;padding: 4px;border-radius: 5px; border-bottom-left-radius: 5px;background:  red; /* adding width: xx px; sorting no effect .. why? */}
                QScrollBar::sub-page:vertical {border: 3px solid green;text-align: top;padding: 4px;border-radius: 5px; border-bottom-left-radius: 5px;background:  green; /* adding width: xx px; sorting no effect .. why? */ }
                

                the result ......

                gfxxG Offline
                gfxxG Offline
                gfxx
                wrote on last edited by
                #11

                0_1511875085899_QScrollBar-125.png

                bkt

                1 Reply Last reply
                0
                • SGaistS SGaist

                  Hi,

                  No, the second call will overwrite the style sheet from the first call. You should put the complete style sheet in one string.

                  gfxxG Offline
                  gfxxG Offline
                  gfxx
                  wrote on last edited by
                  #12

                  @SGaist ok and if use QT Creator stylesheet property windows is the same?

                  regards
                  giorgio

                  bkt

                  1 Reply Last reply
                  0
                  • mrjjM Offline
                    mrjjM Offline
                    mrjj
                    Lifetime Qt Champion
                    wrote on last edited by
                    #13

                    Hi
                    Not sure all sub controls ( like QScrollBar::add-page:vertical ) supports
                    width.

                    You can see where what they have used
                    http://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qscrollbar

                    gfxxG 2 Replies Last reply
                    1
                    • mrjjM mrjj

                      Hi
                      Not sure all sub controls ( like QScrollBar::add-page:vertical ) supports
                      width.

                      You can see where what they have used
                      http://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qscrollbar

                      gfxxG Offline
                      gfxxG Offline
                      gfxx
                      wrote on last edited by
                      #14

                      @mrjj said in QTableView ... Qt Creator stylesheet:

                      You can see where what they have used

                      thanks
                      Girgio

                      bkt

                      1 Reply Last reply
                      1
                      • mrjjM mrjj

                        Hi
                        Not sure all sub controls ( like QScrollBar::add-page:vertical ) supports
                        width.

                        You can see where what they have used
                        http://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qscrollbar

                        gfxxG Offline
                        gfxxG Offline
                        gfxx
                        wrote on last edited by
                        #15

                        @mrjj finally I solve my issue in these way;

                        QTableView {border: 3px solid #5E749C;text-align: top;padding: 4px;border-radius: 7px;border-bottom-left-radius: 7px;background: QLinearGradient( x1: 0, y1: 0, x2: 1, y2: 0,stop: 0 #fff, stop: 1 #eee,stop: 0.5 #ddd,stop: 1 #eee );width: 15px;}
                        QTableView::item:focus{selection-background-color: yellow;}
                        
                        
                         QScrollBar{
                                 background: QLinearGradient( x1: 0, y1: 0, x2: 1, y2: 0,stop: 0 #fff, stop: 1 #eee,stop: 0.5 #ddd,stop: 1 #eee );
                         }
                        
                         QScrollBar:vertical {
                             border: 3px solid #5E749C;
                             padding: 4px;
                             border-radius: 7px;
                             border-bottom-left-radius: 7px;
                             background: QLinearGradient( x1: 0, y1: 0, x2: 1, y2: 0,stop: 0 #fff, stop: 1 #eee,stop: 0.5 #ddd,stop: 1 #eee );
                             width: 45px;
                             margin: 48px 0 48px 0;
                         }
                        
                         QScrollBar::handle:vertical {
                             background: dark blue;
                             border: 3px solid #5E749C;
                             padding: 0px;
                             border-radius: 7px;
                             border-bottom-left-radius: 7px;
                             min-height: 40px;
                         }
                         QScrollBar::add-line:vertical {
                             background: dark blue;
                             border: 3px solid #5E749C;
                             padding: 0px;
                             border-radius: 7px;
                             border-bottom-left-radius: 7px;
                             height: 40px;
                             subcontrol-position: bottom;
                             subcontrol-origin: margin;
                         }
                        
                         QScrollBar::sub-line:vertical {
                             background: dark blue;
                             border: 3px solid #5E749C;
                             padding: 0px;
                             border-radius: 7px;
                             border-bottom-left-radius: 7px;
                             height: 40px;
                             subcontrol-position: top;
                             subcontrol-origin: margin;
                         }
                         QScrollBar::up-arrow:vertical, QScrollBar::down-arrow:vertical {
                             border: 2px solid grey;
                             width: 3px;
                             height: 3px;
                             background: white;
                         }
                        
                         QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {
                             background: none;
                         }
                        

                        but the result about the hole in my background not make my happy ... show these:

                        0_1512234627110_QTableview_hole.png

                        bkt

                        gfxxG 1 Reply Last reply
                        1
                        • gfxxG gfxx

                          @mrjj finally I solve my issue in these way;

                          QTableView {border: 3px solid #5E749C;text-align: top;padding: 4px;border-radius: 7px;border-bottom-left-radius: 7px;background: QLinearGradient( x1: 0, y1: 0, x2: 1, y2: 0,stop: 0 #fff, stop: 1 #eee,stop: 0.5 #ddd,stop: 1 #eee );width: 15px;}
                          QTableView::item:focus{selection-background-color: yellow;}
                          
                          
                           QScrollBar{
                                   background: QLinearGradient( x1: 0, y1: 0, x2: 1, y2: 0,stop: 0 #fff, stop: 1 #eee,stop: 0.5 #ddd,stop: 1 #eee );
                           }
                          
                           QScrollBar:vertical {
                               border: 3px solid #5E749C;
                               padding: 4px;
                               border-radius: 7px;
                               border-bottom-left-radius: 7px;
                               background: QLinearGradient( x1: 0, y1: 0, x2: 1, y2: 0,stop: 0 #fff, stop: 1 #eee,stop: 0.5 #ddd,stop: 1 #eee );
                               width: 45px;
                               margin: 48px 0 48px 0;
                           }
                          
                           QScrollBar::handle:vertical {
                               background: dark blue;
                               border: 3px solid #5E749C;
                               padding: 0px;
                               border-radius: 7px;
                               border-bottom-left-radius: 7px;
                               min-height: 40px;
                           }
                           QScrollBar::add-line:vertical {
                               background: dark blue;
                               border: 3px solid #5E749C;
                               padding: 0px;
                               border-radius: 7px;
                               border-bottom-left-radius: 7px;
                               height: 40px;
                               subcontrol-position: bottom;
                               subcontrol-origin: margin;
                           }
                          
                           QScrollBar::sub-line:vertical {
                               background: dark blue;
                               border: 3px solid #5E749C;
                               padding: 0px;
                               border-radius: 7px;
                               border-bottom-left-radius: 7px;
                               height: 40px;
                               subcontrol-position: top;
                               subcontrol-origin: margin;
                           }
                           QScrollBar::up-arrow:vertical, QScrollBar::down-arrow:vertical {
                               border: 2px solid grey;
                               width: 3px;
                               height: 3px;
                               background: white;
                           }
                          
                           QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {
                               background: none;
                           }
                          

                          but the result about the hole in my background not make my happy ... show these:

                          0_1512234627110_QTableview_hole.png

                          gfxxG Offline
                          gfxxG Offline
                          gfxx
                          wrote on last edited by
                          #16

                          THESE RESULT IS ON UBUNTU 16 AND QT5.8 .... ON UBUNTU 14 AND QT5.6 the scrollBar is outside the table area ... so the result is perfect..... maybe these depends on pathers widget and it's css settings.

                          For me the problem is Solved.

                          regards
                          giorgio

                          bkt

                          1 Reply Last reply
                          1

                          • Login

                          • Login or register to search.
                          • First post
                            Last post
                          0
                          • Categories
                          • Recent
                          • Tags
                          • Popular
                          • Users
                          • Groups
                          • Search
                          • Get Qt Extensions
                          • Unsolved