You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@cordova.apache.org by Maxime LUCE <Ma...@somatic.fr> on 2013/12/06 02:06:05 UTC
iOS webview size
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
Re: iOS webview size
Posted by purplecabbage <pu...@gmail.com>.
Most device browsers report device-width as 320px for backwards compatability from when sites were designed to fit the iPhone screen.
Lots of info here:
https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag
Sent from my iPhone
> On Dec 7, 2013, at 4:17 AM, Maxime LUCE <Ma...@somatic.fr> wrote:
>
> I sometimes use canvas but the expressed issue is happening while there is no canvas.
> I used the term canvas to say "inside of web view frame".
>
>
> Cordialement.
> ----------------------------
> Maxime LUCE
> maxime@touchit.fr
> 06 28 60 72 34
> http://touchit.fr
>
> -----Original Message-----
> From: Stephan Wezel [mailto:s.wezel@web.de]
> Sent: samedi 7 décembre 2013 07:32
> To: dev@cordova.apache.org
> Subject: Re: iOS webview size
>
>> Sorry, i needed to specify that my app is not a canvas app, it's a HTML 5 app.
> Do you use the thml 5 canvas then?
>
>> Just to know, since which IOS version, hi resolution is available?
> This isn't directly tied to a iOS version but to a generation of iphone/ipad
>
> For iPhone: since iPhone 4 the display is a "Retina" Display (HiRes) For iPad: AFAIK since iPad 3
>
>> On Friday 06 December 2013 23:42:47 Maxime LUCE wrote:
>> Sorry, i needed to specify that my app is not a canvas app, it's a HTML 5 app.
>>
>> I use the viewport meta with value "initial-scale" to "1.0" and "width" to "device-width".
>>
>> I will try some CSS device pixel ratio fixes and let you know about the result.
>> Just to know, since which IOS version, hi resolution is available?
>>
>> Cordialement.
>> -------------------------------
>> Maxime LUCE - Somatic
>> maxime.luce@somatic.fr
>> 06 28 60 72 34
>> ________________________________
>> De : Stephan Wezel<ma...@web.de> Envoyé : 06/12/2013 18:36
>> À : dev@cordova.apache.org<ma...@cordova.apache.org>
>> Objet : Re: iOS webview size
>>
>> Oh i forgot to mention, that the posted code is derived from the High
>> DPI canvas entry on html5rocks
>>
>> Stephan
>>
>>> On Friday 06 December 2013 18:17:57 Stephan Wezel wrote:
>>> Or you could use following code to do the scaling automatically if
>>> needed
>>>
>>> var devicePixelRatio = window.devicePixelRatio || 1,
>>> backingStoreRatio = ctx.webkitBackingStorePixelRatio ||
>>> ctx.mozBackingStorePixelRatio ||
>>> ctx.msBackingStorePixelRatio ||
>>> ctx.oBackingStorePixelRatio ||
>>> ctx.backingStorePixelRatio || 1;
>>>
>>> ratio = devicePixelRatio / backingStoreRatio; if (devicePixelRatio
>>> !== backingStoreRatio) {
>>> var oldWidth = canvas.width;
>>> var oldHeight = canvas.height;
>>> canvas.width = oldWidth * ratio;
>>> canvas.height = oldHeight * ratio;
>>>
>>> canvas.style.width = oldWidth + 'px';
>>> canvas.style.height = oldHeight + 'px';
>>>
>>> // now scale the context to counter
>>> // the fact that we've manually scaled
>>> // our canvas element
>>> ctx.scale(ratio, ratio);
>>> }
>>>
>>> if you set the size of the canvas element to the screen/window size
>>> and using above code you will get on any resolution a sharp display
>>>
>>> I'm using above code successfully with cordova on iOS and Android
>>> (e.g. on a Nexus 4 the ratio is 1.5 instead of 2 on iPhone with
>>> retina display)
>>>
>>> Stephan
>>>
>>>> On Friday 06 December 2013 11:48:39 Ian Clelland wrote:
>>>> 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 <mm...@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
>>>>> <ag...@chromium.org>
>>>>> wrote:
>>>>>
>>>>>> Problem with viewport <meta> tag?
>>>>>>
>>>>>>
>>>>>> On Fri, Dec 6, 2013 at 10:07 AM, James Jong
>>>>>> <wj...@gmail.com>
>>>>> wrote:
>>>>>>
>>>>>>> Are you targeting prior to iOS 5?
>>>>>>> -James Jong
>>>>>>>
>>>>>>>> On Dec 6, 2013, at 9:49 AM, Maxime LUCE <Ma...@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
>>>>>>>> <Ma...@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 <Ma...@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" <Ma...@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
>
RE: iOS webview size
Posted by Maxime LUCE <Ma...@somatic.fr>.
I sometimes use canvas but the expressed issue is happening while there is no canvas.
I used the term canvas to say "inside of web view frame".
Cordialement.
----------------------------
Maxime LUCE
maxime@touchit.fr
06 28 60 72 34
http://touchit.fr
-----Original Message-----
From: Stephan Wezel [mailto:s.wezel@web.de]
Sent: samedi 7 décembre 2013 07:32
To: dev@cordova.apache.org
Subject: Re: iOS webview size
> Sorry, i needed to specify that my app is not a canvas app, it's a HTML 5 app.
Do you use the thml 5 canvas then?
> Just to know, since which IOS version, hi resolution is available?
This isn't directly tied to a iOS version but to a generation of iphone/ipad
For iPhone: since iPhone 4 the display is a "Retina" Display (HiRes) For iPad: AFAIK since iPad 3
On Friday 06 December 2013 23:42:47 Maxime LUCE wrote:
> Sorry, i needed to specify that my app is not a canvas app, it's a HTML 5 app.
>
> I use the viewport meta with value "initial-scale" to "1.0" and "width" to "device-width".
>
> I will try some CSS device pixel ratio fixes and let you know about the result.
> Just to know, since which IOS version, hi resolution is available?
>
> Cordialement.
> -------------------------------
> Maxime LUCE - Somatic
> maxime.luce@somatic.fr
> 06 28 60 72 34
> ________________________________
> De : Stephan Wezel<ma...@web.de> Envoyé : 06/12/2013 18:36
> À : dev@cordova.apache.org<ma...@cordova.apache.org>
> Objet : Re: iOS webview size
>
> Oh i forgot to mention, that the posted code is derived from the High
> DPI canvas entry on html5rocks
>
> Stephan
>
> On Friday 06 December 2013 18:17:57 Stephan Wezel wrote:
> > Or you could use following code to do the scaling automatically if
> > needed
> >
> > var devicePixelRatio = window.devicePixelRatio || 1,
> > backingStoreRatio = ctx.webkitBackingStorePixelRatio ||
> > ctx.mozBackingStorePixelRatio ||
> > ctx.msBackingStorePixelRatio ||
> > ctx.oBackingStorePixelRatio ||
> > ctx.backingStorePixelRatio || 1;
> >
> > ratio = devicePixelRatio / backingStoreRatio; if (devicePixelRatio
> > !== backingStoreRatio) {
> > var oldWidth = canvas.width;
> > var oldHeight = canvas.height;
> > canvas.width = oldWidth * ratio;
> > canvas.height = oldHeight * ratio;
> >
> > canvas.style.width = oldWidth + 'px';
> > canvas.style.height = oldHeight + 'px';
> >
> > // now scale the context to counter
> > // the fact that we've manually scaled
> > // our canvas element
> > ctx.scale(ratio, ratio);
> > }
> >
> > if you set the size of the canvas element to the screen/window size
> > and using above code you will get on any resolution a sharp display
> >
> > I'm using above code successfully with cordova on iOS and Android
> > (e.g. on a Nexus 4 the ratio is 1.5 instead of 2 on iPhone with
> > retina display)
> >
> > Stephan
> >
> > On Friday 06 December 2013 11:48:39 Ian Clelland wrote:
> > > 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 <mm...@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
> > > > <ag...@chromium.org>
> > > > wrote:
> > > >
> > > > > Problem with viewport <meta> tag?
> > > > >
> > > > >
> > > > > On Fri, Dec 6, 2013 at 10:07 AM, James Jong
> > > > > <wj...@gmail.com>
> > > > wrote:
> > > > >
> > > > > > Are you targeting prior to iOS 5?
> > > > > > -James Jong
> > > > > >
> > > > > > On Dec 6, 2013, at 9:49 AM, Maxime LUCE <Ma...@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
> > > > > > > <Ma...@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 <Ma...@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" <Ma...@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
> > > > > > >>>>
> > > > > > >>
> > > > > > >>
> > > > > >
> > > > > >
> > > > >
> > > >
> >
>
>
Re: iOS webview size
Posted by Stephan Wezel <s....@web.de>.
> Sorry, i needed to specify that my app is not a canvas app, it's a HTML 5 app.
Do you use the thml 5 canvas then?
> Just to know, since which IOS version, hi resolution is available?
This isn't directly tied to a iOS version but to a generation of iphone/ipad
For iPhone: since iPhone 4 the display is a "Retina" Display (HiRes)
For iPad: AFAIK since iPad 3
On Friday 06 December 2013 23:42:47 Maxime LUCE wrote:
> Sorry, i needed to specify that my app is not a canvas app, it's a HTML 5 app.
>
> I use the viewport meta with value "initial-scale" to "1.0" and "width" to "device-width".
>
> I will try some CSS device pixel ratio fixes and let you know about the result.
> Just to know, since which IOS version, hi resolution is available?
>
> Cordialement.
> -------------------------------
> Maxime LUCE - Somatic
> maxime.luce@somatic.fr
> 06 28 60 72 34
> ________________________________
> De : Stephan Wezel<ma...@web.de>
> Envoyé : 06/12/2013 18:36
> À : dev@cordova.apache.org<ma...@cordova.apache.org>
> Objet : Re: iOS webview size
>
> Oh i forgot to mention, that the posted code is derived from the High DPI canvas entry on html5rocks
>
> Stephan
>
> On Friday 06 December 2013 18:17:57 Stephan Wezel wrote:
> > Or you could use following code to do the scaling automatically if needed
> >
> > var devicePixelRatio = window.devicePixelRatio || 1,
> > backingStoreRatio = ctx.webkitBackingStorePixelRatio ||
> > ctx.mozBackingStorePixelRatio ||
> > ctx.msBackingStorePixelRatio ||
> > ctx.oBackingStorePixelRatio ||
> > ctx.backingStorePixelRatio || 1;
> >
> > ratio = devicePixelRatio / backingStoreRatio;
> > if (devicePixelRatio !== backingStoreRatio) {
> > var oldWidth = canvas.width;
> > var oldHeight = canvas.height;
> > canvas.width = oldWidth * ratio;
> > canvas.height = oldHeight * ratio;
> >
> > canvas.style.width = oldWidth + 'px';
> > canvas.style.height = oldHeight + 'px';
> >
> > // now scale the context to counter
> > // the fact that we've manually scaled
> > // our canvas element
> > ctx.scale(ratio, ratio);
> > }
> >
> > if you set the size of the canvas element to the screen/window size and using above code you will get on any resolution a sharp display
> >
> > I'm using above code successfully with cordova on iOS and Android (e.g. on a Nexus 4 the ratio is 1.5 instead of 2 on iPhone with retina display)
> >
> > Stephan
> >
> > On Friday 06 December 2013 11:48:39 Ian Clelland wrote:
> > > 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 <mm...@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 <ag...@chromium.org>
> > > > wrote:
> > > >
> > > > > Problem with viewport <meta> tag?
> > > > >
> > > > >
> > > > > On Fri, Dec 6, 2013 at 10:07 AM, James Jong <wj...@gmail.com>
> > > > wrote:
> > > > >
> > > > > > Are you targeting prior to iOS 5?
> > > > > > -James Jong
> > > > > >
> > > > > > On Dec 6, 2013, at 9:49 AM, Maxime LUCE <Ma...@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 <Ma...@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 <Ma...@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" <Ma...@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
> > > > > > >>>>
> > > > > > >>
> > > > > > >>
> > > > > >
> > > > > >
> > > > >
> > > >
> >
>
>
RE: iOS webview size
Posted by Maxime LUCE <Ma...@somatic.fr>.
Sorry, i needed to specify that my app is not a canvas app, it's a HTML 5 app.
I use the viewport meta with value "initial-scale" to "1.0" and "width" to "device-width".
I will try some CSS device pixel ratio fixes and let you know about the result.
Just to know, since which IOS version, hi resolution is available?
Cordialement.
-------------------------------
Maxime LUCE - Somatic
maxime.luce@somatic.fr
06 28 60 72 34
________________________________
De : Stephan Wezel<ma...@web.de>
Envoyé : 06/12/2013 18:36
À : dev@cordova.apache.org<ma...@cordova.apache.org>
Objet : Re: iOS webview size
Oh i forgot to mention, that the posted code is derived from the High DPI canvas entry on html5rocks
Stephan
On Friday 06 December 2013 18:17:57 Stephan Wezel wrote:
> Or you could use following code to do the scaling automatically if needed
>
> var devicePixelRatio = window.devicePixelRatio || 1,
> backingStoreRatio = ctx.webkitBackingStorePixelRatio ||
> ctx.mozBackingStorePixelRatio ||
> ctx.msBackingStorePixelRatio ||
> ctx.oBackingStorePixelRatio ||
> ctx.backingStorePixelRatio || 1;
>
> ratio = devicePixelRatio / backingStoreRatio;
> if (devicePixelRatio !== backingStoreRatio) {
> var oldWidth = canvas.width;
> var oldHeight = canvas.height;
> canvas.width = oldWidth * ratio;
> canvas.height = oldHeight * ratio;
>
> canvas.style.width = oldWidth + 'px';
> canvas.style.height = oldHeight + 'px';
>
> // now scale the context to counter
> // the fact that we've manually scaled
> // our canvas element
> ctx.scale(ratio, ratio);
> }
>
> if you set the size of the canvas element to the screen/window size and using above code you will get on any resolution a sharp display
>
> I'm using above code successfully with cordova on iOS and Android (e.g. on a Nexus 4 the ratio is 1.5 instead of 2 on iPhone with retina display)
>
> Stephan
>
> On Friday 06 December 2013 11:48:39 Ian Clelland wrote:
> > 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 <mm...@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 <ag...@chromium.org>
> > > wrote:
> > >
> > > > Problem with viewport <meta> tag?
> > > >
> > > >
> > > > On Fri, Dec 6, 2013 at 10:07 AM, James Jong <wj...@gmail.com>
> > > wrote:
> > > >
> > > > > Are you targeting prior to iOS 5?
> > > > > -James Jong
> > > > >
> > > > > On Dec 6, 2013, at 9:49 AM, Maxime LUCE <Ma...@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 <Ma...@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 <Ma...@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" <Ma...@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
> > > > > >>>>
> > > > > >>
> > > > > >>
> > > > >
> > > > >
> > > >
> > >
>
Re: iOS webview size
Posted by Stephan Wezel <s....@web.de>.
Oh i forgot to mention, that the posted code is derived from the High DPI canvas entry on html5rocks
Stephan
On Friday 06 December 2013 18:17:57 Stephan Wezel wrote:
> Or you could use following code to do the scaling automatically if needed
>
> var devicePixelRatio = window.devicePixelRatio || 1,
> backingStoreRatio = ctx.webkitBackingStorePixelRatio ||
> ctx.mozBackingStorePixelRatio ||
> ctx.msBackingStorePixelRatio ||
> ctx.oBackingStorePixelRatio ||
> ctx.backingStorePixelRatio || 1;
>
> ratio = devicePixelRatio / backingStoreRatio;
> if (devicePixelRatio !== backingStoreRatio) {
> var oldWidth = canvas.width;
> var oldHeight = canvas.height;
> canvas.width = oldWidth * ratio;
> canvas.height = oldHeight * ratio;
>
> canvas.style.width = oldWidth + 'px';
> canvas.style.height = oldHeight + 'px';
>
> // now scale the context to counter
> // the fact that we've manually scaled
> // our canvas element
> ctx.scale(ratio, ratio);
> }
>
> if you set the size of the canvas element to the screen/window size and using above code you will get on any resolution a sharp display
>
> I'm using above code successfully with cordova on iOS and Android (e.g. on a Nexus 4 the ratio is 1.5 instead of 2 on iPhone with retina display)
>
> Stephan
>
> On Friday 06 December 2013 11:48:39 Ian Clelland wrote:
> > 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 <mm...@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 <ag...@chromium.org>
> > > wrote:
> > >
> > > > Problem with viewport <meta> tag?
> > > >
> > > >
> > > > On Fri, Dec 6, 2013 at 10:07 AM, James Jong <wj...@gmail.com>
> > > wrote:
> > > >
> > > > > Are you targeting prior to iOS 5?
> > > > > -James Jong
> > > > >
> > > > > On Dec 6, 2013, at 9:49 AM, Maxime LUCE <Ma...@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 <Ma...@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 <Ma...@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" <Ma...@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
> > > > > >>>>
> > > > > >>
> > > > > >>
> > > > >
> > > > >
> > > >
> > >
>
Re: iOS webview size
Posted by Stephan Wezel <s....@web.de>.
Or you could use following code to do the scaling automatically if needed
var devicePixelRatio = window.devicePixelRatio || 1,
backingStoreRatio = ctx.webkitBackingStorePixelRatio ||
ctx.mozBackingStorePixelRatio ||
ctx.msBackingStorePixelRatio ||
ctx.oBackingStorePixelRatio ||
ctx.backingStorePixelRatio || 1;
ratio = devicePixelRatio / backingStoreRatio;
if (devicePixelRatio !== backingStoreRatio) {
var oldWidth = canvas.width;
var oldHeight = canvas.height;
canvas.width = oldWidth * ratio;
canvas.height = oldHeight * ratio;
canvas.style.width = oldWidth + 'px';
canvas.style.height = oldHeight + 'px';
// now scale the context to counter
// the fact that we've manually scaled
// our canvas element
ctx.scale(ratio, ratio);
}
if you set the size of the canvas element to the screen/window size and using above code you will get on any resolution a sharp display
I'm using above code successfully with cordova on iOS and Android (e.g. on a Nexus 4 the ratio is 1.5 instead of 2 on iPhone with retina display)
Stephan
On Friday 06 December 2013 11:48:39 Ian Clelland wrote:
> 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 <mm...@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 <ag...@chromium.org>
> > wrote:
> >
> > > Problem with viewport <meta> tag?
> > >
> > >
> > > On Fri, Dec 6, 2013 at 10:07 AM, James Jong <wj...@gmail.com>
> > wrote:
> > >
> > > > Are you targeting prior to iOS 5?
> > > > -James Jong
> > > >
> > > > On Dec 6, 2013, at 9:49 AM, Maxime LUCE <Ma...@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 <Ma...@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 <Ma...@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" <Ma...@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
> > > > >>>>
> > > > >>
> > > > >>
> > > >
> > > >
> > >
> >
Re: iOS webview size
Posted by Ian Clelland <ic...@chromium.org>.
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 <mm...@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 <ag...@chromium.org>
> wrote:
>
> > Problem with viewport <meta> tag?
> >
> >
> > On Fri, Dec 6, 2013 at 10:07 AM, James Jong <wj...@gmail.com>
> wrote:
> >
> > > Are you targeting prior to iOS 5?
> > > -James Jong
> > >
> > > On Dec 6, 2013, at 9:49 AM, Maxime LUCE <Ma...@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 <Ma...@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 <Ma...@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" <Ma...@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
> > > >>>>
> > > >>
> > > >>
> > >
> > >
> >
>
Re: iOS webview size
Posted by Michal Mocny <mm...@chromium.org>.
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 <ag...@chromium.org> wrote:
> Problem with viewport <meta> tag?
>
>
> On Fri, Dec 6, 2013 at 10:07 AM, James Jong <wj...@gmail.com> wrote:
>
> > Are you targeting prior to iOS 5?
> > -James Jong
> >
> > On Dec 6, 2013, at 9:49 AM, Maxime LUCE <Ma...@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 <Ma...@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 <Ma...@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" <Ma...@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
> > >>>>
> > >>
> > >>
> >
> >
>
Re: iOS webview size
Posted by Andrew Grieve <ag...@chromium.org>.
Problem with viewport <meta> tag?
On Fri, Dec 6, 2013 at 10:07 AM, James Jong <wj...@gmail.com> wrote:
> Are you targeting prior to iOS 5?
> -James Jong
>
> On Dec 6, 2013, at 9:49 AM, Maxime LUCE <Ma...@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 <Ma...@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 <Ma...@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" <Ma...@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
> >>>>
> >>
> >>
>
>
Re: iOS webview size
Posted by James Jong <wj...@gmail.com>.
Are you targeting prior to iOS 5?
-James Jong
On Dec 6, 2013, at 9:49 AM, Maxime LUCE <Ma...@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 <Ma...@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 <Ma...@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" <Ma...@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
>>>>
>>
>>
RE: iOS webview size
Posted by Maxime LUCE <Ma...@somatic.fr>.
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 <Ma...@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 <Ma...@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" <Ma...@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
> >>
>
>
RE: iOS webview size
Posted by Maxime LUCE <Ma...@somatic.fr>.
You're right it's 320x480.
I launch it on a iPhone retina emulator.
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 <Ma...@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 <Ma...@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" <Ma...@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
> >>
>
>
Re: iOS webview size
Posted by Michal Mocny <mm...@chromium.org>.
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 <Ma...@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 <Ma...@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" <Ma...@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
> >>
>
>
RE: iOS webview size
Posted by Maxime LUCE <Ma...@somatic.fr>.
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 <Ma...@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" <Ma...@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
>>
Re: iOS webview size
Posted by James Jong <wj...@gmail.com>.
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 <Ma...@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" <Ma...@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
>>
RE: iOS webview size
Posted by Maxime LUCE <Ma...@somatic.fr>.
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" <Ma...@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
>
Re: iOS webview size
Posted by Tommy Williams <to...@devgeeks.org>.
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" <Ma...@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
>