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
zedsaid
Posts: 34
Registered: ‎08-01-2012
My Carrier: None
Accepted Solution

Auto resize and layout?

On rotation, does WebWorks have any support for auto resize or layout?  Or when I get a rotation event, do I have to manually move things around to fit the new orientation?

Please use plain text.
Developer
gluth
Posts: 192
Registered: ‎09-23-2009
My Carrier: Plus GSM

Re: Auto resize and layout?

If you have layout based on percents, and width of main container set to 100% (all other sizes as relative), then during rotation screen will fit to new width reformating webworks page

 

I'm not sure, but on newer devices css media query should work as they are part of the standard, so you could have autoadjusting layout which will follow rotation changes (by example action bar hiding when in portrait mode, or moving itself to right).

Found my post helpfull? Like it! It solves your trouble? Help others and accept it as solution. Search before asking.
My apps: Secret Cod3s | Should my tablet be banned?
--
Jakub Nietrzeba
PGS Software S.A.
Your reliable partner in Poland - IT Outsourcing - BlackBerry, iPhone, Web and Standalone applications
Please use plain text.
Administrator
astanley
Posts: 1,359
Registered: ‎07-02-2009
My Carrier: Bell

Re: Auto resize and layout?

Great answer gluth!

 

I wanted to add a few comments of my own:

 

The Web engine will automatically try to resize your content when you change the orientation of the device.  If you have a good viewport, and as gluth mentioned, are using relative sizing then it should scale according to the new screen width.

 

However, you can also listen for the orientation change event:

http://blackberry.github.com/WebWorks-Samples/kitchenSink/html/browser/orientation.html

 

Finally, media queries are supported on PlayBook and BlackBerry 10 Dev Alpha.  These powerful techniques makes it easy to design CSS for different screen orientations:

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

Follow me on Twitter: @n_adam_stanley
-------------------------------------------------------------------------------------------------------------------------
Your app doesn't work? Use BlackBerry remote web inspector to find out why.
Please use plain text.