Scrolling thru a 200 item list on a mobile phone browser

Hey, everybody…

I need the user to be able to browse (and select one) among 150-200 items from a list in an android’s phone browser.

So I am trying this with a webapp that will show a listbox with all the 200 rows… but the listbox scrolling is painfully slow…
then, I decided to try the container-embedding method, but that is only a bit faster… still too slow.

So what options do I have, after confirming that the problem is related to the number of items displayed on the list, and that number will rarely be below 150-200 ?

PS. I am trying this with a device that has reasonable average specs.

Thanks
Roman

Maybe try showing only a few items at a time and add paging buttons to load next set of rows.

[quote=405687:@Roman Varas]Hey, everybody…
So what options do I have, after confirming that the problem is related to the number of items displayed on the list, and that number will rarely be below 150-200 ?
[/quote]

if you relly ned 200 items, xojo is not for your proyect. for xojo, You need to use pagination.

Options, you can use a native app in Android and create an web serviceas an API to serve the items and receive the selection.

Or look for another back end for more responsive web apps

I have no problem doing this with a Xojo Web app on an Android device, allowing the user to read 50 records at a time, using pagination. Read up on LIMIT and OFFSET in SQLite documentation. Or other SQL database management systems.

I would highly recommend a different way for a good user experience:

Don’t use a Weblistbox, write your own simple list.

  1. Make an empty containercontrol (CC) “cc_outer”
  2. Drag it onto your webpage
  3. Make another empty CC “cc_item”
  4. Pack a label onto it - this will be the label which shows the listvalue “title_label”
  5. Add a function “Add_Item” to “cc_outer”

After that, add some custom CSS to the App.Header Property:

<style>
.NAME_OF_THE_STYLE_OF_cc_outer div{
float: left !important!
width: 100% !important!
}
</style>

this will automatically align your cc_items underneath each other

now just add the listitems like self.cc_outer1.add_item("item caption")

Ready.

The native browser will give you a good scroll feeling. Also you have full control over the design of your list, and you can add other controls to the cc_item as well, which can be very useful.

This is a good way for up to 300-400 items.

Regards

[quote=405697:@Pedro Ivan Tellez Corella]
if you relly ned 200 items, xojo is not for your proyect. for xojo, You need to use pagination.[/quote]

This btw not true, if you don’t consist on using in-build tools.

Espacially the Webedition is super good in customizing your UI and UX, but you need to put some work and effort in.

Have you considered using 2 lists? When I have a list with more than about 50 items I try to break them into groups or categories. The user selects the group first, then the program fills the 2nd list with appropriate values. This way the 2nd list is much shorter.

I’ve also done a web app where each user gets a different list, based on what that person needs. This may or may not make sense for your app.