Hi,
i’ve created a scrollview to display a list of users (in that case - FBusers)
its all work just fine, but i’m having a problem with the render time.
i think its because im loading all the images of all users.
i think that if i’ll load only the images of the Visible rows it will be better (i saw a few apps that are doing it)
the question is:
how can i get the visible rows(Groups) when im scrolling the scrollview, if i can get them, i can load the images for only those rows and save a lot of loading time (right now the app stuck for something like 30 sec-60sec for long lists (500-1000+)
Thanks [import]uid: 175991 topic_id: 34443 reply_id: 334443[/import]
Haven’t worked on a just-in-time loader in awhile but I imagine what you would do is:
-
Either using event.phase == “moved” (if the scrollView supports it?) or a Runtime listener, keep a variable going that reports back :getContentPosition() so you know how much scrolling is going on.
-
Whenever the scroll exceeds a certain amount (say, rowHeight), load one row and unload another (create and delete) based on the direction it’s moving.
-
Save something on the row data so you know where it belongs from the table. Let’s say that all of your users are being stored in a table, so that users[1] = “Jacky”, users[2] = “Florence”, and so on.
for i = 1, 8 do -- let's say you're making 8 rows
local row = display.newRect(0,0,32,32) -- or whatever display object/group it is
row.id = i -- "i" is the index from the table, in this case users{}
scrollView:insert(row)
end
- Then, when you use Runtime to update the rows…
if scrolling \<= rowHeight then -- scrolling has exceeded 1 row upwards
-- [1] delete the topmost row from scrollView
-- [2] add a new row to the bottom of scrollView
elseif scrolling \>= rowHeight then -- same thing, but downwards
-- [1] delete the bottomMost
-- [2] add a new row to the top
end
Now, assuming scrollView content works like other display Groups (previously it didn’t, but a quick look right now says it does, am I right?) you would do this:
-- To find the id above the topmost row
local newRow\_id = scrollView[1].id - 1
-- To find the id below the bottommost row
local newRow\_id = scrollView[scrollView.numChildren].id + 1
(Just make sure to check that the id never becomes 0 or a number bigger than the table itself)
tl;dr
The basic idea is to just render as normal and then append one-at-a-time as you go. (Although, if scrollspeed is *too* fast, you may need to render two or more at a time…) [import]uid: 41884 topic_id: 34443 reply_id: 136904[/import]
Haven’t worked on a just-in-time loader in awhile but I imagine what you would do is:
-
Either using event.phase == “moved” (if the scrollView supports it?) or a Runtime listener, keep a variable going that reports back :getContentPosition() so you know how much scrolling is going on.
-
Whenever the scroll exceeds a certain amount (say, rowHeight), load one row and unload another (create and delete) based on the direction it’s moving.
-
Save something on the row data so you know where it belongs from the table. Let’s say that all of your users are being stored in a table, so that users[1] = “Jacky”, users[2] = “Florence”, and so on.
for i = 1, 8 do -- let's say you're making 8 rows
local row = display.newRect(0,0,32,32) -- or whatever display object/group it is
row.id = i -- "i" is the index from the table, in this case users{}
scrollView:insert(row)
end
- Then, when you use Runtime to update the rows…
if scrolling \<= rowHeight then -- scrolling has exceeded 1 row upwards
-- [1] delete the topmost row from scrollView
-- [2] add a new row to the bottom of scrollView
elseif scrolling \>= rowHeight then -- same thing, but downwards
-- [1] delete the bottomMost
-- [2] add a new row to the top
end
Now, assuming scrollView content works like other display Groups (previously it didn’t, but a quick look right now says it does, am I right?) you would do this:
-- To find the id above the topmost row
local newRow\_id = scrollView[1].id - 1
-- To find the id below the bottommost row
local newRow\_id = scrollView[scrollView.numChildren].id + 1
(Just make sure to check that the id never becomes 0 or a number bigger than the table itself)
tl;dr
The basic idea is to just render as normal and then append one-at-a-time as you go. (Although, if scrollspeed is *too* fast, you may need to render two or more at a time…) [import]uid: 41884 topic_id: 34443 reply_id: 136904[/import]