Listpicker: how do I change color for a VISITED item in a listpicker (where each item is linked to a url)

MIT App Inventor Help
#1

Hi Everyone,

I'm gonna do my best to make my question as clear and straight forward as possible. My app has activity starters and list pickers. Each item in a list picker is linked to a URL. Once users touch a list picker item it would take them to a website. Is there any possible way to arrange a color for a list picker item so users would now they just touched it when they navigate back from the web to the list?

this whole concept is similar to the change of color of hyperlink which would indicate that you just visited the website

this is the exact model of my app just to give you an idea and a better understanding of where that changing color functionality could be squeezed in this whole structure of blocks

Thanks a million!

#2

In other words there will be more than one item highlighted? The List Picker can't do that but you can use an HTML table to do it (HTML, CSS, JavaScript)

#3

Chris, HTML table sounds like an interesting idea even though that would require me to redo the entire architecture of my app. But how about a block called WHEN LIST PICKER LOST FOCUS? What does it do? I was thinking about adding SET LIST PICKER ITEM BACKGROUND COLOR to it and then add a certain color hoping that this combination might just do what I'm trying to achieve

#4

Erm - nothing :upside_down_face:

If you want to change the entire List background then yes. You can't change the colour of specific rows.

That depends - if the List is Static (for viewing/picking only) It can be displayed on a dedicated screen (If your App uses Virtual Screens, even better), not much change there. If however the List is Dynamic (modified at runtime) then it has to be built in-app. Interestingly, there is a new Extension that builds HTML Tables for you:

#5

thank you Chris, I will need to take a really good look at the extension and see what I can do. What I'm trying to do is a minor thing which I probably shouldn't even worry about but it would give the whole app a nice touch of user friendliness and convenience. I appreciate you taking your time and sharing some information. Have a great week!

#7

Also see listviews using dynamic component extension

#8

Thank you Tim! I had yet another question to double check with someone as knowledgeable as yourself. I was trying to create a procedure to allow users to navigate BACK to list picker FROM a visited URL NOT the screen.
blocks (1)
it works just fine BUT here's my concern: when I close the app and check all running activities on my cell phone( it is the III button on the left side of the bottom buttons which let you clear all open windows, stop all activities and navigate back and forth if they are running) the app closes but Listpicker List is still showing among all actively running activities. When I hit the back button on my phone to navigate away from the list it restarts the app again. So the only way to get rid of it is to hit Clear Them All Button on my cell phone. Do you think that might cause the app to eventually crash?

#9

The listpicker is like an Android dialog - slightly separate from your AI2 app. It will need to be closed for it to not appear in recent apps...

#10

Tim, but does it have to be closed through a certain command INSIDE the app or is it ok for it to run(stay open) until a user will close it on a device by hitting -clear them all- ? Do you think that kind of a Android dialog might cause the app to crash? If the list picker is a separate dialog from the app then I doubt it will cause the crash but what do YOU think Tim? thanks a million

#11

Also Tim, believe it or not but we spoke about this a year ago and you suggested to build this kind of an app architecture with the option of navigating back to the list from a URL
https://community.appinventor.mit.edu/uploads/default/original/3X/8/d/8d04d2908ed33812be5141a5f87d57688003253c.png

I simplified it a little bit because my app was crashing while showing me an error message prompting me to remove true -false blocks. It stopped crashing once I did that. As you can see the last set of blocks does not have a command to close the list picker. Would you have any suggestions of blocks to close the list picker once users navigate back from it to the screens? Thanks again!

#12

Those blocks assume you will make another listpicker selection, which is what you wanted.

Suggest to not use a listpicker, but a listview or listview created with dynamic components or with a tableview extension

1 Like
#13

Tim, I'm gonna have to look into those but back to my concern of an app crash: do you think an open and running listpicker which turns out to be a separate dialog would in any way cause my app to malfunction or crash or not?

#14

It is possible, but without some extensive testing it is difficult to confirm. Perhaps you can create an example app that replicates the issue for others to test?

#15

Thanks Tim, I'm testing it now and so far everything goes pretty smooth. Tim, I don't mean to be annoying and stubborn but I have yet another question for you and again it is about list picker functionality. My app structure is way too big and list pickers have long lists of items to scroll down the list. Once users return from the URL back to the list they have to scroll down the list from the top of it to see the item they need. Is there any way to program the scrolling mechanism to stay in the part of the list where users just were before they clicked on the item? Here is my activity starter and list picker structure

blocks (2)
blocks (2)1626×338 58.1 KB

I'm thinking of TinyDB because it is the only component in AI to store and remember things. How would you possibly play around with what I have to get to what I need?

P.S. I remember you strongly suggested to use listviews and table views, but I would need a month if not more to change it all.(I got 90 listpickers and activity starters)

#16

oh dear.....

Ken's Tableview extension will allow you to scroll to a position in the table/list
If using a listview you could use a scroll handler extension along with a scrolling arrangement
I do not believe @Kevinkun 's Tableviewer has the functionality to go to a position in the list (yet), but it might be possible using a scroll handler extension
A listview created with dynamic components could also be scrolled to in a similar manner if you use a scrolling arrangement

I do not believe it is possible to go to a position in a listpicker. You might reorder the list so that all selected items are moved to the bottom/top of the listpicker on next view ...

#17

You can re-select the index by code but that does not put it in the viewing position that the User left it in. However, it might be that the list can be filtered, in which case the row of interest would be in a shorter sub-list and maybe not need to be scrolled to.

#18

Here is a technique you can use to speed up selection in very long List Picker Elements lists ...

Also, here are two ways to show multiple selected items in a list, neither as attractive as you would like ...