import QtQuick
import QtQuick.Controls
import QtQuick.Layouts


TreeView
{
    anchors.fill: parent
    clip: true
    columnSpacing: 1
    rowSpacing: 1

    model: xtrChildModel

    columnWidthProvider: function(column)
    {
        var z= 1.7*(width / columns);
        return z;
    }

    delegate: Rectangle
    {
        required property int row
        required property int column
        required property var model

        border.width: 0

        implicitWidth: 30
        implicitHeight: 20
        border.color: "#cccccc"
        //color: index % 2 === 0 ? "#f9f9f9" : "#e0e0e0"
        //color: TreeView.isSelected ? "#d0eaff" : (row % 2 === 0 ? "#f9f9f9" : "#ffffff")
        //color: TreeView.isSelected ? "#d0eaff" : (row % 2 === 0 ? "#f9f9f9" : "#ffffff")

        //color: index % 2 === 0 ? "#f9f9f9" : "#e0e0e0"
        //color: TreeView.isSelected ? "#d0eaff" : (row % 2 === 0 ? "#f9f9f9" : "#ffffff")

        TextField
        {
            id: entry
            anchors.centerIn: parent
            text:  display
            font.pixelSize: 11
            horizontalAlignment: Text.AlignHCenter
            verticalAlignment: Text.AlignVCenter

            /*
            background: Rectangle
            {
                //color: entry.enabled ? "transparent" : "#353637"
                //border.color: entry.enabled ? "#21be2b" : "transparent"
                border.color: "transparent"
                color: TreeView.isSelected ? "#d0eaff" : (row % 2 === 0 ? "#f9f9f9" : "#ffffff")

            }
            */

            // Hintergrund des Textfeldes anpassen
            background: Rectangle
            {
                //color: TreeView.isSelected ? "#d0eaff" : (row % 2 === 0 ? "#f9f9f9" : "#ffffff")
                color: entry.activeFocus ? "#d0eaff" : (row % 2 === 0 ? "#f9f9f9" : "#ffffff")
            }

            onEditingFinished:
            {
                console.log("Editing finished, new text is :"+ text + " at index :" + index)
                model.display = text //The roles here are defined in model class
            }
        }

    }

    ScrollBar.horizontal: ScrollBar {}
    ScrollBar.vertical: ScrollBar {}
}


