Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Web and WebWorks Development

Reply
Contributor
ctetreault
Posts: 17
Registered: ‎07-27-2011
My Carrier: Virgin Mobile (Canada)

Bad image quality with webworks (smartphone)

[ Edited ]

Hey folks,

 

I've been struggling with an issue with bad image quality in my webworks app on the phone.  I've used the proper meta tag that Adam posted in a previous thread with no luck.

 

I made a quick sample to show you what's going on.  The test image is the exact dimensions of the phones screen.  In this case 640x480 (BlackBerry Torch 9810).

 

Original Image:http://twitpic.com/6ih332

Device Screenshot: http://twitpic.com/6ih2yj

 

Notice how the gradients are choppy, smooth edges are now jagged, and over-all the image quality is terrible.This is a screenshot off the actual device. 

 

Testing specs:

BlackBerry Torch 9810 

OS 7.0.0.353

 

This happens in the simulator, as well as on the phone.  I have tried other phones and simulators with the same issue.

 

Sample html code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width,target-densitydpi=device-dpi,user-scalable=no,initial-scale=1.0">
</head>
<body>
<img src="test1.png" border="0" />
</body>
</html>

 

 

Thanks for your time everybody,  hope someone has a solution to this!

 

-Chad

 

Please use plain text.
BlackBerry Development Advisor
tneil
Posts: 3,702
Registered: ‎10-16-2008
My Carrier: Rogers

Re: Bad image quality with webworks (smartphone)

[ Edited ]

Hmmm... Interesting...

 

Have you tried simulating an SD card on the simulator and viewing the picture with the pictures app?  I'm curious if it is simply a simulator display issue or if it has something to do with the image being an embedded resource.

 

If it is clear in the picture viewer, try white listing your file:// path to the image in your config.xml file and change the src path of your <image> to point to the local file path.

 

It could be a color palette difference on what the device supports vs the colors in your gradient.

Tim Neil
Director, Application Platform & Tools Product Management
Follow me on Twitter
Please use plain text.
Contributor
ctetreault
Posts: 17
Registered: ‎07-27-2011
My Carrier: Virgin Mobile (Canada)

Re: Bad image quality with webworks (smartphone)

Tim,

 

Yes it's fine if you view the actual image on the phone (outside of the application).

 

I tried what you said and used the full filepath to poin to the image (located on the sdcard) and it is all messed up looking still in the application.

 

The gradients I can live with, that's understandable however look at the edges of the circles.  They're riggid and jagged.

Please use plain text.
BlackBerry Development Advisor
tneil
Posts: 3,702
Registered: ‎10-16-2008
My Carrier: Rogers

Re: Bad image quality with webworks (smartphone)

What happens if you don't set any <meta> tags?  if you zoom in on the picture does it look good?

Tim Neil
Director, Application Platform & Tools Product Management
Follow me on Twitter
Please use plain text.
Contributor
ctetreault
Posts: 17
Registered: ‎07-27-2011
My Carrier: Virgin Mobile (Canada)

Re: Bad image quality with webworks (smartphone)

Also for the sake of it, tried setting the img src with base64 encoded image data.  same result.

 

Is there a certain DPI setting for my actual image that I should use in Photoshop when saving it?  

Please use plain text.
Contributor
ctetreault
Posts: 17
Registered: ‎07-27-2011
My Carrier: Virgin Mobile (Canada)

Re: Bad image quality with webworks (smartphone)

Without any meta tags the image quality is still bad, zoomed or not zoomed.

Please use plain text.
Contributor
ctetreault
Posts: 17
Registered: ‎07-27-2011
My Carrier: Virgin Mobile (Canada)

Re: Bad image quality with webworks (smartphone)

Any update on this Tim?

Please use plain text.
BlackBerry Development Advisor
tneil
Posts: 3,702
Registered: ‎10-16-2008
My Carrier: Rogers

Re: Bad image quality with webworks (smartphone)

Not yet.. there was some discussion that some down sampling was going on, but from your description... if you load it onto the SD card of the device and then view it in the picture viewer app it looks fine correct?

Tim Neil
Director, Application Platform & Tools Product Management
Follow me on Twitter
Please use plain text.
BlackBerry Development Advisor
tneil
Posts: 3,702
Registered: ‎10-16-2008
My Carrier: Rogers

Re: Bad image quality with webworks (smartphone)

Some more information...

 

Apparently WebKit will down sample "large" images.  The definition of "large" is a little fuzzy.  I'm not sure if it is in physical pixel size, or file size.

 

In your case I would say that  it is likely the pixel size since your file is only 80KB.

 

Are you using it for a background?  could it be accomplished a different way?

 

You could also try using different color palettes to see if the down sampling had less of an effect.

Tim Neil
Director, Application Platform & Tools Product Management
Follow me on Twitter
Please use plain text.
Contributor
ctetreault
Posts: 17
Registered: ‎07-27-2011
My Carrier: Virgin Mobile (Canada)

Re: Bad image quality with webworks (smartphone)

Don't think that'll work in this scenario. The images are dynamic, the user takes a pic and its loaded in to the app.

Regarding image size I have the same 'down smapling' happening on small icons that are about 10kb in size I believe, and about 60x60px.
Please use plain text.