<![CDATA[QTabBar-like list of "x-clickable" buttons?]]>There's a common pattern in web UIs where they show a list of items via "buttons" (more precisely, "labels" in the Qt sense because the widget as a whole is not clickable) with a small, clickable "x" in the top-left corner. Clicking on the "x" removes the label from the list. The label is usually in a flat-button style with a thin border. In Qt, one might add labels to the list by choosing from a QComboBox.

As far as I know, Qt has no native buttons/labels with this kind of functionality. However, it is similar to how QTabBar works with tabsClosable set to true. So maybe a list of such buttons could be implemented via an ordinary QTabBar and changing the styling. However, this is obviously an atypical use of QTabBar and it might take a lot of work to get the style right so it doesn't confuse the user; there's no QStackWidget being controlled by the tab bar.

Is there a 3rd party library that might have such as QLabel subclass implemented already?

]]>https://forum.qt.io/topic/165094/qtabbar-like-list-of-x-clickable-buttonsRSS for NodeMon, 21 Sep 2026 21:06:39 GMTTue, 15 Sep 2026 19:25:08 GMT60<![CDATA[Reply to QTabBar-like list of "x-clickable" buttons? on Wed, 16 Sep 2026 16:54:06 GMT]]>@IgKh said in QTabBar-like list of "x-clickable" buttons?:

adding a tag is to type it and hit return

Fair enough. I think different from what I took from the OP's description. At least I understand.

(I get it now. Your "Tags Input" is those adding a bunch of tags to a topic by typing in words on little "cards", and "x" to delete one.)

]]>https://forum.qt.io/post/840169https://forum.qt.io/post/840169Wed, 16 Sep 2026 16:54:06 GMT<![CDATA[Reply to QTabBar-like list of "x-clickable" buttons? on Wed, 16 Sep 2026 16:46:19 GMT]]>@JonB A text edit (often with a completer and/or a combo box style drop down menu) is a typical part of such a component, as the UX for adding a tag is to type it and hit return. You can see a live example like https://www.chakra-ui.com/docs/components/tags-input.

]]>https://forum.qt.io/post/840168https://forum.qt.io/post/840168Wed, 16 Sep 2026 16:46:19 GMT<![CDATA[Reply to QTabBar-like list of "x-clickable" buttons? on Wed, 16 Sep 2026 16:31:09 GMT]]>@IgKh
I know nothing about this. Ooi why do you want a QLineEdit, which is ostensibly for text input, rather than a QLabel?

]]>https://forum.qt.io/post/840167https://forum.qt.io/post/840167Wed, 16 Sep 2026 16:31:09 GMT<![CDATA[Reply to QTabBar-like list of "x-clickable" buttons? on Wed, 16 Sep 2026 16:04:07 GMT]]>The common name for the kind of component you describe is a "Tags Input". Just so you can more easily search for it. A quick search finds some previous efforts to build one for Qt Widgets.

If I had to do something like this myself, the initial approach I would have taken is to subclass QLineEdit and override the paintEvent to draw the tag pills in a margin (the margins are customizable). A rectangle with an X and a little bit of text is relatively easy to draw yourself with the QPainter API, there is no need to reach for QLabel. Detecting clicks can be done in an override of mouse down events. You can go fancy with making the backspace key work deleting tags when at the beginning of the line edit area, and what not.

]]>https://forum.qt.io/post/840165https://forum.qt.io/post/840165Wed, 16 Sep 2026 16:04:07 GMT