Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve the Selection Panel UI for components when a single item is selected #4416

Merged
merged 15 commits into from
Dec 6, 2023

Conversation

abey79
Copy link
Member

@abey79 abey79 commented Dec 1, 2023

What

This PR:

  • adds a new UI verbosity level to distinguish between single- and multi-selection in the Selection Panel;
  • adjusts DataUi impls accordingly;
  • update the UI of for AnnotationContext to use collapsible headers instead of inner scroll areas (there can be many tables for one instance, so inner scroll bars are really annoying);
  • adds a script to log very long AnnotationContext for UI test purposes.

Screenshot

New collapsible-header-based UI for annotation context:

annotation_context_selection_panel.mp4

Also fix this spurious separator (and the related sizing issue) at the top of the hover box:

image

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):
    • Full build: app.rerun.io
    • Partial build: app.rerun.io - Useful for quick testing when changes do not affect examples in any way
  • The PR title and labels are set such as to maximize their usefulness for the next release's CHANGELOG

…selection in the Selection Panel

Also:
- adjust `DataUi` impls accordingly
- add a script to log very long `AnnotationContext` for UI test purposes

TODO:
- [ ] update annotation context UI to use collapsible header

Fixes #4375
@abey79 abey79 changed the title Add a new UI verbosity level to distiguish between single- and multi-selection in the Selection Panel Improve the Selection Panel UI for components when a single item is selected Dec 1, 2023
@abey79 abey79 added ui concerns graphical user interface include in changelog labels Dec 1, 2023
@abey79 abey79 marked this pull request as draft December 1, 2023 10:26
@abey79 abey79 marked this pull request as ready for review December 4, 2023 10:28
@nikolausWest
Copy link
Member

Cool! What happens if I have some data there with say 100k rows?

@abey79
Copy link
Member Author

abey79 commented Dec 4, 2023

Well, this 😅
image

If I comply with this 16-bit limit (=> 65k items), the UI becomes sluggish (115ms on my computer) whenever the collapsing header for the corresponding table is open. That's because the entire table is drawn at every frame. Not ideal, but this isn't actually a regression for this PR. There might be ways to optimise that though.

sluggish_ui_65k_annotations.mp4

Edit: #4426

crates/re_viewer_context/src/component_ui_registry.rs Outdated Show resolved Hide resolved
crates/re_viewer/src/ui/selection_panel.rs Outdated Show resolved Hide resolved
crates/re_data_ui/src/lib.rs Show resolved Hide resolved
crates/re_data_ui/src/instance_path.rs Outdated Show resolved Hide resolved
crates/re_data_ui/src/annotation_context.rs Outdated Show resolved Hide resolved
}
UiVerbosity::SelectionPanel => {
// We're alone in the selection panel. Let the outer ScrollArea do the work.
table.auto_shrink([false, true]).vscroll(false)
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I suggest we only disable scrolling if the number of elements in the table is small enough, to avoid the performance problem in #4426

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As per discussion yesterday, let's try to address that at egui::Table level. If that fail, I'll do another PR with hard-coded limits. I've tagged this issue with 0.12 so we dont forget:

@abey79 abey79 merged commit 9ad5a0d into main Dec 6, 2023
40 checks passed
@abey79 abey79 deleted the antoine/single-selection-panel branch December 6, 2023 12:26
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
include in changelog ui concerns graphical user interface
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Add a verbosity specific to the Selection Panel when a single item is selected
4 participants