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 - text jumps around and the dropdown list needs padding

QCombobox - text jumps around and the dropdown list needs padding

Scheduled Pinned Locked Moved Unsolved General and Desktop
qcomboboxqabstractitemvipadding
3 Posts 2 Posters 1.1k 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.
  • H Offline
    H Offline
    Hologram
    wrote on 26 Jan 2023, 17:27 last edited by
    #1

    Hi,
    I am modifying an existing Qt .qss stylesheet and am having some issues with readability. Currently, the text in the Qcombobox has no padding when inactive and the padding is applied as soon as I click upon the dropdown. I would also like to apply padding to the QAbstractItemView so the text does not overlap and has some spacing between the items.

    Here's what I have:
    QCombobox.gif

    Ideally, I want the Comboboxes to be the same as in Blender:
    QCombobox - Blender.gif

    Code:

    QComboBox {
      border: 1px solid #282828;
      background: #282828;
      border-radius: 6x;
      selection-background-color: #303030;
      padding-left: 10px;
      padding-right: 10px;
      /* border-radius changed from 2 to 10px
      padding left-right changed to 10px - was 4px*/ 
     
      min-height: 1.5em;
      /* padding-top: 2px;     removed to fix #132 > See ExtremeProDark */
      /* padding-bottom: 2px;  removed to fix #132 > See ExtremeProDark */
      /* min-width: 75px;      removed to fix #109 > See ExtremeProDark */
      /* Indicator -           removed to fix #132 > See ExtremeProDark */
    }
    QComboBox:editable {
      background: transparent;
    }
    
    QComboBox QAbstractItemView {
      border: 0px solid #181818;
      border-radius: 10px; /* was 0px */
      background-color: #181818;
      selection-background-color: #599EB3;
    }
    
    QComboBox QAbstractItemView:hover {
      background-color:#282828;
      color: White;
    }
    
    QComboBox QAbstractItemView:selected {
      background: #599EB3;
      color: White;
      padding-left: 10px;
      padding-right: 10px;
    }
    
    QComboBox QAbstractItemView:alternate {
      background: #303030;
    }
    
    QComboBox:disabled {
      background-color: #4d4d4d;
      color: #353535;
    }
    
    QComboBox:hover {
      background-color: #282828;
      border: 1px solid #282828;
    }
    
    QComboBox:focus {
      background-color:#599EB3;
      border: 1px solid #599EB3;
    }
    
    QComboBox:on {
      selection-background-color: #599EB3;
      padding-top: 10px;
      padding-left: 10px;
      /* shift the text when the popup opens */
    }
    }
    
    QComboBox::indicator {
      border: none;
      border-radius: 0px;
      background-color: transparent;
      selection-background-color: transparent;
      color: transparent;
      selection-color: #557bb6;
      /* Needed to remove indicator - fix #132 */
    }
    
    QComboBox::indicator:alternate {
      background: #343434;
    }
    
    QComboBox::item {
      /* Remove to fix #282, #285 and MR #288*/
      /*&:checked {
                font-weight: bold;
            }
    
            &:selected {
                border: 0px solid transparent;
            }
            */
    }
    
    QComboBox::item:alternate {
      background: #3c3c3c;
    }
    
    QComboBox::drop-down {
      subcontrol-origin: padding;
      background-color: #303030;
      subcontrol-position: top right;
      width: 14px;
      border-left: 1px solid #303030;
    }
    QComboBox::drop-down:hover {
      background-color: #282828;
    }
    
    QComboBox::drop-down:focus {
      background-color: #599EB3;
    }
    
    QComboBox::down-arrow {
      image: url(qss:images_dark-light/down_arrow_disabled_light.svg);
      height: 10px;
      width: 10px;
    }
    
    QComboBox::down-arrow:on, QComboBox::down-arrow:hover, QComboBox::down-arrow:focus {
      image: url(qss:images_dark-light/down_arrow_lighter.svg);
    }
    

    Could someone lend me a hand on this?

    1 Reply Last reply
    0
    • J Online
      J Online
      JoeCFD
      wrote on 26 Jan 2023, 17:30 last edited by JoeCFD
      #2

      I use stylesheet in my app and padding seems fine.
      "QComboBox{ padding: 10px 0px 0px 0px;}"

      What is your OS and Qt version?

      1 Reply Last reply
      0
      • H Offline
        H Offline
        Hologram
        wrote on 26 Jan 2023, 19:31 last edited by
        #3

        Windows 10.0.19045, Qt 5.15, I think. At least Qt 5, that's for sure.

        1 Reply Last reply
        0

        1/3

        26 Jan 2023, 17:27

        • Login

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