How to use resizeToContents() in a TableView?



  • Hi,

    I am just do not understand on how to use the resizeToContents() method. Where do I have to put that? I am not able to find an example using this method.

    Here is the table I want to use. Can someone show me how the columns are resized?

        TableView {
            id: propertyTable
            y: 165
            height: 150
            anchors.right: parent.right
            anchors.rightMargin: root.standardMargin
            anchors.left: parent.left
            anchors.leftMargin: root.standardMargin
    
            model: propertyModel
    
            TableViewColumn {
                role:"name"
                title: qsTr("Property")
    
            }
            TableViewColumn {
                role: "mod"
                title: qsTr("Mod")
            }
            TableViewColumn {
                role: "startValue"
                title: qsTr("Start Value")
            }
            TableViewColumn {
                role: "value"
                title: qsTr("Value")
            }
        }
    

    Thanks


  • Moderators

    Hi! Here is an example for how to resize the first column by clicking a button:

    import QtQuick 2.3
    import QtQuick.Window 2.2
    import QtQuick.Controls 1.4
    
    Window {
        id: root
        visible: true
        width : 500
        height: 500
    
        TableView {
            id: propertyTable
            y: 165
            height: 150
            anchors.right: parent.right
            anchors.rightMargin: root.standardMargin
            anchors.left: parent.left
            anchors.leftMargin: root.standardMargin
    
            model: ListModel {
                id: libraryModel
                ListElement {
                    title: "A Masterpiece"
                    author: "Gabriel"
                }
                ListElement {
                    title: "Brilliance"
                    author: "Jens"
                }
                ListElement {
                    title: "Outstanding"
                    author: "Frederik"
                }
            }
    
            TableViewColumn {
                id: nameColumn
                role:"title"
                title: qsTr("Property")
    
            }
            TableViewColumn {
                role: "author"
                title: qsTr("Mod")
            }
        }
    
        Button{
            id : view
            text: "Click me"
            anchors.bottom: parent.bottom
            onClicked: nameColumn.resizeToContents()
        }
    }
    


  • Thanks for the hint. But clicking a button does not seam to be very practical. I want to use the table to display information and make sure that it is displayed properly.
    I tried to use Component.onCompleted instead but this gives me an error:

    QtQuick/Controls/TableViewColumn.qml:143: TypeError: Cannot read property '__listView' of null
    

  • Moderators

    The implementation of TableView has been changed due to performance resons (see docs and this bug). Basically this means that you can no longer trust TableView's onCompleted handler. But the following seems to work:

    import QtQuick 2.3
    import QtQuick.Window 2.2
    import QtQuick.Controls 1.4
    
    Window {
        id: root
        visible: true
        width : 500
        height: 500
    
        ListModel {
            id: libraryModel
            ListElement {
                title: "A Masterpiece"
                author: "Gabriel"
            }
            ListElement {
                title: "Brilliance"
                author: "Jens"
            }
            ListElement {
                title: "Outstanding"
                author: "Frederik"
            }
            Component.onCompleted:  propertyTable.resizeAllColumns()
        }
    
        TableView {
            id: propertyTable
            anchors.fill: parent
    
            model: libraryModel
    
            function resizeAllColumns() {
                for (var i=0; i<columnCount; ++i)
                    getColumn(i).resizeToContents()
            }
    
            TableViewColumn {
                id: nameColumn
                role:"title"
                title: qsTr("Property")
    
            }
            TableViewColumn {
                id: authorColumn
                role: "author"
                title: qsTr("Mod")
            }
        }
    
    }
    


  • Thanks again for helping. But it is not really working for me. My model is a XmlListModel and I tried your code with status == ready and onComplete but nothing. When I add a button and connect the function to onClicked your code works nicely...

    Unfortunately the length of the table header is not considered. I believe this is a two year old bug.

    At the moment I am using

    width: title.length*factor
    

    This seems to work okay for now. I am just curious if it will work on other screens as well.


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.