Search code examples
qtqtquick2qtquickcontrols2

How to customize a QtQuick 2 component style while enable is false


When I set enabled property on a ComboBox for example, then it gets "greyed out". As far as I can tell it draws a layer above the component with a certain opacity so the original design is visible but becomes slightly faded. How can I tweak this effect?

I tried to change my components background color based on the enabled property's state, but that didn't help. For example I have set my background color to red, when the enabled property was false, but it didn't become red, it became more like a light red due to the overlay what I was describing above.

A simple code example:

ComboBox {
  id: control
  enabled: false

  model: ["First", "Second", "Third"]

  background: Rectangle {
    color: control.enabled ? "transparent" : "red"
  }
}

Solution

  • So as @jpnurmi suggested, the source of my problem was fixed in Qt 5.7.1.

    ComboBox {
      id: control
      enabled: false
    
      model: ["First", "Second", "Third"]
    
      opacity: 1 // *
    
      background: Rectangle {
        color: control.enabled ? "transparent" : "red"
      }
    }
    

    * = Adding this here, will overwrite the default opacity behaviour and then it can be controlled manually through the background component for example.