Using ListPicker for displaying and selecting from on screen lists

You may also like...

41 Responses

  1. anafa d. mudi says:

    thanks for explaining

  2. anafa d. mudi says:

    unfortunately i cant access your ebook even if i try to buy. is there a way of paying for it apart from amazon

    • Edward M says:

      Do you mean you cannot buy it from Amazon? It is also available from Apple iBooks, Google Play Books, Kobo and Barnes and Noble NookBooks.

      (Sorry for the delay in responding – I receive an email with each comment posted, but they were getting caught in my spam filter. I hope that is fixed now.)

  3. Manuel says:

    Thx for explaining the listpicker.
    But i have one question, if i have a listpicker with some words in my application and some people have installed the app. So can i refresh the list anyhow that the people who has already installed the application instantly get the new words in the list which i have changed? Is it possible and if yes, how?

    • Edward M says:

      Yes, it is possible, although may be not easy. There are at least two parts to making this work. The first part is to update the words in the ListPicker by using the set ListPicker.elements or set ListPicker.ElementsFromString blocks. In the set elements block, set this to a list of values; in the ElementsFromString, set this to a text string such as “A,B,C,C”.

      The second part, and the harder part, is how do you get the updated items to the installed apps? To do that in a transparent (to the user way), you would probably need to use a remote web-based databased like TinyWebDB or Fusion Tables. Eventually I intend to write a tutorial on those but for now there is not much out there. By using a remote web-based database, you could have your app read the values from a web database. Then, you could periodically update the web-based database with new values.

      May be there is another way to do this but its not coming immediately to mind.

      Ed

  4. Manuel says:

    Thanks for your answers!
    Maybe u can a tutorial for me? I am a beginner and i think its too difficult for me but i’ll try it.
    Thanks!

  5. Alfredo says:

    Hola,no encuentro como hacer para que al entrar en la screen salga una lista y que cada vez que se entre en la screen salgan los datos de la lista desordenados,como podria hacerlo?

  6. Fernando says:

    I noticed on the picture above when you added the listpicker1 and label1, but there is one more item on there that I can’t find on the app inventor site. I’m looking for the “lblTheSelection” where do I find it?

    • Edward M says:

      lblTheSelection would be an ordinary text label on the screen. I’ll need to pull up that app, later, to find the specific item, as I need to leave my office in just a moment. But you should be able to create a text label in the Designer, for the screen, and rename it to lblTheSelection, to make that work. Ed

  7. Anita says:

    hallo please hulp me.

    i want do on screen 1 links open with screen 2 how can i do this?
    website open with another screen.

    We can only make 10 screen and i have on screen1 15 links and i want open this links on screen2 but i dont o how can i do it?

    Can you make 1 example foto pls ?

    Thank You Very much
    Anita De boer

    • Edward M says:

      Anita,
      If I understand your question – I think you want to use the “open another screen” blocks that are found in the Control components in the Blocks editor.

      From here, a screen can open another screen by specifying the exact name of the other screen to open (upper and lower case letters in the name must match exactly).

      Data can be passed from one screen to another using the “open another screen with start value” block and passing individual values or a list of values.

      Another way to pass data from one screen to another is to store the data in TinyDB where the data can then be accessed directly from any screens.

      I am not sure if this answers your question but hopefully it provides some information. Examples of handling multiple screens are also in volume 1 of my ebook. Much more information (like 300 pages) for using TinyDB, TinyWebDB, Fusion Tables and and files to store data is in volume 3.

      Ed

  8. Ravi says:

    Whenever I select my list picker it opens chrome and it closes the application

  9. Zack says:

    I have a question such as with the apple and bananas buttons things in the list picker, am i able to set it up as if i were to click on one of those options in list picker it would set an image of what ever you selected on a canvas?

  10. Greg says:

    I want to include names of the pictures in the list, so when I click the item the proper image becomes visible. I tried many combinations, but i can’t make it work. Please help me.

  11. soesh says:

    Good one ! But how about making dynamic listpicker? I meaning the fruits from Mysql Table .

    • Edward M says:

      Use the last example to assign the values to the ListPicker – “set ListPicker.Elements to” that you have read from a database table. You can fill the Elements list with any values you want to use before you display the ListPicker on screen. However, once the list is visible, you cannot then change the values if that is what you are trying to do?

      Ed

  12. Peter says:

    Is there a way to get it pick from a list of installed apps? I don’t want it to run the apps [yet], I just want it to pick one. Or is there a better alternative?

    • Edward M says:

      I don’t know how to get a list of installed apps, from within App Inventor. Anyone else know?

      Ed

      • Joej says:

        Thank you for your outstanding and helpful tutorials. Would you be kind to make a variation of the ListPicker tutorial that selects from a LIST OF LISTS? AI “How to use the ListPicker in a Quiz with App Inventor 2” video, and the Chapter 19 tutorial, could have done more with this subject. Thank you.

        • Edward M says:

          Good ideas – yes, ListPicker – as well as lists – can be challenging.

          There are two ListPicker related tutorials on the web site – you can find them here
          http://appinventor.pevest.com/?s=listpicker

          But I will look into doing more. I hope to resume writing tutorials for the web site in about another week or two – I am busy with some other projects at the moment!

          Ed

  13. tobin says:

    is there a way to have a single selection change multiple things like school schedule so say there is two options ( green,white ) and depending on which one the user picks will change which times are displayed in labels 10 labels green would be the first 4 periods+ one of the 3 lunches and the times those start and end i need help this is quite complex

    • Edward M says:

      In terms of what I think you are trying to do, yes, that should be possible. But I’m not sure I fully understand what you are trying to do, in detail. Your event handler can make changes to the properties of multiple user interface components. When I select something, I can write an event handler for that selection, and then reference each of the modified components – labels, buttons, text boxes and so on – and change their properties including colors, text values and so on.

      I was on vacation last week for a few days and did not have Internet (or even cell phone) access.

      Ed

  14. Shani says:

    Hi,
    Is there any way that the user of the app will add an item to the list picker?

    thanks!

  15. Hupe says:

    Hello there,
    I´m trying to let the user picks multiple choices out of the Listpicker…
    I can´t do it… Can you please give me a hint?

    Thank you

    • Edward M says:

      I do not see how ListPicker can support multiple item selection because:


      Selection
      The selected item. When directly changed by the programmer, the SelectionIndex property is also changed to the first item in the ListPicker with the given value. If the value does not appear, SelectionIndex will be set to 0.

      SelectionIndex
      The index of the currently selected item, starting at 1. If no item is selected, the value will be 0. If an attempt is made to set this to a number less than 1 or greater than the number of items in the ListPicker, SelectionIndex will be set to 0, and Selection will be set to the empty text.

      As you can see from the ListPicker documentation, the ListPicker only returns an individual Selection item. There is not a way to return multiple selected items from ListPicker.

      Ed

  16. tony pirie says:

    I am using listpicker but have run out of space to add more items. The box to add items is of the screen now.

    • Edward M says:

      Tony, Try selecting the “Screen1” or the screen name of your app. Then check the “Scrollable” Property for the screen (or programmatically set Screen1.Scrollable to True). I have not tried this but I suspect it may solve the problem for your as it makes the screen scrollable past the bottom.

      Ed

  17. sunil says:

    hi I want to create a list containing month names and when a month is selected an image for that month opens

    • Edward M says:

      You could create a list with strings “January”, “February”, “March” and so on.
      And then you could create a list containing images.

      When you select a month (say element #3) from the month names, you’d select the image from the image list (element #3).

      There are some tricks that can be done too, but can’t really explain in a comment. If you have an image component, and in the Blocks editor, you click on the image component, you’ll see a pop up of all the methods, properties, and so on, for the image. At the very bottom of the list, you’ll see a small block that says “image1”. This is essentially a block that represents the entire image object. You can store these in a list.

      Scroll down in the Blocks list, at left, and see “Any component”. In there, you’ll find an Any image component. You can then plug in the “image” component you’ve stored in the list, into the appropriate plug in port on the blocks shown for “Any Image”.

      This is hard to explain in text. I do want to write up a tutorial on this idea though.

      Ed

  18. Aj says:

    Ive learnt many thinks , great tutorial!
    and i have question. Is it possible to use the items from arbitrary and assign them to a given buttons respectively. BTW the a items will be given by the user. 6 items need and 6buttons given

    • Edward M says:

      Aj, If I understand the question – the user will enter 6 items in a text box? And you would like to assign those 6 items to the ListPicker?

      If that is the idea, yes, this can be done. You would need to assign the values to the .Elements property of the ListPicker. If the user typed on screen,

      X,Y,Z,A,B,C

      you can split that apart and assign as a list to the Elements tag. I might add something to this later … having sporadic Internet connection and I have to leave the computer now, too.

      Ed

  19. Nelle says:

    I am trying to make an app where I have a listpicker that lists the location of popular tourist stops. What I am trying to do is when the user clicks on a list item, it gives them more information on the destination.

    However, to do this, I have to define the selection, and I don’t know how to do that. I have tried to use the equals sign from the logic group of blocks to make an if else statement like

    if ListPicker1 Selection = “Geissler’s”
    then
    set image1 visible

    However, this is not working. So, how would I make it so whatever the user picks makes a specific set of components visible?

    • Edward M says:

      Nelle, I’ve seen your question – just wanted you to know that its late and I ran out of time to look into this. Perhaps I can look into this on Friday – if anyone else has comments, please jump in!

      Ed

    • Edward M says:

      Couple of thoughts on this
      1. Your code is appropriate as .Selection should contain the text of the selected item. As an alternative, you could also refer to .SelectionIndex which is the number of the item that was selected (first one is 1, second one is 2, and so on).

      2. The second thought is to ask what happens in the code after you set the image to visible? Android (and App Inventor) has a quirk that can create frustration where you know you’ve update something on the screen but it does not appear. Basically, when you update a text field or an image filed on the screen within you code, this is sort of a suggestion to App Inventor to update this part of the screen. BUT – it doesn’t do it instantly. Presumably this code is located in the ListPicker.AfterPicking event handler. The screen will not be updated until the .AfterPicking event reaches the end (finishes and exits).

      I ran into this problem where I had an event handler that included a for each loop from 1 to 6. And “event handler” is anything such as .AfterPicking or a Button’s .Click event.

      During each iteration through the loop, it was supposed to write “Item #n completed” but all I ever saw as “Item #6 completed” even though I knew there was a delay between each iteration of the loop. This occurred because the updates I was sending to the screen are never actually copied to the screen until the end of the event handler. So we only saw the last update.

      The solution is to only do one update in an event handler, let it finish, and then do the next update. Unfortunately, this is not easy to program. In my case, I moved the code inside a Clock Timer event handler, where exactly one update to the screen was made in each timer event. How do this is a bit complex and I should write a full tutorial on how to do this.

      Ed

  20. Nay says:

    Hi. I would like to know how do I update a listpicker with data from tninyweb. I have the app on 2 phones. When I create a user I want the other user to appear appear in the listpicker. Any ideas?

    • Edward M says:

      I assume you are exchanging data between the two users – on different phones – using TinyWebDB?

      If that is the case, then you can assign values to your ListPicker elements string. You could write
      ListPicker.ElementsFromString gets “A,B,C,D,E” to add the 5 values to the string.
      Or you can use Make a list, like
      ListPicker.Elements = make a list “A”, “B”, “C”, “D”, “E” and so on (substitute App Inventor blocks for the pseudo code I wrote here).

      Ed

Leave a Reply

Your email address will not be published. Required fields are marked *

WordPress spam blocked by CleanTalk.
LinkedIn Auto Publish Powered By : XYZScripts.com