QML Tableview通过拖动列标题边框来调整列宽
我想通过拖动列标题边框来调整表的列宽,就像在MS Excel中一样。以下代码适用于我生成的表。默认情况下,它不会在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
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