On 3/4/2011 1:35 AM, Kenneth Rohde Christiansen wrote:
Hi again,
I'm trying to keep the canvas bitmap at the same pixel resolution as the
device,
otherwise it is blurry.
OK, I see.
This, for example, works if the pixel ratio is 2.
<canvas style="width: 100px; height: 100px;" width="200"
height="200"></canvas>
Yes, when the user has a zoom level set, I'd like to paint to match the
pixel ratio,
so that, a zoomed in user still receives crisp output, instead of blurry
output.
-webkit-device-pixel-ratio does not change when the user scaled the
content; it is a device value.
On old iPhone it is 1.0, on Android it can be 0.5, 1.0 and 1.5
depending on it being a low, medium (160) or high dpi (240) device. On
the iPhone 4 and the new iPod Touch it is 2.0.
On Android devices, with for instance, a device-pixel-ratio of 1.5,
you can disable the upscaling by adding target-densitydpi=device-dpi
to the viewport meta tag.
What you can do is to disable user scaling (add user-scaling=no to the
viewport meta tag) and then handle zooming in your app using the touch
events. This only works on mobile devices though.
I haven't debugged with enough tablet devices, such as the color kindle,
to know how many webkit distros it works with.
What should I do about user zoom on the desktop (and possibly, the kindle) ?
Drawing in high res, just-in-case, makes for a poorer experience for
users at a 1.0 ratio,
and asking users to slide a "sharpen" slider is a little awkward.
Mozilla, in their implementation, has setup device-pixel-ratio to scale
when the user scales content;
they directly expose window css pixel ratio value to trusted scripts,
but not to web content; requiring
web content to use css device-pixel-ratio.
Microsoft has exposed the values through window.screen.
-Charles
_______________________________________________
webkit-dev mailing list
[email protected]
http://lists.webkit.org/mailman/listinfo.cgi/webkit-dev
