QML Tableview通过拖动列标题边框来调整列宽

QML Tableview通过拖动列标题边框来调整列宽,qml,qtquick2,Qml,Qtquick2,我想通过拖动列标题边框来调整表的列宽,就像在MS Excel中一样。以下代码适用于我生成的表。默认情况下,它不会在TableView(此处列出)中启用。我错过了什么 import QtQuick 2.15 import QtQuick.Controls 2.15 import QtQuick.Layouts 1.3 TableView { id: dataPreviewResult columnWidthProvider: function (column) { retur

我想通过拖动列标题边框来调整表的列宽,就像在MS Excel中一样。以下代码适用于我生成的表。默认情况下,它不会在TableView(此处列出)中启用。我错过了什么

import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.3


TableView {
    id: dataPreviewResult

    columnWidthProvider: function (column) { return 100; }
    rowHeightProvider: function (column) { return 30; }
    anchors.fill: parent
    topMargin: columnsHeader1.implicitHeight
    width: parent.width
    ScrollBar.horizontal: ScrollBar{}
    ScrollBar.vertical: ScrollBar{}
    clip: true
    boundsBehavior : Flickable.StopAtBounds


    Connections{
        target: QueryModel

        function onSqlHasData(hasData){
            dataPreviewResult.model = hasData === true? QueryModel: ""
        }

        function onHeaderDataChanged(tableHeaders){
            mainRepeater.model = tableHeaders
        }

    }

    delegate: Rectangle {
        border.color: Constants.darkThemeColor
        border.width: 0.5

        Text {
            text: display
            anchors.fill: parent
            anchors.margins: 10
            verticalAlignment: Text.AlignVCenter
            elide: Text.ElideRight
            color: Constants.lightGrayTextColor
        }
    }
    Rectangle { // mask the headers
        z: 3
        y: dataPreviewResult.contentY
        x: dataPreviewResult.contentX
        width: dataPreviewResult.leftMargin
        height: dataPreviewResult.topMargin
        border.color: Constants.themeColor
        border.width: 0.2
    }

    // Table Header Starts

    Row {
        id: columnsHeader1
        y: dataPreviewResult.contentY
        z: 2
        width: dataPreviewResult.width

        Repeater {
            id: mainRepeater

            Rectangle{
                width: dataPreviewResult.columnWidthProvider(modelData)
                height: 30
                border.color: Constants.darkThemeColor
                color: Constants.lightThemeColor
                border.width: 1

                Text {
                    id: textName
                    text: modelData
                    width: parent.width
                    height: parent.height
                    anchors.centerIn: parent
                    padding: 10
                    font.bold: false
                    verticalAlignment: Text.AlignVCenter
                }
            }
        }
    }

    Layout.fillWidth: true
    Layout.fillHeight: true

}


我已经解决了这个问题,并使用了
Qt.Quick.Controls 1.2
。如果有帮助,为某人发布解决方案

import QtQuick 2.3
import QtQuick.Window 2.2
import QtQuick.Controls 1.2
import QtQuick.Controls.Styles 1.2

Rectangle {
    id: win
    width: 860
    height: 560
    visible: true

    property var roleNames:["a", "b", "c"]
    property var newObject: []

    Connections{
        target: QueryModel

        // This one is for table data
        function onSqlHasData(hasData){
            view.model = hasData === true? QueryModel: ""

        }

        // This slot is for updating headers
        // This is also returning an array of strings
        function onHeaderDataChanged(tableHeaders){
            if(tableHeaders.length > 0){
                roleNames = []
                roleNames = tableHeaders

                for(var i=0; i<roleNames.length; i++){
                    var role  = roleNames[i]
                    var columnString = 'import QtQuick 2.3; import QtQuick.Controls 1.2; TableViewColumn {role: "' + role + '"; title: "' + role + '"; }';
                    newObject[i] = Qt.createQmlObject(columnString, view)
                    view.addColumn(newObject[i])
                }
            }
        }

    }

    // This one is to clear the table
    function clearTable(){
        for(var i=0; i<roleNames.length; i++){
            view.removeColumn(newObject[i])
            delete newObject[i]

        }
    }


    Button{
        id: clearBtn
        text: "Clear"
        height: 30
        onClicked: clearTable()
    }

    TableView {
        id:view
        width: parent.width
        height: parent.height - clearBtn.height
        anchors.top: clearBtn.bottom
        alternatingRowColors: false
        style: TableViewStyle {
            headerDelegate: Rectangle {
                height: textItem.implicitHeight * 1.2
                width: textItem.implicitWidth
                color: "lightgrey"
                Text {
                    id: textItem
                    anchors.fill: parent
                    verticalAlignment: Text.AlignVCenter
                    horizontalAlignment: styleData.textAlignment
                    anchors.leftMargin: 12
                    text: styleData.value
                    elide: Text.ElideRight
                    color: textColor
                    renderType: Text.NativeRendering

                }
                Rectangle {
                    anchors.right: parent.right
                    anchors.top: parent.top
                    anchors.bottom: parent.bottom
                    anchors.bottomMargin: 1
                    anchors.topMargin: 1
                    width: 1
                    color: "black"
                    border.color: "black"
                }
                Rectangle {
                    anchors.bottom: parent.bottom
                    width: parent.width
                    height: 1
                    color: "black"
                    border.color: "black"
                }
            }

            itemDelegate: Rectangle {
                color: "white"
                Text {
                    id: textItem1
                    anchors.fill: parent
                    verticalAlignment: Text.AlignVCenter
                    horizontalAlignment: styleData.textAlignment
                    anchors.leftMargin: 12
                    text: modelData
                    elide: Text.ElideRight
                    color: textColor
                    renderType: Text.NativeRendering
                }
                Rectangle {
                    anchors.right: parent.right
                    anchors.top: parent.top
                    anchors.bottom: parent.bottom
                    width: 1
                    color: "black"
                    border.color: "black"
                }
                Rectangle {
                    anchors.bottom: parent.bottom
                    width: parent.width
                    height: 1
                    color: "black"
                    border.color: "black"
                }
            }
        }
    }
}
导入QtQuick 2.3
导入QtQuick.Window 2.2
导入QtQuick.Controls 1.2
导入QtQuick.Controls.Styles 1.2
长方形{
id:赢
宽度:860
身高:560
可见:正确
属性变量roleNames:[“a”、“b”、“c”]
属性变量newObject:[]
联系{
目标:QueryModel
//这是表数据
函数onSqlHasData(hasData){
view.model=hasData==true?QueryModel:“
}
//此插槽用于更新标头
//这也将返回一个字符串数组
onHeaderDataChanged函数(tableHeaders){
如果(tableHeaders.length>0){
roleNames=[]
roleNames=表格标题
对于(var i=0;i