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
laurentC
Posts: 268
Registered: ‎02-05-2010
My Device: Blackberry Z10
Accepted Solution

BB10 screen resolution Sencha Touch

Hello,

 

I'm trying to port my PlayBook app Next Songs on BB10.

When I'm testing it on the Ripple emulator, it's ok, my main panel appears with the good size. I specifically set the height and width of the panel (1280, 720). I know the dev alpha device is 1280 x 768, I'm expecting to have the right portion of the screen empty and that's how it looks on the Ripple emulator.

 

My problem is when I run my app on the alpha device. The panel is not displayed with the good resolution, it's bigger than the screen...

 

I tried to specify the screen hight and width in the the meta tag in my index.html file but it has no effect. 

What am I doing wrong ? 

I'm not using the beta BB10 sencha them, but I think it's not mandatory...

 

Any help would be welcome,

Thanks,

Laurent

Twitter : @LaurentKP
My apps
Developer
laurentC
Posts: 268
Registered: ‎02-05-2010
My Device: Blackberry Z10

Re: BB10 screen resolution Sencha Touch

Issue fixed with this index.html (meta script have to be at the end...) :

 

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Next Songs</title>
<link rel="stylesheet" href="lib/touch/resources/css/sencha-touch.css" type="text/css" />
<script src="local:///chrome/webworks.js" type="text/javascript"></script>
<script type="text/javascript" src="lib/touch/sencha-touch-all.js" ></script>
<script type="text/javascript" src="app.js" ></script>
<script>
var meta = document.createElement("meta");
meta.setAttribute('name','viewport');
meta.setAttribute('content','initial-scale='+ (1/window.devicePixelRatio) + ',user-scalable=no');
document.getElementsByTagName('head')[0].appendChild(meta);
</script>
</head>
<body>

</body>
</html>

Twitter : @LaurentKP
My apps