android-fhir icon indicating copy to clipboard operation
android-fhir copied to clipboard

Published 20 hours ago • verified publisher icon google

Allow typing to filter in the Dropdown widget if drop down has a large number of answer options

Open joiskash opened this issue 3 years ago • 9 comments

Is your feature request related to a problem? Please describe. Currently the drop down widget has the keypad disabled, if we have a large number of answer options, we have to scroll through the entire set to find the answer.

Describe the solution you'd like If the drop down has a large number of answer options, we should enable to keypad to filter. This can also be decided based on the screen size. eg: Small screens can display a fewer number of answer options than large screens. So the number of answer options to allow filtering should not be a hard coded value but should be a function of the screen size.

joiskash avatar Aug 31 '21 12:08 joiskash

It is also a good idea to sort the drop down list so that user can visually navigate to the correct value...

kumaakh avatar Aug 31 '21 14:08 kumaakh

Re-opening this for the drop down widget

joiskash avatar Aug 24 '22 06:08 joiskash

@joiskash does the autoComplete not solve for this?

fredhersch avatar Aug 30 '22 06:08 fredhersch

Nope, this is related to having a drop down with autocomplete for filtering. In the "autocomplete" widget there is no way to look at all the answer options.

joiskash avatar Aug 30 '22 09:08 joiskash

@shelaghm can you help here with a design

fredhersch avatar Sep 15 '22 08:09 fredhersch

@joiskash What is the content in the dropdown? is it the State or LGA example? How many answer options are in the list usually? is it 20, 50, 100? This context is helpful when I'm mocking up designs. Thanks

I'm waiting on seeing the latest APK with the auto complete implementation and then I'll mock this up.

shelaghm avatar Sep 15 '22 20:09 shelaghm

@joiskash @kumaakh Here are some design mocks for this. Please share your feedback.

Screen Shot 2022-09-20 at 17 15 40
  1. Auto pop up the keyboard and show the cursor in the dropdown box after the user presses the dropdown box. Question: Is this the desired behavior to have a preference for search in the dropdown?
  2. Number of options shown inside the dropdown list are limited to what's visible on the screen when the keyboard is open. In this case only about 5 options visible
  3. Show a scrollbar inside the dropdown list

shelaghm avatar Sep 21 '22 00:09 shelaghm

This looks great! Yes this is the desired behavior, I think we can decide the show the keyboard if the answer option size is greater than what can be shown on the screen with the keyboard out. This will be useful for devices of different size eg: phone vs tablet.

joiskash avatar Sep 22 '22 09:09 joiskash

Thanks for the feedback @joiskash. This issue could solve https://github.com/google/android-fhir/issues/1597 and be a more useful component than the current autocomplete functionality. I suggest we prioritize building this component instead of fixing auto complete.

shelaghm avatar Sep 22 '22 22:09 shelaghm

Some more info on this UI element from material.io

A menu with filtering is also known as autocomplete or a combobox. As the user begins typing, menu options filter based on what's entered. This can help users quickly find the right option from a large list.

Menus with filtering apply dynamic easing to the movement of suggestions as the menu changes height.

shelaghm avatar Oct 19 '22 16:10 shelaghm