Skip to content

feat: Add DropDown UI element to built in UI library#3120

Draft
Acissathar wants to merge 1 commit intostride3d:masterfrom
Acissathar:feat-Add-DropDown-to-stride-ui-library
Draft

feat: Add DropDown UI element to built in UI library#3120
Acissathar wants to merge 1 commit intostride3d:masterfrom
Acissathar:feat-Add-DropDown-to-stride-ui-library

Conversation

@Acissathar
Copy link
Copy Markdown
Contributor

PR Details

Currently, the built in Stride UI library is missing a drop down element. You can probably throw one together yourself with multiple elements (button that onclick turns on a scrollable list, etc), but that's a bit unwieldy for a general purpose dropdown / combobox.

This is sort of a proof a concept, as I need it for my own project but haven't yet really put it through any real use cases and determined what all is missing with regards to functionality. Super dumb version of a dropdown, just a list with Text elements for the buttons and a SelectedIndex.

At a quick level, it supports the following properties for design:

Screenshot 2026-04-04 173351

Placeholder text is used when the Selected Index is -1, but the selected index can be defaulted to an actual item in the list instead if desired.

There is an event that's fired that can be subscribed to know when the index has changed.

It also supports hiding the scroll view when clicking outside of the list.

DropDownPOC

As mentioned above, I plan to use this in my project so there may be more tweaks which is why I'm throwing it up as a draft PR but also so that its out there if anyone has any functionality they think it should have that its missing, want to use it in the meantime, etc.

Related Issue

#2904

Types of changes

  • Docs change / refactoring / dependency upgrade
  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to change)

Checklist

  • My change requires a change to the documentation.
  • I have added tests to cover my changes.
  • All new and existing tests passed.
  • I have built and run the editor to try this change out.

Comment on lines +430 to +446
/// <summary>
/// Traverses the visual tree rooted at <paramref name="root"/> and sets
/// <see cref="DropDown.IsInteractable"/> to <c>false</c> on every <see cref="DropDown"/>
/// found, preventing the control from responding to touch input in the editor viewport.
/// </summary>
private static void DisableDropDownInteraction(UIElement root)
{
if (root is DropDown dropDown)
dropDown.IsInteractable = false;

foreach (var child in root.VisualChildren.BreadthFirst(e => e.VisualChildren))
{
if (child is DropDown childDropDown)
childDropDown.IsInteractable = false;
}
}

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

This seems a bit too specific, it's also fairly heavy and allocates quite a bit, things you could look into:

  • UIElement.IsHierarchyEnabled
  • How the scroll for panel works around this issue if it does.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants