microsoft / microsoft/microsoft-ui-xaml

Drag-and-Drop Event and Visual State Issues with TreeViewItem in WinUI 3

Open
#10,246 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

area-TreeView bug
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.
![Image](https://github.com/user-attachments/assets/b9b082a0-492a-4aab-8ffc-5b31791ad710)

**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.
![Image](https://github.com/user-attachments/assets/58fb2b24-105c-41da-82d4-548991ba1a76)

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

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. 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

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.