Spreadsheets Example: Use TableViewDelegate

This update removes the custom table cell and uses the TableViewDelegate
type as the main TableView's delegate.

Task-number: QTBUG-114636
Change-Id: Icc2fd121d66f2bd1a6102e8575b75abd46940b96
Reviewed-by: Santhosh Kumar <[email protected]>

3 files changed, 15 insertions, 55 deletions

diff --git a/examples/quickcontrols/spreadsheets/Spreadsheets/CMakeLists.txt b/examples/quickcontrols/spreadsheets/Spreadsheets/CMakeLists.txt
index 5d42afa2e3..03e78452d5 100644
--- a/examples/quickcontrols/spreadsheets/Spreadsheets/CMakeLists.txt
+++ b/examples/quickcontrols/spreadsheets/Spreadsheets/CMakeLists.txt
@@ -12,7 +12,6 @@ qt_add_qml_module(${PROJECT_NAME}
     VERSION 1.0
     QML_FILES
         Main.qml
-        TableCell.qml
         HeaderToolBar.qml
         HelpDialog.qml
         ColumnHeaderView.qml
diff --git a/examples/quickcontrols/spreadsheets/Spreadsheets/Main.qml b/examples/quickcontrols/spreadsheets/Spreadsheets/Main.qml
index e9400b1161..3c396f3e4e 100644
--- a/examples/quickcontrols/spreadsheets/Spreadsheets/Main.qml
+++ b/examples/quickcontrols/spreadsheets/Spreadsheets/Main.qml
@@ -4,7 +4,6 @@
 import QtQuick
 import QtQuick.Controls
 import QtQuick.Layouts
-import Qt.labs.qmlmodels
 
 import Spreadsheets
 
@@ -223,20 +222,23 @@ ApplicationWindow {
                         return implicitColumnWidth(column)
                     }
 
-                    delegate: TableCell {
-                        required property var model
-
+                    delegate: TableViewDelegate {
                         implicitWidth: 90
                         implicitHeight: 36
-                        text: model.display ?? ""
-                        // We don't create data for empty cells to reduce
-                        // the memory usage in case of huge model.
-                        // If a cell does not have data and it's not highlighted neither
-                        // the model.highlight is undefined which is replaced with false value.
-                        highlight: model.highlight ?? false
-                        edit: model.edit ?? ""
-
-                        onCommit: text => model.edit = text
+                        leftPadding: 4
+                        topPadding: 4
+
+                        // This binding is used to avoid reimplementing whole background and
+                        // updates only the background.color when the color scheme has changed
+                        // for the target cells of drop event.
+                        Binding {
+                            target: background
+                            property: "color"
+                            value: Qt.styleHints.colorScheme === Qt.Dark
+                                   ? palette.highlight.darker(1.9)
+                                   : palette.highlight.lighter(1.9)
+                            when: model.highlight ?? false
+                        }
                     }
 
                     Keys.onPressed: function (event) {
diff --git a/examples/quickcontrols/spreadsheets/Spreadsheets/TableCell.qml b/examples/quickcontrols/spreadsheets/Spreadsheets/TableCell.qml
deleted file mode 100644
index 80941ad79a..0000000000
--- a/examples/quickcontrols/spreadsheets/Spreadsheets/TableCell.qml
+++ /dev/null
@@ -1,41 +0,0 @@
-// Copyright (C) 2024 The Qt Company Ltd.
-// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
-
-import QtQuick
-import QtQuick.Controls
-
-Rectangle {
-    id: root
-    clip: true
-
-    property alias text: textItem.text
-    property bool highlight: false
-    required property bool current
-    required property bool selected
-    required property bool editing
-    required property string edit
-
-    signal commit(text: string)
-
-    readonly property bool __darkMode: Qt.styleHints.colorScheme === Qt.Dark
-    border {
-        width: (!editing && current) ? 1 : 0
-        color: current ? palette.highlight.darker(__darkMode ? 0.7 : 1.9) : palette.base
-    }
-    readonly property color __highlight_color: __darkMode
-                                               ? palette.highlight.darker(1.9)
-                                               : palette.highlight.lighter(1.9)
-    color: highlight ? __highlight_color : selected ? palette.highlight : palette.base
-
-    Label {
-        id: textItem
-        anchors { fill: parent; margins: 5 }
-        visible: !root.editing
-    }
-
-    TableView.editDelegate: TextField {
-        anchors.fill: root
-        text: root.edit
-        TableView.onCommit: root.commit(text)
-    }
-}