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
Developer
nathanpc
Posts: 134
Registered: ‎05-19-2012
My Device: Torch 9800, PlayBook 64GB, Dev Alpha
My Carrier: VIVO Brazil
Accepted Solution

bbUI.js Out of Proportions in Dev Alpha

Yesterday I got my Dev Alpha at the São Paulo BlackBerry Jam and as everyone I'm playing with it today, mainly porting my apps to it. I've tried compiling my bbUI.js/WebWorks app using both the BB 10 and the PlayBook SDKs but I couldn't get my app to display correctly on my Dev Alpha, it's completely out of proportions.

 

Here's a picture of the problem:

 

IMG-20120824-00037.jpg

 

Any ideas on how to correct this?

 

PS: It works perfectly on the PlayBook and Ripple.

If I helped you please click the "Like" button to support my work.
My apps: CherryNotes - Bookmarked - Requests
Social Me: about.me - Twitter
Please use plain text.
Developer
nathanpc
Posts: 134
Registered: ‎05-19-2012
My Device: Torch 9800, PlayBook 64GB, Dev Alpha
My Carrier: VIVO Brazil

Re: bbUI.js Out of Proportions in Dev Alpha

Bump... :smileysad:
If I helped you please click the "Like" button to support my work.
My apps: CherryNotes - Bookmarked - Requests
Social Me: about.me - Twitter
Please use plain text.
Developer
rorybarnes
Posts: 214
Registered: ‎01-07-2011
My Device: Bold 9900
My Carrier: Rogers

Re: bbUI.js Out of Proportions in Dev Alpha

What OS version is the Dev Alpha on? What version of bbUI are you using?

--
Rory (@roryboy)
Click "Accept as Solution" if post solved your original issue. Give like/thumbs up if you feel post is helpful
Please use plain text.
Developer
nathanpc
Posts: 134
Registered: ‎05-19-2012
My Device: Torch 9800, PlayBook 64GB, Dev Alpha
My Carrier: VIVO Brazil

Re: bbUI.js Out of Proportions in Dev Alpha

I'm using bbUI 0.9.3 and my Dev Alpha is running 10.0.4.188 (I saw the update on the Dev Alpha site, but I still haven't arrived at home so where my internet connection is decent enough to download it). :smileyhappy:
If I helped you please click the "Like" button to support my work.
My apps: CherryNotes - Bookmarked - Requests
Social Me: about.me - Twitter
Please use plain text.
Developer
rorybarnes
Posts: 214
Registered: ‎01-07-2011
My Device: Bold 9900
My Carrier: Rogers

Re: bbUI.js Out of Proportions in Dev Alpha

That is probably your problem then :smileysurprised:

 

There is a font update in OS 10.0.6, bbUI 0.9.3 was updated to account for that. Try it again once you update your DevAlpha, if you are still having problems something else is amiss.

--
Rory (@roryboy)
Click "Accept as Solution" if post solved your original issue. Give like/thumbs up if you feel post is helpful
Please use plain text.
Developer
nathanpc
Posts: 134
Registered: ‎05-19-2012
My Device: Torch 9800, PlayBook 64GB, Dev Alpha
My Carrier: VIVO Brazil

Re: bbUI.js Out of Proportions in Dev Alpha

[ Edited ]

I updated to 10.0.6.545 and I'm still getting the same thing using both SDKs... :smileysad:

 

I commented all the "features" from my build.xml to avoid this issue: https://github.com/blackberry/BB10-Webworks-Packager/issues/175. Maybe this is causing the problem?

Any other suggestions?

If I helped you please click the "Like" button to support my work.
My apps: CherryNotes - Bookmarked - Requests
Social Me: about.me - Twitter
Please use plain text.
Developer
rorybarnes
Posts: 214
Registered: ‎01-07-2011
My Device: Bold 9900
My Carrier: Rogers

Re: bbUI.js Out of Proportions in Dev Alpha

Do you do any CSS mods to the base font size?

 

You should be able to leave the features that are supported by BB10 in, just comment out the ones that aren't supported.

 

If your code is using those features it could cause problems with JS rendering, so best to put a check that the feature exists before you try to use it.

 

I don't have many other ideas. Hard to debug stuff like this remotely. Are you seeing any errors in remote inspector? can you check that the blackberry and bb objects exist?

--
Rory (@roryboy)
Click "Accept as Solution" if post solved your original issue. Give like/thumbs up if you feel post is helpful
Please use plain text.
Developer
nathanpc
Posts: 134
Registered: ‎05-19-2012
My Device: Torch 9800, PlayBook 64GB, Dev Alpha
My Carrier: VIVO Brazil

Re: bbUI.js Out of Proportions in Dev Alpha

I was looking at the bbUI.js Example app source code (that was displaying correctly on the Dev Alpha) and I noticed that the viewport meta tag was a bit different than my one. My one was like this:

 

<meta id="viewport" name="viewport" content="initial-scale=1.0, width=device-width, user-scalable=no" />

I noticed that the bbUI.js one had a device-density parameter. I added it and now the app is diplaying correctly. Here's the correct one for your apps:

 

<meta id="viewport" name="viewport" content="initial-scale=1.0, width=device-width, user-scalable=no, target-densitydpi=device-dpi" />

 

If I helped you please click the "Like" button to support my work.
My apps: CherryNotes - Bookmarked - Requests
Social Me: about.me - Twitter
Please use plain text.
Developer
rorybarnes
Posts: 214
Registered: ‎01-07-2011
My Device: Bold 9900
My Carrier: Rogers

Re: bbUI.js Out of Proportions in Dev Alpha

[ Edited ]

Glad you figured it out.

Just a note: the viewport will be set automatically for you based on the device it is on in v0.9.4 :smileyhappy:

https://github.com/blackberry/bbUI.js/issues/295

--
Rory (@roryboy)
Click "Accept as Solution" if post solved your original issue. Give like/thumbs up if you feel post is helpful
Please use plain text.
Developer
26filip
Posts: 232
Registered: ‎01-30-2011
My Device: Dev Alpha C, Z10 LE
My Carrier: P4

Re: bbUI.js Out of Proportions in Dev Alpha


nathanpc wrote:

I noticed that the bbUI.js one had a device-density parameter. I added it and now the app is diplaying correctly. Here's the correct one for your apps:

 

<meta id="viewport" name="viewport" content="initial-scale=1.0, width=device-width, user-scalable=no, target-densitydpi=device-dpi" />

 

For my apps it wasn't correct. (build with WebWorks SDK 1.0.2.9). But setting initial-scale into 0.4 give correct view.

 

<meta id="viewport" name="viewport" content="initial-scale=0.4, width=device-width, user-scalable=no, target-densitydpi=device-dpi" />
All time online :smileyvery-happy:
Please use plain text.