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
New Contributor
Posts: 9
Registered: ‎01-25-2012
My Device: BlackBerry 9800
My Carrier: Telus

Multi screen resolution config support

When is this going to be implemented? Currently you can assign a backgroundImage and foregroundImage.. which is great, but doesn't allow for multiple screen resolutions. 

 

Is there plans to implement this? How have other people achieved a nice looking loading screen image that's supported on multiple devices with different resolutions?

Contributor
Posts: 13
Registered: ‎03-06-2012
My Device: 9930, 9900
My Carrier: -

Re: Multi screen resolution config support

Best way to tackle this:

 

1) High Quality image that looks good when stretched

 

2) Two different versions of your application one for portrait, then landscape

Regular Contributor
Posts: 81
Registered: ‎03-09-2012
My Device: PlayBook & Bold 9780
My Carrier: n/a

Re: Multi screen resolution config support

It is implemented already, through css3 MediaQueries. An example with 3 different sized backgrounds for both orientations:

 

@media (orientation: portrait) and (max-width: 319px) {
  body {
    background-image:url('port_s.png');
  }
}
@media (orientation: portrait) and (min-width: 320px) {
  body {
    background-image:url('port_m.png');
  }
}
@media (orientation: portrait) and (min-width: 480px) {
  body {
    background-image:url('port_l.png');
  }
}
@media (orientation: landscape) and (max-height: 319px) {
  body {
    background-image:url('land_s.png');
  }
}
@media (orientation: landscape) and (min-height: 320px) {
  body {
    background-image:url('land_m.png');
  }
}
@media (orientation: landscape) and (min-height: 480px) {
  body {
    background-image:url('land_l.png');
  }
}

Best would be actually to use methods that don't depend on bitmap images, but render your background e.g. with background: -webkit-gradient() or use scalable vector graphics (svg)

New Contributor
Posts: 9
Registered: ‎01-25-2012
My Device: BlackBerry 9800
My Carrier: Telus

Re: Multi screen resolution config support

@BertKoor: Thanks, although I'm not looking for a CSS3 solution, and I'm specifically talking about the loading screen before the webpage is shown upon first load, which doesnt support multiple screen sizes because its defined within the config.xml file and not in the code.