Add support for drag-and-drop in blueprint tree #4910

abey79 · 2024-01-25T16:40:19Z

What

This PR adds support for drag-and-drop in the blueprint tree.

Fixes Interactive layout items in blueprint tree view #2652

drag_and_drop_4.mp4

It has the following known limitations/future work:

Only a single item may be dragged at a time. If multiple items are selected when a drag starts, the selection is set to contain only the dragged item.
- Enforce homogenous multi-selections #4887
Only space view and containers may be dragged. The drag and drop operations only operate on the view hierarchy (not the space view data).
The root container has a special behaviour: it cannot be successfully dragged, and nothing can be dragged before/after it. This is consistent with it being the root container, but inconsistent with how the UI is presented.
- Present the root container as the top-level viewport container and differentiate it from other container #4909
Because of how Grid container work (they support "holes", and tend to swap instead of reflow items when reordering), some drag operation have additional order side effects within the destination (grid) container.
Live preview the effect of a blueprint tree drag-and-drop in progress in the viewport #4916

Checklist

I have read and agree to Contributor Guide and the Code of Conduct
I've included a screenshot or gif (if applicable)
I have tested the web demo (if applicable):
- Using newly built examples: app.rerun.io
- Using examples from latest main build: app.rerun.io
- Using full set of examples from nightly build: app.rerun.io
The PR title and labels are set such as to maximize their usefulness for the next release's CHANGELOG

- `ViewportBlueprint`: added a bunch of tree-walking search functions - updated blueprint tree ui - fully isolated drop logic in a no-dependency file TODO: - ListItem: dont show icons when a drag is ongoing - emit Move tree action - highlight receiving container - remove arrow for root container

TODO: - ListItem: dont show icons when a drag is ongoing - highlight receiving container - remove arrow for root container - back port re_::drag_and_drop::* to re_ui_example

TODO: - highlight receiving container - remove arrow for root container - back port re_::drag_and_drop::* to re_ui_example

TODO: - remove arrow for root container - back port re_::drag_and_drop::* to re_ui_example

TODO: - drag in one-self is not possible - remove arrow for root container - back port re_::drag_and_drop::* to re_ui_example

TODO: - some bugs when self dragging - remove arrow for root container - back port re_::drag_and_drop::* to re_ui_example - check after last items

# Conflicts: # crates/re_space_view_text_log/Cargo.toml

TODO: - check area after last items

nikolausWest · 2024-01-26T09:00:36Z

The effect of the drop in progress should be live previewed in the viewport.

This one seems like it should be turned into an issue / baked into another issue so we don't drop it

abey79 · 2024-01-26T09:07:16Z

The effect of the drop in progress should be live previewed in the viewport.

This one seems like it should be turned into an issue / baked into another issue so we don't drop it

Yes, I opened one and forgot to link it. I'm actually using this tracking issue as "ground truth" todo list:

Tracking Issue: Blueprint Tree UI improvements #3120

nikolausWest · 2024-01-26T17:55:13Z

Excited for this! Such a huge UX win already

crates/re_ui/src/drag_and_drop.rs

Co-authored-by: Emil Ernerfeldt <[email protected]>

crates/re_ui/src/list_item.rs

crates/re_viewport/src/viewport.rs

emilk · 2024-01-30T08:38:00Z

crates/re_ui/src/drag_and_drop.rs

@@ -0,0 +1,320 @@
+//! Helpers for drag and drop support for reordering hierarchical lists.


I really like that this is a completely separate module, with no deps. We could consider moving it to egui; then it could be used for emilk/egui#3903 as well

Yes, that's kind of what I had in mind. I would wait a little bit though and see how it crystallise in the short/mid term.

crates/re_viewport/src/viewport.rs

Co-authored-by: Emil Ernerfeldt <[email protected]>

# Conflicts: # Cargo.lock # Cargo.toml

abey79 added 4 commits January 25, 2024 15:16

First working drag and drop!! 🎉

b73a8cb

TODO: - ListItem: dont show icons when a drag is ongoing - highlight receiving container - remove arrow for root container - back port re_::drag_and_drop::* to re_ui_example

ListItem: don't show icons when a drag is ongoing

73efd74

TODO: - highlight receiving container - remove arrow for root container - back port re_::drag_and_drop::* to re_ui_example

Highlight receiving container

3b6597b

TODO: - remove arrow for root container - back port re_::drag_and_drop::* to re_ui_example

abey79 added ui concerns graphical user interface enhancement New feature or request include in changelog labels Jan 25, 2024

abey79 added 5 commits January 25, 2024 17:44

Lint

b763458

TODO: - drag in one-self is not possible - remove arrow for root container - back port re_::drag_and_drop::* to re_ui_example

Merge branch 'main' into antoine/blueprint_dnd

cfb13a2

Update egui_tile commit ref

d37f60b

TODO: - drag in one-self is not possible - remove arrow for root container - back port re_::drag_and_drop::* to re_ui_example

Fixed self-drag bug + cargo bug from main

e8cfa30

TODO: - some bugs when self dragging - remove arrow for root container - back port re_::drag_and_drop::* to re_ui_example - check after last items

Merge branch 'main' into antoine/blueprint_dnd

747d218

# Conflicts: # crates/re_space_view_text_log/Cargo.toml

abey79 mentioned this pull request Jan 25, 2024

Present the root container as the top-level viewport container and differentiate it from other container #4909

Closed

abey79 added 3 commits January 26, 2024 08:57

Back-port re_ui::drag_and_drop::find_drop_target to re_ui_example

9a967a2

TODO: - check area after last items

Updated to last egui_tile + minor code improvement

9146345

TODO: - check area after last items

Accept drag in the empty space bellow the tree

dea19c9

abey79 marked this pull request as ready for review January 26, 2024 08:29

abey79 mentioned this pull request Jan 26, 2024

Tracking Issue: Blueprint Tree UI improvements #3120

Open

30 tasks

abey79 added 8 commits January 26, 2024 16:55

Merge branch 'main' into antoine/blueprint_dnd

88c36e0

Post merge fixes

492b7c5

WIP

59489b1

Fix stuff due to egui bump

128add0

Update the dnd demo to the new APIs

39adb17

Update the dnd demo to the new APIs

12ccfb1

Merge branch 'main' into antoine/dnd_better_egui_api

82c187c

Remove useless code

21073db

abey79 added the do-not-merge Do not merge this PR label Jan 26, 2024

abey79 added 4 commits January 26, 2024 20:10

Improved docstring

6478006

Unneeded whitespace

4536b47

Bump egui commit to today's master

75749e0

Merge branch 'main' into antoine/blueprint_dnd

de957fb

emilk self-requested a review January 29, 2024 10:39

Fix lint

cb3a755

abey79 removed the do-not-merge Do not merge this PR label Jan 29, 2024

emilk reviewed Jan 29, 2024

View reviewed changes

crates/re_ui/src/drag_and_drop.rs Outdated Show resolved Hide resolved

crates/re_ui/src/drag_and_drop.rs Outdated Show resolved Hide resolved

crates/re_ui/src/drag_and_drop.rs Outdated Show resolved Hide resolved

abey79 and others added 2 commits January 29, 2024 12:52

Update crates/re_ui/src/drag_and_drop.rs

628b0c9

Co-authored-by: Emil Ernerfeldt <[email protected]>

Clarified find_drop_target docstring and improved its signature

8c0d55a

emilk reviewed Jan 29, 2024

View reviewed changes

abey79 added 3 commits January 29, 2024 16:30

Merge branch 'main' into antoine/blueprint_dnd

406e5d7

Review comments: ListItem code clean-up

85d31a9

Review comments: highlighted container clarifications

8dc3aca

emilk approved these changes Jan 30, 2024

View reviewed changes

abey79 and others added 6 commits January 30, 2024 09:45

Update crates/re_viewport/src/viewport.rs

e4b47c0

Co-authored-by: Emil Ernerfeldt <[email protected]>

Merge branch 'main' into antoine/blueprint_dnd

957f8e8

# Conflicts: # Cargo.lock # Cargo.toml

Post merge

2040ab0

Post merge proper

3abcb57

Merge branch 'main' into antoine/blueprint_dnd

7f57f40

Rolled back some ListItem changes that triggered unwanted interactions

b4084fe

abey79 merged commit 1762957 into main Jan 30, 2024
40 checks passed

abey79 deleted the antoine/blueprint_dnd branch January 30, 2024 15:49

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add support for drag-and-drop in blueprint tree #4910

Add support for drag-and-drop in blueprint tree #4910

abey79 commented Jan 25, 2024 •

edited by github-actions bot

Loading

nikolausWest commented Jan 26, 2024

abey79 commented Jan 26, 2024

nikolausWest commented Jan 26, 2024

emilk Jan 30, 2024

abey79 Jan 30, 2024

		@@ -0,0 +1,320 @@
		//! Helpers for drag and drop support for reordering hierarchical lists.

Add support for drag-and-drop in blueprint tree #4910

Add support for drag-and-drop in blueprint tree #4910

Conversation

abey79 commented Jan 25, 2024 • edited by github-actions bot Loading

What

Checklist

nikolausWest commented Jan 26, 2024

abey79 commented Jan 26, 2024

nikolausWest commented Jan 26, 2024

emilk Jan 30, 2024

Choose a reason for hiding this comment

abey79 Jan 30, 2024

Choose a reason for hiding this comment

abey79 commented Jan 25, 2024 •

edited by github-actions bot

Loading