The QExpansionItem has an 'active-class', but there does not seem to be an 'active' property

  • Just like the header says, the QExpansionItem has an ‘active-class’ property but no ‘active’ property. I wonder how one makes use of the ‘active-class’?

    In my use case, I have a list containing a mixture of QItem and QExpansionItem. The user must have the ability to select any entry in the list, regardless of whether it is a QItem or a QExpansionItem. I am using the active and active-class properties to change the look of the selected QItem. I was hoping to do the same for QExpansionItem, but I only have the active-class property.

  • Could you create a codepen to demonstrate where you are heading?


  • @s-molinari

    Scott, sorry for the delayed response. Here is the workaround that I came up with in CodePen.

    The idea is to have the ability to select all items in the list individually, including the expansion ones. There are some issues with my workaround:

    • It is limited to the kind of data I built it for. If your hierarchical stuff is different, you’d have to change the component I created.
    • The styling of the expansion item header is done in JS code, while the styling of the QItems is done in CSS. One would have to keep these in sync.
    • The QExpansionItem does not emit a click event so I am using the before-show and before-hide events, which is at best kludgy.
    • Ideally the selection would be achieved by clicking on the header and the expansion/collapse by clicking on the expando icon. One can have it expand/collapse only by clicking on the expando icon, but then there would be no way for the user to “select” it.

  • How about just using QTree for what you want to do?


  • @s-molinari Hi Scott. I apologize I keep having delayed responses.

    I tried QTree and had different issues. I moved to QList on your advice :-). See this

  • Hehe…oops. 😊


Log in to reply