Performance slowdown when displaying many small images

hey!

 

i'm working on small flex mobile game. uses 2d game grid , trying display tiles in cells. there 3 different images being used: 1 walls, 1 floor , 1 character.

 

i display these images in following way:

i have group id ( displaygroup ), create array of new image() position should placed @ , image should use.

i loop on array , add images individually element group.

 

in code, looks this:

 

var temparray:array = disp.drawmapgfx(map, hero) each (var img:image in temparray)  {     displaygroup.addelement(img); } 

 

now, problem appears when move.

what following:

 

var numimages:int = displaygroup.numelements-1;  var temparray:array = disp.drawmapgfx(map, hero) each (var img:image in temparray)  {     displaygroup.addelement(img); }   for(var i:int = numimages; >= 1; i--) {     displaygroup.removeelementat(i); } 

 

i first grab total number of images in group. add updated images take new position account, , remove outdated images group. go 1 instead of 0 because element 1 rect creates background color.

 

for testing, i've been using "run iphone 3 gs". every image 50x30, which, taking gui consideration equates 11 x 17 images + 1 character. displaying maximum of 188 images.

 

picture reference:

the problem images flicker old images disappear , new images appear. can have redraw screen faster, prevent flickering ?

would make sense to, instead of redrawing every image, shift whole scene , load / remove images necessary, rather reloading images ?

 

and small second question: possible share mobile app in single desktop-ready air file, can have friends not have smartphones test on computer ?

how big world, in total?

theoretically, load whole world on startup, , use mask display relevant part of world. each move of character, move mask next section.

More discussions in Flex (Read Only)

adobe