import QtQuick
import QtQuick.Controls
import Qt.labs.qmlmodels



TableView
{
    id: testTable
    anchors.fill: parent
    columnSpacing: 10
    rowSpacing: 2
    //boundsBehavior: Flickable.StopAtBounds

    model: TableModel
    {
        TableModelColumn { display: "checked" }
        TableModelColumn { display: "amount" }
        TableModelColumn { display: "fruitType" }
        TableModelColumn { display: "fruitName" }
        TableModelColumn { display: "fruitPrice" }


        rows:
        [
            {
                checked: "checked",
                amount: "amount",
                fruitType: "Fruittype",
                fruitName: "fruitName",
                fruitPrice: "Price"
            },

            {
                checked: true,
                amount: 2,
                fruitType: "Fruittype",
                fruitName: "blabla",
                fruitPrice: 1.50
            },

            {

                checked: true,
                amount: 1,
                fruitType: "Apple",
                fruitName: "Granny Smith",
                fruitPrice: 1.50
            },

            {
                checked: "true",
                amount: 4,
                fruitType: "Orange",
                fruitName: "Navel",
                fruitPrice: 2.50
            },

            {
                checked: "false",
                amount: 1,
                fruitType: "Banana",
                fruitName: "Cavendish",
                fruitPrice: 3.50
            }
        ]

    }

    delegate: DelegateChooser
    {
        DelegateChoice
        {
            column: 0
            delegate: Text
            {

                text: model.display
                //selectByMouse: true
                //implicitWidth: 140
                //onVisibleChanged: model.display = "checked"
            }
        }

        DelegateChoice
        {
            column: 1
            delegate: Text
            {

                text: model.display
                //selectByMouse: true
                //implicitWidth: 140
                //onVisibleChanged: model.display = "amount"
                //onLinkHovered: model.display = checked
            }
        }

        DelegateChoice
        {
            column: 2
            delegate: Text
            {

                text: model.display
                //selectByMouse: true
                //implicitWidth: 140
                //model.display : "fruitType"
            }
        }

        DelegateChoice
        {
            column: 3
            delegate: Text
            {

                text: model.display
                //selectByMouse: true
                //implicitWidth: 140
                //onVisibleChanged: model.display = "fruitName"
            }
        }

        DelegateChoice
        {
            column: 4
            delegate: Text
            {
                text: model.display
                //selectByMouse: true
                //implicitWidth: 140
                //onVisibleChanged: model.display = "fruitPrice"
            }
        }
    }
}