microsoft / microsoft/microsoft-ui-xaml
Drag-and-Drop Event and Visual State Issues with TreeViewItem in WinUI 3
Nobody has claimed this yet.
- Dominant language
- C++
- Stars
- 8.4k
- Forks
- 942
- Avg merge
- 2d 7h
- Merged PRs (30d)
- 105
Description
### Describe the bug
There have been two issues found while using the drag-and-drop feature with `TreeViewItem`:
### 'DragOver' and 'Drop' Events Not Triggered
When dragging an element from a different component onto a `TreeViewItem`, the `DragOver` and `Drop` events are not triggered if the item is hovered over or dropped **directly** without interacting with other items first. However, if multiple items are hovered over sequentially, the events fire as expected, starting from the second item onward.

**UPDATE**: The proposed workaround for this issue was to use the `DragEnter` event instead, which does work. However, I still find it inconsistent that two similar events get triggered differently. Moreover, `DragOver` is the only event handler that is proposed to accept the request in this article, which seems a bit confusing: https://learn.microsoft.com/en-us/windows/apps/design/input/drag-and-drop
### Stuck 'PointerOver' Visual State
Dragging an element from a different component and dropping it onto a `TreeViewItem` causes the item to remain stuck in the `PointerOver` visual state forever, unless it gets touched with another dragged item again.

The workaround for the 2nd issue by using `VisualStateManager.GoToState` **has issues as well**. Although it can force the visual state to revert to `Normal`, this only works if the state was set **after** the pointer left the item. If it was set while the pointer was on the item, the item will revert to its wrong `PointerOver` state again as soon as the pointer is out. To fully resolve the issue, the `VisualStateManager.GoToState` has to be put inside the `PointerExit` event handler.
### Steps to reproduce the bug
1. Run the project: https://github.com/datskiy/TreeViewItemDropIssue
2. Drag the pink square and hover over or drop it **directly** onto any `TreeViewItem`, without touching any other items.
3. Observe that the `DragOver` and `Drop` events **are not triggered** unless you hover over multiple items first. The drop will fire the `DragLeave` event only.
4. Drop the element onto a `TreeViewItem` and observe that the chosen `TreeViewItem` item gets **stuck** in the `PointerOver` state.
### Expected behavior
- `DragOver` and `Drop` events should consistently trigger when interacting with `TreeViewItem`.
- `TreeViewItem` should properly transition out of the `PointerOver` visual state after a drop operation.
### Screenshots
_No response_
### NuGet package version
WinUI 3 - Windows App SDK 1.6.3: 1.6.241114003
### Windows version
Windows 11 (24H2): Build 26100
### Additional context
The `VisualStateManager` workaround mentioned above might help with the stuck `PointerOver` state, but only when the pointer exited the item.
Source code: https://github.com/datskiy/TreeViewItemDropIssue
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by running the linked TreeViewItemDropIssue reproduction project with Windows App SDK 1.6.3 and observe the DragOver, Drop, DragLeave, and PointerOver behavior. Then inspect the TreeViewItem drag-and-drop event handling and visual-state transitions; done means direct drops consistently raise the expected events and the item leaves PointerOver after the operation.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- cpp
- Domain
- desktop
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100