Added item-pointer-event to StdListView (#3165)

CHANGELOG.md

@@ -20,6 +20,7 @@ All notable changes to this project are documented in this file.
  - Fixed duplicated import when importing file relative to the project instead of the current path. Deprecated importing files relative to the project path.
  - Added `current-item-changed` to `StandardListView`
  - Added `current-row-changed` to `StandardTableView`
+ - Added `item-pointer-event` to `StandardListView`
 
 ### Rust API
 

docs/language/src/builtins/widgets.md

@@ -417,6 +417,7 @@ Same as [`ListView`](#listview), and in addition:
 ### Callbacks
 
 -   **`current-item-changed(`_`int`_`)`**: Emitted when the current item has changed because the user modified it
+-   **`item-pointer-event(`_`index: int`_`, `_`event: PointerEvent`_`, `_`pos: Point`_`)`**: Emitted on any mouse pointer event similar to `TouchArea`. Arguments are item index associated with the event, the `PointerEvent` itself and the mouse position within the listview.
 
 ### Example
 

internal/compiler/widgets/fluent-base/components.slint

@@ -34,9 +34,12 @@ export component MenuBorder inherits Rectangle {
 
 export component ListItem {
     callback clicked <=> i-touch-area.clicked;
+    callback pointer-event <=> i-touch-area.pointer-event;
 
     in property <bool> selected;
     in property <string> text <=> i-text.text;
+    out property <length> mouse-x <=> i-touch-area.mouse-x;
+    out property <length> mouse-y <=> i-touch-area.mouse-y;
 
     min-width: i-layout.min-width;
     min-height: max(34px, i-layout.min-height);

internal/compiler/widgets/fluent-base/listview.slint

@@ -13,6 +13,7 @@ component StandardListViewBase inherits ListView {
     private property <length> current-item-y: self.viewport-y + current-item * item-height;
 
     callback current-item-changed(int /* current-item */);
+    callback item-pointer-event(int /* item-index */, PointerEvent /* event */, Point /* absolute mouse position */);
 
     in property<[StandardListViewItem]> model;
     in-out property<int> current-item: -1;
@@ -25,6 +26,13 @@ component StandardListViewBase inherits ListView {
         clicked => {
             root.set-current-item(index);
         }
+
+        pointer-event(pe) => {
+            root.item-pointer-event(index, pe, {
+                x: self.absolute-position.x + self.mouse-x - root.absolute-position.x,
+                y: self.absolute-position.y + self.mouse-y - root.absolute-position.y,
+            });
+        }
     }
 
     public function set-current-item(index: int) {

internal/compiler/widgets/material-base/components.slint

@@ -92,9 +92,12 @@ export component StateLayer inherits TouchArea {
 // A selectable item that is used by `StandardListView` and  `ComboBox`.
 export component ListItem inherits Rectangle {
     callback clicked <=> i-state-layer.clicked;
+    callback pointer-event <=> i-state-layer.pointer-event;
 
     in property<bool> selected;
     in property<string> text;
+    out property <length> mouse-x <=> i-state-layer.mouse-x;
+    out property <length> mouse-y <=> i-state-layer.mouse-y;
 
     height: max(48px, i-layout.min-height);
 

internal/compiler/widgets/material-base/listview.slint

@@ -15,6 +15,7 @@ component StandardListViewBase inherits ListView {
     private property <length> current-item-y: self.viewport-y + current-item * item-height;
 
     callback current-item-changed(int /* current-item */);
+    callback item-pointer-event(int /* item-index */, PointerEvent /* event */, Point /* absolute mouse position */);
 
     in property <[StandardListViewItem]> model;
     in-out property <int> current-item: -1;
@@ -26,6 +27,13 @@ component StandardListViewBase inherits ListView {
         clicked => {
             set-current-item(idx);
         }
+
+        pointer-event(pe) => {
+            root.item-pointer-event(idx, pe, {
+                x: self.absolute-position.x + self.mouse-x - root.absolute-position.x,
+                y: self.absolute-position.y + self.mouse-y - root.absolute-position.y,
+            });
+        }
     }
 
     public function set-current-item(index: int) {

internal/compiler/widgets/native/std-widgets.slint

@@ -172,6 +172,7 @@ component StandardListViewBase inherits ListView {
     private property <length> current-item-y: self.viewport-y + current-item * item-height;
 
     callback current-item-changed(int /* current-item */);
+    callback item-pointer-event(int /* item-index */, PointerEvent /* event */, Point /* absolute mouse position */);
 
     in property<[StandardListViewItem]> model;
     in-out property<int> current-item: -1;
@@ -186,6 +187,13 @@ component StandardListViewBase inherits ListView {
             clicked => {
                 set-current-item(i);
             }
+
+            pointer-event(pe) => {
+                root.item-pointer-event(i, pe, {
+                    x: self.absolute-position.x + self.mouse-x - root.absolute-position.x,
+                    y: self.absolute-position.y + self.mouse-y - root.absolute-position.y,
+                });
+            }
         }
     }