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. QComboBox with transparent dropdown
QtWS25 Last Chance

QComboBox with transparent dropdown

Scheduled Pinned Locked Moved Unsolved General and Desktop
qt5qcomboboxstylesheetdrop-downcss
5 Posts 2 Posters 5.0k Views
  • 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.
  • S Offline
    S Offline
    Sebbo
    wrote on 17 Aug 2016, 11:10 last edited by
    #1

    Hi everyone,

    I'm working with a couple of QComboBoxes which are needed for e.g. changings in language and units. The stylesheet of each one looks as follows:

    QComboBox {
       background: qlineargradient(
       x1:0, y1:0, x2:0, y2:1,
       stop:0 #f9f9f9,
       stop: 0.5 #c6c6c6,
       stop: 0.6 #dfdfdf,
       stop:1 #f9f9f9 );
       border-style: solid;
       border-width: 1px;
       border-color: rgb(0, 93, 168);
       border-radius: 30px;
       color: rgb(0, 93, 168);
       min-width: 170px;
       min-height: 60px;
       padding-left: 15px;
    }
    QComboBox:on {
       border-radius: 30px;
       background:transparent;
    }
    QComboBox::drop-down {
       image: url(:/bwt/downarrow.png);
       subcontrol-position: center right;
       margin-right: 10px;
    }
    QComboBox QAbstractItemView::item {
       padding: 10px 10px 10px 10px;
    }
    QComboBox QAbstractItemView {
       color: rgb(0, 93, 168);
       background: transparent;
    }
    QComboBox QListView::item {
       background: qradialgradient(
       cx: 0.5, cy: -1.6, fx: 0.5, fy: 0,
       radius: 2,
       stop: 0 #C4C4C4,
       stop: 1 #DBDBDB );
       border-style: solid;
       border-width: 1px;
       border-color: rgb(0, 93, 168);
       border-radius: 20px;
    }
    

    Since I'm not able to upload pictures directly to this post here's an external link to what I get using the stylesheet from above:
    combobox image

    As you can see there's still a box with a white background behind the dropdown menu which I'd like to get rid of. Is it possible to keep the rounded edges while the white box behind it disappears using stylesheet? If not how do I solve this issue?

    Any help is appreciated!

    Thanks,
    Seb

    1 Reply Last reply
    0
    • V Offline
      V Offline
      VRonin
      wrote on 17 Aug 2016, 11:35 last edited by
      #2

      That is a QFrame around it so I'd try

      QComboBox QFrame{
         background: transparent;
      }
      

      "La mort n'est rien, mais vivre vaincu et sans gloire, c'est mourir tous les jours"
      ~Napoleon Bonaparte

      On a crusade to banish setIndexWidget() from the holy land of Qt

      1 Reply Last reply
      0
      • S Offline
        S Offline
        Sebbo
        wrote on 17 Aug 2016, 11:42 last edited by
        #3

        @VRonin

        Thank you for your suggestion. Sadly adding QFrame to the stylesheet didn't solve the issue.

        1 Reply Last reply
        0
        • V Offline
          V Offline
          VRonin
          wrote on 17 Aug 2016, 12:26 last edited by
          #4

          Looking at Qt source looks like QComboBoxPrivateContainer (that is the white box) is unstylable. you can still do it in C++ with

          if (combo->view()->parentWidget())
              combo->view()->parentWidget()->setWindowOpacity(0);
          

          source of C++ code: http://stackoverflow.com/questions/26780629/qcombobox-transparent-item-list-stylesheet

          "La mort n'est rien, mais vivre vaincu et sans gloire, c'est mourir tous les jours"
          ~Napoleon Bonaparte

          On a crusade to banish setIndexWidget() from the holy land of Qt

          1 Reply Last reply
          0
          • S Offline
            S Offline
            Sebbo
            wrote on 17 Aug 2016, 12:46 last edited by
            #5

            @VRonin

            With the provided code the whole dropdown list will be invisible. Do you know how to keep the items unaffected?

            1 Reply Last reply
            0

            3/5

            17 Aug 2016, 11:42

            • Login

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