Howto: Create Dynamic Nested Listpicker (using only 1 Listpicker)

[TimAI2]

Likely this has been covered elsewhere, but not seen it done, so:

Two things going on here; firstly the creation of lists from a main list based upon their attributes (in this case a list of names broken up in to sections of the alphabet), and also another take on creating a nested listpicker, but this time just using 1 listpicker.

Using just one listpicker for nesting

Look at the last set of blocks to see how this works. I used a variable to set the requirement for which list should be loaded into the Listpicker Elements, and the selection from the first list to set the elements for the second

Create a Dynamic Nested Listpicker

Kept things simple, and just worked with a list of names, but it should be possible to do this with lists of numbers as well.

I often have to work with staff lists which can be 100's of names long, and when creating apps this can make things difficult for users when presenting a list for them to choose from.

Thought a dynamic way of generating the nested list would be a handy thing to have in the toolkit.

I first had to set up my categories, in this case sections of the alphabet (3 in the example)

To get each category list, I iterated through the whole list

Grabbed the first letter of each name

Tested if a name was either before "I", between H and R or after Q

Added to the respective list

Finally making up the list of lists required for the second listpicker list

Here are the blocks:

A short demo video as well:

https://www.youtube.com/watch?v=xx63RRC5rHY

An aia file is attached if you want to extend on or use this.

[Italo]

Very nice example! And very simple too.

I can suggest you an optimization that may automate the process a little more.

How about instead of using a procedure to generate 3 fixed lists, you use the before.picking event to generate just one temporary list with the names that start with the letters between the first character and the last one of the first selection?

It's just an idea, I'll try to show you the blocks later. I'm on my phone right now.

[Italo]

This is what I mean: It's based on your original blocks, but now you don't need the 3 lists A-H, I-Q and R-Z.

Only a temporary list of filtered names that is generated every time you select a group of letters.

Also as an example, you can now create different groups of initials and the before.picking event will automatically generate the list accordingly.

For example, instead of A-H, I-Q and R-Z, you can now modify the list and use A-D, E-J, K-P, Q-U and V-Z just by replacing the strings in the list.

Also added a failsafe check in case there's no names within the selected group of letters (it shows "No matching names" in the second picking.

Thanks for your idea, it made me learn a lot of things today.

[TimAI2]

Thanks Italo, they were the two of the things that were bugging me that I was going to have a go at, handled very nicely :)

Next up is to create the dynamic elements for List1 from the Names list, which needs to take into account what is in the list, but also how long each section should be.

[Abraham Getzler]

You can package some of the looping and testing in value procedures.

See https://docs.google.com/document/d/12t4HLNRepCnbmcfycdF8wSHWht_D1P8hKJpTknVDChY/edit#heading=h.68soinnhy2k8

The nesting of calls to this family of procedures gives you a pipe (|) capability for tables.

ABG

[TimAI2]

Well I now have a rough version (and it is ugly!) that creates a dynamic list for the first list in a nested listpicker. This assumes a list of names or words in the master list, and that these are sorted alphabetically. The issue with creating such a thing is that, say for names, there are 26 letters that names could start with, but that the distribution of names is very uneven. In my sample list 3 letters took over 30% of the entire list. My aim was to present nested lists that could all be viewed without scrolling (between 10 and 12 items), but because of the above this is just not possible all the time. I only have the blocks here that create the first list for the listpicker, the A-D,E-H,etc. as the blocks probably need some optimisation before writing the whole thing out. But here goes:

Blocks:

Lots of variables including an alphabet list

The init and gotText fetching the external list of names (first and surname in each cell), calling three procedures and displaying various outputs

In this procedure i get the first letters for each name, and then count the number of letters, and get those counts into a list, that corresponds with the alphabet list

A simple one (courtesy of Ghica and others), that finds the letter with the biggest number of appearances. This is used to set the "optimal" size of the nested list.

The big nasty one! In simple terms, this looks at the list of letter values and starts to build a list of sections. If the letter values equals the optimum value then it creates its own section (e.g. A-A), but if the letter values are less than this, i used a counter to add this to the next letter value until I had more than the optimum value, the created a section with the start and end letter. Finally, to complete the alphabet, check the last letter of the sections equals "Z", if not create that section.

Screen shots

Red section is a list of all the items in the list by first letter

Blue section is a list of the count of each letter in the above

Pink section is the final list of section for List1 (F-L is the odd one as it has over 20 items in it)

Guess you can play around with the variables for the optimum size to get what you want