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
Nolte
Posts: 39
Registered: ‎09-02-2012
My Device: No Longer Using.
My Carrier: N/A

CSS orientation media query works in browser but not in WebWorks App

I'm using the Dev Alpha to build an application that works in portrait and landscape mode.

In the browser, this works perfectly using the CSS from the kitchen sink example:

http://blackberry.github.com/WebWorks-Samples/kitchenSink/css/css3/mediaquery.css

 

However, when I use the same CSS in the WebWorks app I'm building it doesn't work. I've opened the resource via the Dev Alpha's browser and it works fine.

 

The behaviour it exhibits is that the screen will not rotate while in my app. I have to switch to the app switcher / home screen and keep the device rotated, then switch back to the app after the device does the rotation animation.

 

Once I'm back in the application, my media queries for orientation never take effect. It seems as though the browser is making a "best guess" at what the dimensions should be based on the orientation in which the application was launched.

 

I have tested that both orientations work fine if the application is launched in the intended orientation. However, upon rotating the device, the application exhibits "odd" rendering behaviour. It's apparent that the orientation event isn't firing, causing the CSS to never be recalculated. 

Gave up on BlackBerry and delisted all apps.
Please use plain text.
Developer
Developer
LBP
Posts: 607
Registered: ‎04-29-2011
My Device: PlayBook 16GB, BB10 LE Z10 (red)
My Carrier: none

Re: CSS orientation media query works in browser but not in WebWorks App

As far as I know the WebWorks app container is buggy with switchting between portrait and landscape mode, so it might not work until it is fixed. When I run an app on mine in portrait and switch device to landscape the app is stretched to fill the screen and this isn't the behaviour it should have if the switch would work well.


"Like" if you liked the post.
"Accept as Solution" if the post solves your question.
Please use plain text.
Contributor
Nolte
Posts: 39
Registered: ‎09-02-2012
My Device: No Longer Using.
My Carrier: N/A

Re: CSS orientation media query works in browser but not in WebWorks App

In android, the manifest.xml file has some control over the allowed orientations. Is there an analogue in BlackBerry's config.xml that would work in a similar way?

Otherwise, can the webworks dev team speak as to a workaround and timeline for a fix?

How's the kitchensink app working (in theory), since it uses the same css?

Gave up on BlackBerry and delisted all apps.
Please use plain text.
Developer
Developer
LBP
Posts: 607
Registered: ‎04-29-2011
My Device: PlayBook 16GB, BB10 LE Z10 (red)
My Carrier: none

Re: CSS orientation media query works in browser but not in WebWorks App

There is a config.xml documentation for the orientation but as far as I know switching the orientation is buggy in BB10 so far at will not be used at this time until they fix it. But you might be able to use the config.xml to define the setting for the running app to be in landscape mode or in portrait mode and it should stay in that mode as far as you do not minimize the app to background and rotate the screen. If so you can see it will be stretched really badly.


"Like" if you liked the post.
"Accept as Solution" if the post solves your question.
Please use plain text.
Contributor
Nolte
Posts: 39
Registered: ‎09-02-2012
My Device: No Longer Using.
My Carrier: N/A

Re: CSS orientation media query works in browser but not in WebWorks App

And fix appears to be in the works:

https://github.com/blackberry/BB10-WebWorks-Framework/issues/88

Gave up on BlackBerry and delisted all apps.
Please use plain text.
Developer
Developer
LBP
Posts: 607
Registered: ‎04-29-2011
My Device: PlayBook 16GB, BB10 LE Z10 (red)
My Carrier: none

Re: CSS orientation media query works in browser but not in WebWorks App

Yes. Definitely they are working on a fix for that.


"Like" if you liked the post.
"Accept as Solution" if the post solves your question.
Please use plain text.