QML：TableView动态改变行高答案

【问题标题】：QML: TableView dynamic change row heightQML：TableView动态改变行高
【发布时间】：2018-01-21 22:14:25
【问题描述】：

我有一个 4 列的表格，其中之一是文本。当您更改列的宽度时，内部文本的宽度也会发生变化。在某些情况下，文本的宽度变得相当小并且文本开始增加其高度（文本换行）。如何增加此文本所在行的高度？

这是一个带有文本的列

TableViewColumn {
    id: fullNameColumn
    property int minColWidth: 175
    property int maxColWidth: 500
    role: "fullName"
    title: "ФИО"
    width: 360
    property string imageSource : ""
    onWidthChanged: {
       if (width < minColWidth)
           width = minColWidth
    }

    delegate: Rectangle{
        id: rowCellContentFullName
        color: "transparent"
        Text {
            property int maxColWidth: 400
            id: labelFullName
            objectName: "labelFullName"
            font.pixelSize: 13
            wrapMode: Text.Wrap
            anchors.leftMargin: 38
            anchors.left: parent.left
            horizontalAlignment: styleData.textAlignment
            anchors.verticalCenter: parent.verticalCenter
            visible: parent.visible
            width: parent.width - this.anchors.leftMargin * 2
            text: styleData.value !== undefined ? styleData.value : ""
            color: "#474747"
            renderType: Text.NativeRendering     
    }
}

这是 rowDelegate

 property Component rowDelegate: Rectangle {
                id: rowDel
                objectName: "RowDelegate"
                height: parent.parent.children[1].children[2].children[0].children[0].height < 50 ? 50 : parent.parent.children[1].children[2].children[0].children[0].height
                property color selectedColor: styleData.hasActiveFocus ? primaryColor : secondaryColor
                property bool selectionMaskVisible
                property bool selected: false
        }

在 rowDelegate 中，我用可怕的表情绑定高度，但它有效。仅适用于第 3 列（其中 FullName）。如果我将此列拖到另一个空间中，我的代码将不起作用。

如果没有这个可怕的表达式，我可以在 TableView QML 中更改行高吗？ Mb 你知道解决这个问题的方法吗？

【问题讨论】：

仔细查看 onWidthChanged 以及还有哪些可以修复/改进的地方？

标签： qt qml row-height

【解决方案1】：

罗斯蒂斯拉夫。
我有同样的问题。
我的解决方案：

TableView {
    id: skillsGroupSkills

    model: root.updated ? skillsProxy : null

    property var rects: ({})

    TableViewColumn {
        title: "ID"
        role: "id"
        width: 30
    }

    TableViewColumn {
        id: skillColumn
        title: "Название"
        role: "skill"
        width: 200
    }

    TableViewColumn {
        title: "Sort"
        role: "sort_id"
        width: 60
    }

    itemDelegate: Item {
        Text {
            id: text
            color: styleData.textColor
            elide: styleData.elideMode
            text: styleData.value
            width: parent.width
            wrapMode: Text.WrapAtWordBoundaryOrAnywhere
            onContentHeightChanged: {
                if (styleData.column === 1 && styleData.row !== -1) {
                    var id = skillsGroupsSkillsTableModel.get(skillsProxy.mapRowToSource(styleData.row))["id"]
                    var rect = skillsGroupSkills.rects[id];
                    if (rect) rect.height = contentHeight;
                }
            }
        }
    }

    rowDelegate: Rectangle {
        id: rect

        Component.onCompleted: {
            var id = skillsGroupsSkillsTableModel.get(skillsProxy.mapRowToSource(styleData.row))["id"]
            skillsGroupSkills.rects[id] = rect;
        }
    }
}

在此示例中，我动态更改每行的第二列高度。
每个 rowDelegate 矩形都保存在 rects 属性中。
我的模型在每一行都有独特的价值 - id。我用它来识别矩形，因为我有 proxyModel。大概可以直接使用styleData.row。

附：是的，我知道这个问题是在一年前提出的。可能是我的解决方案对某人有用。 :)

【讨论】：