cordova-dev mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From Ian Clelland <iclell...@chromium.org>
Subject Re: iOS webview size
Date Fri, 06 Dec 2013 16:48:39 GMT
Yes, if we're actually talking about the HTML <canvas> element, then it's
default resolution will match the element's size *in CSS pixels*, which are
twice the size of device pixels on a retina display.

You need to set the element's "width" and "height" attributes (*not* the
CSS properties) to increase that resolution.

A full-screen hi-res canvas on an iPhone 4 would look like this:

    <canvas style="width: 320px; height: 480px;" width="640"
height="960"></canvas>

(and, of course, those numbers would be different on an iPhone 5, or an
Android device :) )

Ian


On Fri, Dec 6, 2013 at 11:40 AM, Michal Mocny <mmocny@chromium.org> wrote:

> Yeah if you don't have correct viewport, and are using the 3.5 inch retina
> iphone simulator, you will get 2 device pixels per css pixel, and thus see
> the resolution you claim.
>
> Also, even if you fix the viewport, I think that for efficiency reasons
> some web renderers will specifically treat the canvas element as lowdpi
> even on a highdpi device.  I do not know the details of safari webview, but
> thats worth exploring if viewport doesn't fix the issue.  One quick article
> I found that generally explains things to consider when working with canvas
> on highdpi is: http://www.html5rocks.com/en/tutorials/canvas/hidpi/
>
>
> On Fri, Dec 6, 2013 at 10:54 AM, Andrew Grieve <agrieve@chromium.org>
> wrote:
>
> > Problem with viewport <meta> tag?
> >
> >
> > On Fri, Dec 6, 2013 at 10:07 AM, James Jong <wjamesjong@gmail.com>
> wrote:
> >
> > > Are you targeting prior to iOS 5?
> > > -James Jong
> > >
> > > On Dec 6, 2013, at 9:49 AM, Maxime LUCE <Maxime@somatic.fr> wrote:
> > >
> > > > By default, Cordova ios project targets iOS 5+, could it be blocking
> ??
> > > >
> > > >
> > > > Cordialement.
> > > >
> > > >
> > > > Maxime LUCE
> > > >
> > > >
> > > > maxime@touchit.fr
> > > > 06 28 60 72 34
> > > > http://touchit.fr
> > > >
> > > >
> > > > -----Original Message-----
> > > > From: mmocny@google.com [mailto:mmocny@google.com] On Behalf Of
> Michal
> > > Mocny
> > > > Sent: vendredi 6 d├ęcembre 2013 15:45
> > > > To: dev
> > > > Subject: Re: iOS webview size
> > > >
> > > > 320 sounds like the width of the first three generations of iphone
> > > (though the height is not 240 but 480).  Perhaps you are emulating an
> > older
> > > device?
> > > >
> > > >
> > > > On Fri, Dec 6, 2013 at 9:28 AM, Maxime LUCE <Maxime@somatic.fr>
> wrote:
> > > >
> > > >> Frame is fullscreen but frame content is sized
> > > >>
> > > >>
> > > >> Cordialement.
> > > >>
> > > >>
> > > >> Maxime LUCE
> > > >>
> > > >>
> > > >> maxime@touchit.fr
> > > >> 06 28 60 72 34
> > > >> http://touchit.fr
> > > >>
> > > >>
> > > >> -----Original Message-----
> > > >> From: James Jong [mailto:wjamesjong@gmail.com]
> > > >> Sent: vendredi 6 d├ęcembre 2013 14:47
> > > >> To: dev@cordova.apache.org
> > > >> Subject: Re: iOS webview size
> > > >>
> > > >> Sounds like you have some customization in obj-c or the nib files.
> > > >> The frame should be fullscreen by default.
> > > >> -James Jong
> > > >>
> > > >> On Dec 6, 2013, at 8:25 AM, Maxime LUCE <Maxime@somatic.fr>
wrote:
> > > >>
> > > >>> Hi,
> > > >>>
> > > >>> I will try to explain the issue more precisely.
> > > >>> When I launch my app using XCode in the iOS emulator, I can see
> that
> > > >>> my
> > > >> app is resized in a 320x240 frame. This behavior force iOS to resize
> > > >> every DOM elements to adjust to an arbitrary 320x240.
> > > >>>
> > > >>> I checked the behavior by putting a "alert(document.width) on
start
> > > up".
> > > >>>
> > > >>> Someone could help me override this behavior ? I'm not an iOS
nor
> > > >> objective C expert.
> > > >>>
> > > >>>
> > > >>> Cordialement.
> > > >>> ----------------------------
> > > >>> Maxime LUCE
> > > >>> maxime@touchit.fr
> > > >>> 06 28 60 72 34
> > > >>> http://touchit.fr
> > > >>>
> > > >>>
> > > >>> Not sure what you mean.
> > > >>>
> > > >>> Are you saying you can only have a canvas with a max size of
> > > >>> 320x240? I
> > > >> have an app with a larger canvas than that.
> > > >>>
> > > >>> If that is what you are saying, be sure you are not trying to
set
> > > >>> the
> > > >> canvas size just using CSS.
> > > >>>
> > > >>> For an example maybe have a look at my canvas demo:
> > > >>>
> > > >>> https://github.com/devgeeks/Canvas2ImageDemo
> > > >>> On 06/12/2013 12:06 pm, "Maxime LUCE" <Maxime@somatic.fr>
wrote:
> > > >>>
> > > >>>> Hi everyone,
> > > >>>>
> > > >>>> It appears that on iOS, webview is restricted to a 320x240
canvas.
> > > >>>>
> > > >>>> Is it possible to automatically set canvas size using device
> > > >>>> screen's
> > > >> one ?
> > > >>>>
> > > >>>> Why is it not the default scenario ?
> > > >>>>
> > > >>>> Cordialement.
> > > >>>> -------------------------------
> > > >>>> Maxime LUCE - Somatic
> > > >>>> maxime.luce@somatic.fr
> > > >>>> 06 28 60 72 34
> > > >>>>
> > > >>
> > > >>
> > >
> > >
> >
>

Mime
  • Unnamed multipart/alternative (inline, None, 0 bytes)
View raw message