Important: Please read the Qt Code of Conduct -

Qt Quick 2 TableView: delegate (cell) alignment

  • The “new” (Qt Quick 2) TableView type does not seem to attach alignment properties to its (cell) delegate, upon reading Qt docs and its C++ source.

    In my table view, I want to be able to have some columns right-aligned. I could do this by setting a fixed width for my delegate item and right-aligning the text within it, if I had one standard width for that column, but in this case the column width needs to vary according to the size of its content, so I want TableView to dynamically compute the column width based on the largest implicitWidth of all visible delegates (as documented). Problem is, I can’t have both: If I fix the delegate’s implicitWidth, the column won’t shrink or grow; if I don’t, it shrinks and grows but the delegate items are always (top-)left-aligned, for lack of a property that would tell TableView how to align it within that space.

    I would like TableView to attach explicit cell-alignment properties to its delegate items so that they can anchor to the edges of their column as cell widths are recomputed based on the maximum width of visible cells in that column (and the same for heights within rows).

    Anyone have an idea how I could MacGyver this using the existing TableView type?

  • Qt Champions 2018

    Just align stuff in your delegate.

    All the delegates of a column have the same size, so a delegate alignment doesn't make a lot of sense.

    If your delegate is a Text (or Label), just do: horizontalAlignment: Text.AlignRight, if it's wrapped in a Rectangle, make sure you reflect the correct implicitWidth on it (I believe you are already doing this), and then use anchors.right on the child or you can also do anchors.fill: parent and horizontalAlignment: Text.AlignRight if it's a Text.

  • Hi

    this is how I did column-based alignment:

        delegate: ItemDelegate {
            background: Rectangle {
                color: alternateBackgroundColors ? (row % 2 == 0 ? oddBackground : evenBackground) : "white"
            implicitWidth: headerWidth(column)
            implicitHeight: 30
            clip: true
            Loader {
                anchors.centerIn: columnAlignments[column] === Qt.AlignCenter ? parent : undefined
                anchors.left: columnAlignments[column] === Qt.AlignLeft ? parent.left : undefined
                anchors.right: columnAlignments[column] === Qt.AlignRight ? parent.right : undefined
                property int tableColumn: column
                property int tableRow: row
                sourceComponent: itemDelegate

Log in to reply