Laggy screen if i insert more than 5 or 6 pictures

I i want to make an app that collect in a screen many small pictures (200x200 pixel 200kb each)of plants, so i can visually compare the pictures in the first screen (the index) with the plant that i watch in real life. next i click on the picture and an other screen (virtual vertical arrange screen) open up and show me larger photos of plant and a textual article about the uses of that plant. all is fine, but when the first screen (the index) begins to growth in number of pictures, i notice a big lag in scrolling the screen when i install the apk in my snapdragon 888 android phone. is there a better and lighter way to make this visual enciclopedy? i need that the first screen contains at last 500 small pics of plants. any advice? thanx for reading
RZL_SURVIVAL_KIT.aia (5.6 MB)

how many images do you have to display for the user to see them on the screen without scrolling?

try one of the recycler view extensions... you can find them after doing a search in the extensions directory App Inventor Extensions | Pura Vida Apps

Taifun

1 Like

My problem is not in updating images, my problem is the lag in scrolling the screen if i put more than 4 or 5 images. Please tray my aia and tell me if is only my problem or is not

Im not able to writhe program code :frowning: i wonder is there is a way to implement this using the user friendly commands of mit app invent. Please download my aia and tell me where the problem is. I think that is impossible that the app go so slow with this poor number of elements in there

This guide might help

Taifun

i dont understand the recycler list process, sameone can download my app and tray to find a way to have a screen that not lag when i scroll, with many cliccable photos inside the screen? please help,

This sample app shows how to reuse a small number of components to scroll through an unlimited number of pictures and text .

You are loading all your images on initialisation, this is causing the "lagging"

  1. You could probably reduce the sizes of all your images (do not compress but resize dimensions)
  2. Follow one of the methods provided above to load images when required
  3. Use a set of thumbnail images for your database "display", then display the fuller image once selected