import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.3
import QtQuick.Window 2.15
import Qt.labs.qmlmodels 1.0

Window {
  visible: true
  width: 640
  height: 480
  title: qsTr("TableView")

  TableView {
    id: tableView
    clip: true
    columnSpacing: 1
    rowSpacing: 1
    boundsBehavior: Flickable.StopAtBounds
    pixelAligned: true
    anchors.fill: parent
    topMargin: 35

    onContentXChanged: print('cx', contentX)

    columnWidthProvider: function (column) {
      if (column === 1) {
        return 0
      }

      return 100
    }
    rowHeightProvider: function (column) {
      return 50
    }

    ScrollBar.vertical: ScrollBar {
      policy: ScrollBar.AlwaysOn
    }
    ScrollBar.horizontal: ScrollBar {
      policy: ScrollBar.AlwaysOn
    }

    delegate: DelegateChooser {
      choices: [
        DelegateChoice {
          column: 1
          delegate: Rectangle {
            implicitWidth: 100
            implicitHeight: 50
            color: "#dd4455"
            Text {
              text: display
            }
          }
        },

        // default
        DelegateChoice {
          delegate: Rectangle {
            implicitWidth: 100
            implicitHeight: 50
            Text {
              text: display
            }
          }
        }
      ]
    } // DelegateChooser

    Row {
      id: columnsHeader
      y: tableView.contentY
      x: 0
      z: 2
      spacing: tableView.columnSpacing

      Repeater {
        model: Math.max(0, tableView.columns)

        Loader {
          active: width > 0
          width: tableView.columnWidthProvider(index)
          height: active ? 35 : 0

          sourceComponent: Rectangle {
            color: "gray"
            border.width: 1

            Text {
              anchors.centerIn: parent
              text: "column " + index
            }
          }
        }

//        Rectangle {
//          color: "gray"
//          border.width: 1
//          width: tableView.columnWidthProvider(index)
//          height: visible ? 35 : 0
//          visible: width > 0

//          Text {
//            anchors.centerIn: parent
//            text: "column " + index
//          }
//        }
      }

    } // Row

    Component.onCompleted: {
      var cols = ''
      for (var i = 0; i < 100; ++i) {
        cols += 'TableModelColumn { display: "column{i}" }'.replace("{i}", i)
      }

      var _model = Qt.createQmlObject(
          'import Qt.labs.qmlmodels 1.0\n' +
          'TableModel {\n' +
          cols +
          '}\n',
          tableView)

      for (var r = 0; r < 100; ++r) {
        var data = {}
        for (var c = 0; c < _model.columnCount; ++c) {
          data["column" + c] = r + ", " + c
        }
        _model.appendRow(data)
      }

      tableView.model = _model
      tableView.forceLayout()
    }

  } // TableView
}