Feature/drag selection rectangle by godlytalias · Pull Request #344 · w-ahmad/WinUI.TableView

godlytalias · 2026-04-09T18:37:00Z

Add Drag Selection Rectangle ( #334 )

Adds a semi-transparent rectangle overlay during cell/row drag selection, providing visual feedback similar to File Explorer's drag-select experience.

DragSelection.mp4

Feature Overview

Visual drag rectangle — A semi-transparent accent-colored rectangle follows the mouse from the drag start point to the current pointer position, clamped to the viewport. The rectangle extends naturally when content scrolls (start point adjusts for scroll offset).
Auto-scroll — When the pointer is near the top/bottom/left/right edges during drag, the view auto-scrolls with speed proportional to edge proximity. Vertical scroll uses a DispatcherTimer (16ms/~60fps) with ScrollViewer.ChangeView; horizontal scroll uses the existing HorizontalOffset DP pattern.
Scroll-sync — Selection updates for newly visible rows during auto-scroll or mouse-wheel scroll via ScrollViewer.ViewChanged handler with hit-test at the clamped pointer position.
ShowDragRectangle property — New bool dependency property (default: true) to enable/disable the rectangle. Setting to false mid-drag correctly tears down the rectangle. The underlying drag selection behavior (cell/row selection via pointer movement) is unaffected by this property.

Files Changed

File	Change
`src/TableView.Properties.cs`	`ShowDragRectangle` DP + property changed callback
`src/TableView.cs`	Drag rectangle fields, `StartDragRectangle`, `UpdateDragRectangleVisual`, `PositionDragRectangle`, auto-scroll timer, `ViewChanged` handler, `FindCellAtCanvasPoint`, `EndDragRectangle` cleanup, `OnCurrentCellChanged` drag optimization, `OnCellSelectionChanged` coalescing, `OnUnloaded` cleanup
`src/TableViewCell.cs`	`OnPointerPressed` starts drag, `OnPointerReleased` ends drag, `OnPointerCaptureLost` safety net, `OnManipulationDelta` updates rectangle visual, `TransformPointToCanvas` helper, `ApplyCurrentCellState(skipFocus)`
`src/Themes/Resources.xaml`	Theme resources for Light, Dark, HighContrast (fill, stroke, corner radius)
`src/Themes/TableView.xaml`	`Canvas` + `Border` overlay in control template (`Grid.Row="1"`, `IsHitTestVisible="False"`)
`samples/.../SelectionPage.xaml`	`ShowDragRectangle` ToggleSwitch + code substitution
`tests/DragSelectionRectangleTests.cs`	16 unit tests covering property defaults, drag lifecycle, selection mode guards, idempotency

Lifecycle

PointerPressed → CapturePointer + StartDragRectangle (hook ViewChanged, init state)
ManipulationDelta → UpdateDragRectangleVisual (position rectangle + auto-scroll)
                  → FindCell + MakeSelection (same path as non-rectangle)
ViewChanged → PositionDragRectangle (adjust for scroll) + FindCellAtCanvasPoint + MakeSelection
PointerReleased → EndDragRectangle (stop timer, unhook events, restore focus/scroll)
PointerCaptureLost → EndDragRectangle (safety net)

Signed-off-by: Godly Alias <godlyalias@microsoft.com>

w-ahmad · 2026-04-10T21:41:02Z

Thanks for the PR @godlytalias, it looks great. Quick question: can we enable auto-scroll even when ShowDragRectangle is set to false? Currently the selection stops at the last visible cell without the drag rectangle.

godlytalias · 2026-04-11T15:14:48Z

Thanks for the PR @godlytalias, it looks great. Quick question: can we enable auto-scroll even when ShowDragRectangle is set to false? Currently the selection stops at the last visible cell without the drag rectangle.

@w-ahmad Sounds good, I guess we should then expose a property for devs to toggle it and have to keep it disabled by default for not breaking current behavior? We can enable the behavior only when DragSelectionRectangle being enabled? Or do you have different opinion?

w-ahmad · 2026-04-12T09:33:52Z

@w-ahmad Sounds good, I guess we should then expose a property for devs to toggle it and have to keep it disabled by default for not breaking current behavior? We can enable the behavior only when DragSelectionRectangle being enabled? Or do you have different opinion?

I think the auto-scroll must be there even when the DragSelectionRectangle is not visible and there is no need to add property to turn it on or off. This is because most DataGrid controls (tried on WPF and Synfusion) and even Excel offers it by default. The DragSelectionRectangle is a new feature for TableView, for which you’ve already added a flag property to turn it on or off.

godlytalias · 2026-04-13T06:08:41Z

@w-ahmad Sounds good, I guess we should then expose a property for devs to toggle it and have to keep it disabled by default for not breaking current behavior? We can enable the behavior only when DragSelectionRectangle being enabled? Or do you have different opinion?

I think the auto-scroll must be there even when the DragSelectionRectangle is not visible and there is no need to add property to turn it on or off. This is because most DataGrid controls (tried on WPF and Synfusion) and even Excel offers it by default. The DragSelectionRectangle is a new feature for TableView, for which you’ve already added a flag property to turn it on or off.

Okay sure, I will keep the autoscroll turned on by default then. Thanks

Signed-off-by: Godly Alias <godlyalias@microsoft.com>

w-ahmad · 2026-04-16T17:52:15Z

+    /// <summary>
+    /// Identifies the <see cref="ShowDragRectangle"/> dependency property.
+    /// </summary>
+    public static readonly DependencyProperty ShowDragRectangleProperty = DependencyProperty.Register(nameof(ShowDragRectangle), typeof(bool), typeof(TableView), new PropertyMetadata(false, OnShowDragRectangleChanged));


Let's set the default value to true.

w-ahmad · 2026-04-16T18:06:13Z

+            _dragRectangle.Width = 0;
+            _dragRectangle.Height = 0;
+
+            _dragRectangle.Visibility = Visibility.Visible;


I suggest setting the visibility on the drag canvas itself to reduce the number of elements loading at the start and if ShowDragRectangle is set to false, the canvas won’t load at all.

Actually even if we keep visibility as 'collapsed', the element would still be loaded just that it won't participate in rendering, https://learn.microsoft.com/en-us/uwp/api/windows.ui.xaml.uielement.visibility?view=winrt-28000#remarks

If the concern is about reducing elements, we may have to add logic for x:load here

That's interesting. I'll leave it up to you—if there's no need to set the visibility on the canvas itself, then keep it as is. If you think x:Load could make a difference, go ahead and use it.

w-ahmad · 2026-04-16T18:07:35Z

    private bool _ensureColumns = true;
    private readonly List<TableViewRow> _rows = [];
    private readonly CollectionView _collectionView = [];
+    internal Canvas? _dragRectangleCanvas;


Making a field internal feels a bit unusual.

Kept it internal as these fields are to be accessed by TableViewCell class as well but not to be exposed outside the assembly. Whether you think differently?

Got it, let’s turn them into internal properties then.

w-ahmad · 2026-04-16T18:07:52Z

+    internal Canvas? _dragRectangleCanvas;
+    private Border? _dragRectangle;
+    private Point? _dragStartPoint;
+    internal bool _isDragSelecting;


Making a field internal feels a bit unusual.

same as above

godlytalias added 5 commits April 9, 2026 00:52

Drag Selection Rectangle

b738e25

Signed-off-by: Godly Alias <godlyalias@microsoft.com>

Refining implementation

ab6db6e

Signed-off-by: Godly Alias <godlyalias@microsoft.com>

Fix for drag selection during scroll

6ba4a6e

Signed-off-by: Godly Alias <godlyalias@microsoft.com>

Fix for tests

fc34cd8

Signed-off-by: Godly Alias <godlyalias@microsoft.com>

Fix for tests

37df896

Signed-off-by: Godly Alias <godlyalias@microsoft.com>

w-ahmad linked an issue Apr 12, 2026 that may be closed by this pull request

Drag Selection Rectangle (Rubber-Band Selection) #334

Open

Changes to split auto scroll & Drag selection rectangle

4000f1d

Signed-off-by: Godly Alias <godlyalias@microsoft.com>

w-ahmad reviewed Apr 16, 2026

View reviewed changes

joelspadin mentioned this pull request Apr 17, 2026

Built-in selection behavior conflicts with custom drag handling #346

Open

Uh oh!

Conversation

godlytalias commented Apr 9, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Add Drag Selection Rectangle ( #334 )

Feature Overview

Files Changed

Lifecycle

Uh oh!

w-ahmad commented Apr 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

godlytalias commented Apr 11, 2026

Uh oh!

w-ahmad commented Apr 12, 2026

Uh oh!

godlytalias commented Apr 13, 2026

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

godlytalias commented Apr 9, 2026 •

edited

Loading

w-ahmad commented Apr 10, 2026 •

edited

Loading