fix bug #315

src/Qt5/imports/FluentUI/Controls/FluTableView.qml

@@ -32,10 +32,11 @@ Rectangle {
     }
     QtObject{
         id:d
+        property var currentRow
+        property int rowHoverIndex: -1
         property int defaultItemWidth: 100
         property int defaultItemHeight: 42
         property var header_rows:[]
-        property bool selectionFlag: true
         function obtEditDelegate(column,row,cellItem){
             var display = table_model.data(table_model.index(row,column),"display")
             var cellPosition = cellItem.mapToItem(scroll_table, 0, 0)
@@ -232,7 +233,12 @@ Rectangle {
             delegate: Rectangle {
                 id:item_table
                 property point position: Qt.point(column,row)
-                color: (row%2!==0) ? control.color : (FluTheme.dark ? Qt.rgba(1,1,1,0.06) : Qt.rgba(0,0,0,0.06))
+                color:{
+                    if(d.rowHoverIndex === row || d.currentRow === table_model.getRow(row).__index){
+                        return FluTheme.dark ? Qt.rgba(1,1,1,0.06) : Qt.rgba(0,0,0,0.06)
+                    }
+                    return (row%2!==0) ? control.color : (FluTheme.dark ? Qt.rgba(1,1,1,0.015) : Qt.rgba(0,0,0,0.015))
+                }
                 implicitHeight: 40
                 implicitWidth: {
                     var w = columnSource[column].width
@@ -249,6 +255,18 @@ Rectangle {
                     visible: !item_loader.sourceComponent
                     color: "#00000000"
                 }
+                Rectangle{
+                    height: 18
+                    radius: 1.5
+                    color: FluTheme.primaryColor.dark
+                    width: 3
+                    visible: d.currentRow === table_model.getRow(row).__index && column === 0
+                    anchors{
+                        verticalCenter: parent.verticalCenter
+                        left: parent.left
+                        leftMargin: 3
+                    }
+                }
                 MouseArea{
                     anchors.fill: parent
                     acceptedButtons: Qt.LeftButton
@@ -267,8 +285,8 @@ Rectangle {
                     }
                     onClicked:
                         (event)=>{
+                            d.currentRow = table_model.getRow(row).__index
                             item_loader.sourceComponent = undefined
-                            d.selectionFlag = !d.selectionFlag
                             event.accepted = true
                         }
                 }
@@ -294,6 +312,19 @@ Rectangle {
                         return com_text
                     }
                 }
+                MouseArea{
+                    acceptedButtons: Qt.NoButton
+                    anchors.fill: parent
+                    hoverEnabled: true
+                    z:99
+                    onContainsMouseChanged: {
+                        if(containsMouse){
+                            d.rowHoverIndex = row
+                        }else{
+                            d.rowHoverIndex = -1
+                        }
+                    }
+                }
             }
         }
         Loader{
@@ -310,6 +341,20 @@ Rectangle {
                 table_model.setRow(row,obj)
             }
         }
+        MouseArea{
+            acceptedButtons: Qt.NoButton
+            anchors.fill: item_loader
+            enabled: item_loader.sourceComponent
+            hoverEnabled: true
+            z:10
+            onContainsMouseChanged: {
+                if(containsMouse){
+                    d.rowHoverIndex = item_loader.row
+                }else{
+                    d.rowHoverIndex = -1
+                }
+            }
+        }
     }
     Component{
         id:com_handle
@@ -350,7 +395,6 @@ Rectangle {
             implicitWidth: item_column_loader.item.implicitWidth + (cellPadding * 2)
             implicitHeight: Math.max(36, item_column_loader.item.implicitHeight + (cellPadding * 2))
             color:{
-                d.selectionFlag
                 if(column_item_control_mouse.pressed){
                     return control.pressedButtonColor
                 }
@@ -373,7 +417,6 @@ Rectangle {
                 onClicked:
                     (event)=>{
                         closeEditor()
-                        d.selectionFlag = !d.selectionFlag
                     }
             }
             Loader{
@@ -473,7 +516,6 @@ Rectangle {
             implicitWidth: Math.max(30, row_text.implicitWidth + (cellPadding * 2))
             implicitHeight: row_text.implicitHeight + (cellPadding * 2)
             color: {
-                d.selectionFlag
                 if(item_control_mouse.pressed){
                     return control.pressedButtonColor
                 }
@@ -501,7 +543,6 @@ Rectangle {
                 onClicked:
                     (event)=>{
                         closeEditor()
-                        d.selectionFlag = !d.selectionFlag
                     }
             }
             MouseArea{

src/Qt6/imports/FluentUI/Controls/FluTableView.qml

@@ -8,9 +8,9 @@ import FluentUI
 Rectangle {
     property var columnSource
     property var dataSource
-    property color selectionColor: Qt.alpha(FluTheme.primaryColor.lightest,0.6)
+    property color selectionColor: FluTools.colorAlpha(FluTheme.primaryColor.lightest,0.6)
-    property color hoverButtonColor: Qt.alpha(selectionColor,0.2)
+    property color hoverButtonColor: FluTools.colorAlpha(selectionColor,0.2)
-    property color pressedButtonColor: Qt.alpha(selectionColor,0.4)
+    property color pressedButtonColor: FluTools.colorAlpha(selectionColor,0.4)
     property alias tableModel: table_model
     id:control
     color: FluTheme.dark ? Qt.rgba(39/255,39/255,39/255,1) : Qt.rgba(251/255,251/255,253/255,1)
@@ -33,13 +33,13 @@ Rectangle {
     }
     QtObject{
         id:d
+        property var currentRow
+        property int rowHoverIndex: -1
         property int defaultItemWidth: 100
         property int defaultItemHeight: 42
         property var header_rows:[]
-        property bool selectionFlag: true
+        function obtEditDelegate(column,row,cellItem){
-        function obtEditDelegate(column,row){
             var display = table_model.data(table_model.index(row,column),"display")
-            var cellItem = table_view.itemAtCell(column, row)
             var cellPosition = cellItem.mapToItem(scroll_table, 0, 0)
             item_loader.column = column
             item_loader.row = row
@@ -180,16 +180,11 @@ Rectangle {
                 id:model_columns
             }
             boundsBehavior: Flickable.StopAtBounds
-            ScrollBar.horizontal: FluScrollBar{}
+            ScrollBar.horizontal: FluScrollBar{
-            ScrollBar.vertical: FluScrollBar{}
+                id:scroll_bar_h
-            selectionModel: ItemSelectionModel {
+            }
-                id:selection_model
+            ScrollBar.vertical: FluScrollBar{
-                model: table_model
+                id:scroll_bar_v
-                onSelectionChanged: {
-                    if(selection_rect.dragging){
-                        d.selectionFlag = !d.selectionFlag
-                    }
-                }
             }
             columnWidthProvider: function(column) {
                 var w = columnSource[column].width
@@ -239,8 +234,12 @@ Rectangle {
             delegate: Rectangle {
                 id:item_table
                 property point position: Qt.point(column,row)
-                required property bool selected
+                color:{
-                color: (row%2!==0) ? control.color : (FluTheme.dark ? Qt.rgba(1,1,1,0.06) : Qt.rgba(0,0,0,0.06))
+                    if(d.rowHoverIndex === row || d.currentRow === table_model.getRow(row).__index){
+                        return FluTheme.dark ? Qt.rgba(1,1,1,0.06) : Qt.rgba(0,0,0,0.06)
+                    }
+                    return (row%2!==0) ? control.color : (FluTheme.dark ? Qt.rgba(1,1,1,0.015) : Qt.rgba(0,0,0,0.015))
+                }
                 implicitHeight: 40
                 implicitWidth: {
                     var w = columnSource[column].width
@@ -255,35 +254,40 @@ Rectangle {
                 Rectangle{
                     anchors.fill: parent
                     visible: !item_loader.sourceComponent
-                    color: selected ? control.selectionColor : "#00000000"
+                    color: "#00000000"
+                }
+                Rectangle{
+                    height: 18
+                    radius: 1.5
+                    color: FluTheme.primaryColor.dark
+                    width: 3
+                    visible: d.currentRow === table_model.getRow(row).__index && column === 0
+                    anchors{
+                        verticalCenter: parent.verticalCenter
+                        left: parent.left
+                        leftMargin: 3
+                    }
                 }
                 MouseArea{
                     anchors.fill: parent
                     acceptedButtons: Qt.LeftButton
                     onPressed:{
                         closeEditor()
-                        table_view.interactive = false
                     }
                     onCanceled: {
-                        table_view.interactive = true
                     }
                     onReleased: {
-                        table_view.interactive = true
                     }
                     onDoubleClicked:{
                         if(typeof(display) == "object"){
                             return
                         }
-                        item_loader.sourceComponent = d.obtEditDelegate(column,row)
+                        item_loader.sourceComponent = d.obtEditDelegate(column,row,item_table)
                     }
                     onClicked:
                         (event)=>{
+                            d.currentRow = table_model.getRow(row).__index
                             item_loader.sourceComponent = undefined
-                            if(!(event.modifiers & Qt.ControlModifier)){
-                                selection_model.clear()
-                            }
-                            selection_model.select(table_model.index(row,column),ItemSelectionModel.Select)
-                            d.selectionFlag = !d.selectionFlag
                             event.accepted = true
                         }
                 }
@@ -292,7 +296,7 @@ Rectangle {
                     property var modelData: display
                     property var tableView: table_view
                     property var tableModel: table_model
-                    property point position: item_table.position
+                    property var position: item_table.position
                     property int row: position.y
                     property int column: position.x
                     property var options: {
@@ -309,6 +313,19 @@ Rectangle {
                         return com_text
                     }
                 }
+                MouseArea{
+                    acceptedButtons: Qt.NoButton
+                    anchors.fill: parent
+                    hoverEnabled: true
+                    z:99
+                    onContainsMouseChanged: {
+                        if(containsMouse){
+                            d.rowHoverIndex = row
+                        }else{
+                            d.rowHoverIndex = -1
+                        }
+                    }
+                }
             }
         }
         Loader{
@@ -325,22 +342,25 @@ Rectangle {
                 table_model.setRow(row,obj)
             }
         }
+        MouseArea{
+            acceptedButtons: Qt.NoButton
+            anchors.fill: item_loader
+            enabled: item_loader.sourceComponent
+            hoverEnabled: true
+            z:10
+            onContainsMouseChanged: {
+                if(containsMouse){
+                    d.rowHoverIndex = item_loader.row
+                }else{
+                    d.rowHoverIndex = -1
+                }
+            }
+        }
     }
     Component{
         id:com_handle
         Item {}
     }
-    SelectionRectangle {
-        id:selection_rect
-        target: table_view
-        bottomRightHandle:com_handle
-        topLeftHandle: com_handle
-        onDraggingChanged: {
-            if(!dragging){
-                table_view.interactive = true
-            }
-        }
-    }
 
     Component{
         id:com_column_text
@@ -348,10 +368,6 @@ Rectangle {
             id: column_text
             text: modelData
             anchors.fill: parent
-            font.bold:{
-                d.selectionFlag
-                return selection_model.columnIntersectsSelection(column)
-            }
             horizontalAlignment: Text.AlignHCenter
             verticalAlignment: Text.AlignVCenter
         }
@@ -380,13 +396,9 @@ Rectangle {
             implicitWidth: item_column_loader.item.implicitWidth + (cellPadding * 2)
             implicitHeight: Math.max(36, item_column_loader.item.implicitHeight + (cellPadding * 2))
             color:{
-                d.selectionFlag
                 if(column_item_control_mouse.pressed){
                     return control.pressedButtonColor
                 }
-                if(selection_model.isColumnSelected(column)){
-                    return control.hoverButtonColor
-                }
                 return column_item_control_mouse.containsMouse&&!canceled ? control.hoverButtonColor :  FluTheme.dark ? Qt.rgba(50/255,50/255,50/255,1) : Qt.rgba(247/255,247/255,247/255,1)
             }
             border.color: FluTheme.dark ? "#252525" : "#e4e4e4"
@@ -406,13 +418,6 @@ Rectangle {
                 onClicked:
                     (event)=>{
                         closeEditor()
-                        if(!(event.modifiers & Qt.ControlModifier)){
-                            selection_model.clear()
-                        }
-                        for(var i=0;i<=table_view.rows;i++){
-                            selection_model.select(table_model.index(i,column),ItemSelectionModel.Select)
-                        }
-                        d.selectionFlag = !d.selectionFlag
                     }
             }
             Loader{
@@ -502,6 +507,9 @@ Rectangle {
                 return []
             }
         }
+        onContentYChanged: {
+            forceLayout()
+        }
         delegate: Rectangle{
             id:item_control
             readonly property real cellPadding: 8
@@ -509,13 +517,9 @@ Rectangle {
             implicitWidth: Math.max(30, row_text.implicitWidth + (cellPadding * 2))
             implicitHeight: row_text.implicitHeight + (cellPadding * 2)
             color: {
-                d.selectionFlag
                 if(item_control_mouse.pressed){
                     return control.pressedButtonColor
                 }
-                if(selection_model.isRowSelected(row)){
-                    return control.hoverButtonColor
-                }
                 return item_control_mouse.containsMouse&&!canceled ? control.hoverButtonColor :  FluTheme.dark ? Qt.rgba(50/255,50/255,50/255,1) : Qt.rgba(247/255,247/255,247/255,1)
             }
             border.color: FluTheme.dark ? "#252525" : "#e4e4e4"
@@ -523,10 +527,6 @@ Rectangle {
                 id:row_text
                 anchors.centerIn: parent
                 text: row + 1
-                font.bold:{
-                    d.selectionFlag
-                    return selection_model.rowIntersectsSelection(row)
-                }
             }
             MouseArea{
                 id:item_control_mouse
@@ -544,13 +544,6 @@ Rectangle {
                 onClicked:
                     (event)=>{
                         closeEditor()
-                        if(!(event.modifiers & Qt.ControlModifier)){
-                            selection_model.clear()
-                        }
-                        for(var i=0;i<=columnSource.length;i++){
-                            selection_model.select(table_model.index(row,i),ItemSelectionModel.Select)
-                        }
-                        d.selectionFlag = !d.selectionFlag
                     }
             }
             MouseArea{
@@ -608,7 +601,8 @@ Rectangle {
         item_loader.sourceComponent = null
     }
     function resetPosition(){
-        table_view.positionViewAtCell(Qt.point(0, 0),Qt.AlignTop|Qt.AlignLeft)
+        scroll_bar_h.position = 0
+        scroll_bar_v.position = 0
     }
     function customItem(comId,options={}){
         var o = {}