import QtQuick 2.5
import QtQuick.Controls 1.4

ApplicationWindow
{
    visible: true
    width: 640
    height: 480
    title: qsTr("Table Item")

    View
    {
        id: view
        anchors.centerIn: parent

        width: 300
        height: 200

        headers: ["List Avto", "State", "Satellite"]
    }
}

import QtQuick 2.5
import QtQuick.Controls 1.4

Item
{
    property variant headers: []

    TableView
    {
        id: _view
        anchors.fill: parent

        model: _modelView

        resources:
        {
            var temp = []

            for(var i = 0; i < headers.length; i++)
            {
                var header = headers[i]
                var newColumn = _item.createObject(_view, {"title": header})
                temp.push(newColumn)
            }

            return temp
        }

        headerDelegate: _headerDelegate
    }

    Component
    {
        id: _headerDelegate

        Text
        {
            text: styleData.value
            color: (styleData.pressed)?"red":"black"
        }
    }

    ListModel
    {
        id: _modelView
    }

    Component
    {
        id: _item
        TableViewColumn { width: 100 }
    }
}

import QtQuick 2.5
import QtQuick.Controls 1.4

Item
{
    property variant headers: []

    TableView
    {
        id: _table
        anchors.fill: parent
        model: _modelTable

        Component.onCompleted:
        {
            for(var index = 0; index < headers.length; index++)
            {
                var component = Qt.createComponent("item")
                if(component.status == Component.Ready)
                {
                    var column = component.createObject(_table)

                    if(column != null)
                    {
                        _table.addColumn(column)
                        var col = _table.getColumn(index)

                        col.title = headers[index]
                        col.delegate = _textDelegate

                        col.resizeToContents()
                    }
                    else
                        console.log("column is null")
                }
                else
                    console.log(component.errorString())
            }

            _table.resizeColumnsToContents()
        }

        headerDelegate: _headerDelegate
        rowDelegate: _rowDelegate
    }

    ListModel
    {
        id: _modelTable

        ListElement { name: "avto1" }
        ListElement { name: "avto2" }
        ListElement { name: "avto3" }
        ListElement { name: "avto4" }
        ListElement { name: "avto5" }
    }

    Component
    {
        id: _headerDelegate

        Rectangle
        {
            width: _textHeader.text.length*1.2
            height: _textHeader.font.pixelSize*1.2
            color: "skyblue"

            border
            {
                width: 1
                color: (styleData.pressed)?"red":"black"
            }

            Text
            {
                id: _textHeader

                anchors.horizontalCenter: parent.horizontalCenter

                font.bold: true

                color: (styleData.pressed)?"red":"black"
                text: styleData.value

                Component.onCompleted:
                {
                    console.log(_textHeader.text.length)
                }
            }
        }
    }

    Component
    {
        id: _textDelegate

        Rectangle
        {

            color: (styleData.selected)?"red":"white"
            border
            {
                width: 1
                color: (styleData.selected)?"skyblue":"black"
            }

            Text
            {
                anchors.centerIn: parent
                color: (styleData.selected)?"skyblue":"black"
                text: styleData.value
            }
        }
    }

    Component
    {
        id: _rowDelegate

        Item
        {
            height: 24
        }
    }
}