[ykhun]

Hi,

I have a couple of 2D 180X180 png images. I used them for splash screen, backgrounds etc etc. How do i ensure that my splash screen and background (using these fixed-sized images) can cover the device's displayable area? For example, if a device is 200X200, how do i stretch my 180X180 images?

I'm currently using lcdui's Image class to display the images, and there isn't any method that i could use to scale the images for different device sizes. :-(

Thanks for any help!! :-)

[petrib]

I presume you have to implement your own image scaling code. Probably best to search for good algorithms to use a starting point:
http://www.google.com/search?hl=en&q...+%2Balgorithms

[ykhun]

Originally posted by petrib
I presume you have to implement your own image scaling code. Probably best to search for good algorithms to use a starting point:
http://www.google.com/search?hl=en&q...+%2Balgorithms

Hi, thanks :)

OMG, is scaling the image the only way.... I'm using MIDP2.0, but just couldn't find anything that can do this automatically. The closest i'd gotten is lcdui's ImageItem, but that only works for a Form and not a Canvas...

If anyone else knows a better way to go about trackling this problem, please drop a post here! Thanks!!!

[anand_amarsh]

i got this algorithm from off Eric Giguere :

/**
* Creates a new, scaled version of the given image.
* ref : http://kobjects.org/utils4me/
* @param src: The source image
* @param dstW: The destination (scaled) image width
* @param dstH: The destination (scaled) image height
* @return Image: A new Image object with the given width and height.
*/
public static Image scaleImage(Image src, int dstW, int dstH) {
int srcW = src.getWidth();
int srcH = src.getHeight();

Image tmp = Image.createImage(dstW, srcH);
Graphics g = tmp.getGraphics();

int delta = (srcW << 16) / dstW;
int pos = delta / 2;

for (int x = 0; x < dstW; x++) {
g.setClip(x, 0, 1, srcH);
g.drawImage(src, x - (pos >> 16), 0, Graphics.LEFT | Graphics.TOP);
pos += delta;
}

Image dst = Image.createImage(dstW, dstH);
g = dst.getGraphics();

delta = (srcH << 16) / dstH;
pos = delta / 2;

for (int y = 0; y < dstH; y++) {
g.setClip(0, y, dstW, 1);
g.drawImage(tmp, 0, y - (pos >> 16), Graphics.LEFT | Graphics.TOP);
pos += delta;
}

return dst;
}

[seabird_2000]

you can solve this problem like this:
first,draw the background:
for (int x=0;x<=getWidth()/backimage.getWidth();x++)
{
for (int y=0;y<=getHeight()/backimage.getHeight();y++)
{
//the "backimage" is your background iamge
// you can also use the "fillrect()" instead of this
//gr is the graphic
gr.drawImage(backimage, x*backimage.getWidth(), y*backimage.getHeight(), gr.TOP | gr.LEFT);
}
}

second,draw your image uesd for splash:
gr.drawImage(yourimage, (getWidth()-yourimage.getWidth())/2,(getHeight()-yourimage.getHeight())/2, gr.TOP | gr.LEFT);

[mreaves]

Your best bet from a polished and presentation point of view is to have different assets for different platforms, and produce builds targeted for those platform.

It will also be more efficient from a memory point of view and there won't be any delay while the graphics are scaled.

Using an ant build script and antenna for pre-processing makes the whole thing fairly painless and means you can keep the codebase across different platforms.