Skip to content

2.7. Picker UI

Claudius Iacob edited this page Nov 22, 2021 · 4 revisions

Picker UI

What it Is

The Picker is a widget dedicated to making lists of things. MAIDENS often requires that the user provides data, which is a list of sorts: the clefs to use in a staff system, the weighted durations to use in a generator, etc. In order to deliver such lists you need a way to put together a subset from one (or more) existing sets.

How does it look/behave

The Picker is a compound component, comprised of a permanently visible list and a pop-up window. They both display the same data. The list only provides the ability to delete and nudge existing items. To add new ones, the pop-up window is required.

The list displays inline. It is selectable and provides buttons for deleting or nudging the selection, and one button for opening the pop-up. While the pop-up is open, the content of the list is inaccessible.

The window is floating and has fully adjustable position and size. It entails two panels. The left panel houses one or more available data-sets; they are served by a tab bar, which enables switching among them. A data-set, once engaged via the tab bar, shows a listing of its available items. The right panel is a collector: it holds all the individual items received from the left. Between the panels there are buttons for adding or removing items to/from the collector; next to the collector panel there are buttons for re-ordering the collected items, if their order should matter once reported back to MAIDENS. To the bottom of the window there are buttons for confirming or reverting your changes; they become available as you alter the collector's panel content.

Unlike the inline list, the floating window of the Picker component is not a live widget: you must click Apply to send collected items into MAIDENS. If you would like to observe the effect of your changes as you go, untick auto close to prevent a click on either Apply or Revert buttons from dismissing the window.

What to Use it For

You use the Picker to aggregate and deliver lists of choices, wherever requested in the application. For instance, both the Editor and Configuration (Legacy) UIs make use of pickers.

Clone this wiki locally