QML TableView 自定义委托：如何为太长的文本制作省略号答案

【问题标题】：QML TableView Custom delegate: How to make ellipsis for too long textQML TableView 自定义委托：如何为太长的文本制作省略号
【发布时间】：2018-04-30 09:30:27
【问题描述】：

我想在 QML TreeView 中显示 QFileSystemModel 并需要一个自定义委托，因为我想在文件旁边添加一个复选框。这就是我所拥有的：

TreeView {
    id: view
    anchors.fill: parent
    sortIndicatorVisible: true
    model: fileSystemModel
    rootIndex: rootPathIndex
    selection: sel
    selectionMode: 2


    TableViewColumn {
        id: namecolumn
        title: "Name"
        role: "fileName"

        resizable: true
        width: parent.width-sizeWidth-dateWidth-scrollBarWidth
        delegate: fileCheckDelegate
    }


    Component {
        id: fileCheckDelegate
        Row{CheckBox{}
            Text{text: root.getText(model.fileName)}
         }
    }

但是，我在长文件名超出列边框时遇到了问题。默认委托截断文本并将省略号添加到截断的文本。我想在我的自定义委托中做同样的事情，但不知道该怎么做。

如您所见，我尝试使用自定义 getText 函数，但我不知道使用哪些宽度和位置来决定是否应截断文本

编辑：我发现在我的 Text 组件上设置 Text.ElideRight 会做省略号，但我需要设置一个明确的宽度。那么如何设置 Text 组件的宽度呢？

【问题讨论】：

标签： qt qml

【解决方案1】：

好的，这就是诀窍：

    TreeView {
        id: view
        anchors.fill: parent
        sortIndicatorVisible: true
        model: fileSystemModel
        rootIndex: rootPathIndex
        selection: sel
        selectionMode: 2


        TableViewColumn {
            id: namecolumn
            title: "Name"
            role: "fileName"

            resizable: true
            width: parent.width-sizeWidth-dateWidth-scrollBarWidth
            delegate: fileCheckDelegate
        }


        Component {
            id: fileCheckDelegate
            Row{CheckBox{
                id: cbox
                }
                Text{text: model.fileName
                    width: namecolumn.width-x-cbox.width
                    elide: Text.ElideRight
                }
             }
        }

【讨论】：