Multiple large images

[Thomas Dybdahl Ahle]

Hi, I'm writing a 2D fight game in GWT.
I have a ton of images for each character multiplied with a large
number of characters.
I'd like the browser not to make a HTTP request every time it grabs an
Image.

I've thought about putting all the images, or at least all those per
character, in on image, and use the setViewport method to specify the
sprite I need.
However I fear that this will make the animation slower, when the
browser has to move a very large images of which only a little is
shown, instead of just moving the small image.

Is there any sense in my fear?
Is there another way to load all those images in one, or few, HTTP
request? (I'd like to generate the dames dynamicly: P1_jump.png,
P2_jump.png etc., so ImageBundle won't help me)

[Peter Blazejewicz]

hi Thomas,

http://www.screaming-penguin.com/docs/gwt-1.4.10/doc/html/com.google.gwt.user.client.ui.ImageBundle.html
it works like image sprites (or like cropped image in html),
something you could use for your tasks,
if you have photo tool like Photoshop/FireWorks and single image with
tiles (so it is square-ish rather then frame-like horizontal image)
you could export that image tiles separately into pngs/jpgs and they
will be gathered back by image bundle into single image,

you could still use html/css based images and crop them in code, but
you would needs then image loading sequence while your tiles with
ImageBundle can be loaded during startup,

regards,
Peter

[Thomas Dybdahl Ahle]

Thing is, I'd like to load my images like:
getImage(character+"_"+mode). As far as i have been able to figure
out, this is not possible with ImageBundle.

On 3 Nov., 03:01, Peter Blazejewicz <peter.blazejew...@gmail.com>
wrote:
> hi Thomas,
>
> http://www.screaming-penguin.com/docs/gwt-1.4.10/doc/html/com.google....

[Peter Blazejewicz]

hi Thomas,
ok, so use square-ish Image with tiled square spriates (say 4x4) , use
LoadListener prior to starting game to be sure that source iamge is
loaded:
http://google-web-toolkit.googlecode.com/svn/javadoc/1.4/com/google/gwt/user/client/ui/LoadListener.html
and then construct Sprite image tile using cropped/clipped image
constructor:
http://google-web-toolkit.googlecode.com/svn/javadoc/1.4/com/google/gwt/user/client/ui/Image.html#Image(java.lang.String,%20int,%20int,%20int,%20int)
these will support your identifiers based creation at runtime I'm
sure,
These will be generally similiar to clipped/cropped css based sprites:
http://www.alistapart.com/articles/sprites

regards,
Peter

[Thomas Dybdahl Ahle]

Yeah, putting all the images, or at least all those per character, in on
image, and use the setViewport method to specify the sprite I need,
would indeed make loading faster, and LoadListener looks nice.

However I fear that this will make the animation slower, when the browser
has to move a very large images of which only a little is shown, instead
of just moving the small image.

Do you think browsers are sufficiently optimized for this use?

--
Med venlig hilsen,
Best regards,
Thomas