QML dynamic columns width

Question

I have TableView with 4 columns. When I enlarge width of main window, I needed enlarge first column width too.

Older way (non QML) was:

QTableView->horizontalHeader()->setSectionResizeMode(0, QHeaderView::Stretch );

Now I do something like example bellow, but this is not exactly perfect.

1. When I resize some column, this construction stop working. All columns stay in actual state and stop resizing when main window change his size.
2. When I add new columns in future (forgot rewrite this codeine) or add some columns dynamically, this stop working too.

QML file: :

TableView {  

     id: ccPanel  
     model: ccModel
    TableViewColumn {
        id: ccName
        role: "name"
        title: "Name"
        width: ccPanel.width - ccSize.width - ccDate.width
    }
    TableViewColumn {
        id: ccSize
        role: "size"
        title: "Size"
        width: 60
    }
    TableViewColumn {
        id: ccDate
        role: "Date"
        title: "Datum"
        width: 85
    }
}

Do you know how to help me?

Answer 1

To eliminate strange resizing, make the last column non-resizable manually and use the widthChanged signals of the columns as well as the signal from the TabView. The following code produces a behavior very close to the Qt TableView header.

TableView
{
    id: ccPanel
    model: ccModel
    anchors.fill: parent
    onWidthChanged:ccName.width = Math.max(100, ccPanel.width - ccSize.width - ccDate.width)

    TableViewColumn
    {
        id: ccName
        role: "name"
        title: "Name"
        onWidthChanged: ccDate.width = Math.max(60, ccPanel.width - ccSize.width - ccName.width)
    }
    TableViewColumn
    {
        id: ccSize
        role: "size"
        title: "Size"
        width: 60
        onWidthChanged: ccDate.width = Math.max(85, ccPanel.width - ccSize.width - ccName.width)
    }
    TableViewColumn
    {
        resizable: false
        id: ccDate
        role: "Date"
        title: "Datum"
        width: 85
    }
}

Answer 2

Well, there is one solution I can think of, but it ain't pretty:

Basically, you have to do manual column management, keep track of all current columns in an array, and each time you add, remove or resize a column, you must execute a function that generates the bindings for the column width dynamically:

column.height = Qt.binding(function() { return property_evaluating_expressions })

Answer 3

If i thing, here we are. In this time it's not perfect, but it's solution. I respond to the event resizing the main window. Not perfect, because not contain actual NAME size. Sometime during enlarging name jups to new value irrationally.

    TableView
    {

        id: ccPanel
        property var oldWidth: ccPanel.width
        model: ccModel

        onWidthChanged:
        {
            var newWidth = ccName.width + (ccPanel.oldWidth - ccName.width - ccDate.width - ccSize.width);
            if(newWidth > 19)
            {
                ccName.width = newWidth
            }
            ccPanel.oldWidth = ccPanel.width;
        }

        TableViewColumn
        {
        ...
        ...
        ...