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
Regular Contributor
iruka
Posts: 79
Registered: ‎09-17-2012
My Device: Torch 9800
My Carrier: DiGi

BlackBerry Webworks Scrolling Beyond Width or Height

Hi all. The basic layout of the mobile app is:

The html layout:

 

 <div id="title">Title</div>
    <div id="tabs">Some tabs</div>
    <div id="container" x-blackberry-focusable="true">
    <div id="contents" style="width: "1000px;" height: "1000px;">
    <div x-blackberry-focusable="true" onmouseover="highlight(this)" onmouseout="noHighlight(this)">I am some content">
     . 
     .
     .
    <div x-blackberry-focusable="true" onmouseover="highlight(this)" onmouseout="noHighlight(this)">I am some content"> 
    </div>
    </div>

 

The css code:

 

  #title
    {
       height: 50px;
    }
    #tabs
    {
       height: 40px;
    }
    #container
    {
       overflow: auto;
    }

 

  I set the width and height of the <body> using jQuery to detect the width and height of the mobile screen so it fits different version of BlackBerry phone. jQuery is also used to detect width for div#title, div#tabs and div#container.Finally the height of div#container is calculated by subtracting the screen height with div#title and div#tabs height.

 

The contents inside div#container will always be bigger than the div#container height or width. For example on Torch 9800 the screen is 360x480 div#container would be 360x390 then anything inside would be bigger than div#container.

 

Even though I set div#container overflow: auto, when I use trackpad or trackball to scroll the contents inside div#container, it will never get past the div#container width or height even though the inner container is bigger than div#container.

 

Can anyone please help me. I have stuck for weeks and really at lost.

 

Thank you.

Please use plain text.
Developer
SumiGhosh
Posts: 435
Registered: ‎09-20-2011
My Device: Z10 LE, Playbook, DevAlpha C, 9900, 9380
My Carrier: Vodafone

Re: BlackBerry Webworks Scrolling Beyond Width or Height

What u want?

What i got from your post is to scroll the conent using focus-based navigation which is not in the visible area.

Please use plain text.
Regular Contributor
iruka
Posts: 79
Registered: ‎09-17-2012
My Device: Torch 9800
My Carrier: DiGi

Re: BlackBerry Webworks Scrolling Beyond Width or Height

Yupz, you are right. The scrolling mode is focus based navigation. I am trying to make div#container scroll the div#content.

 

For example, div#container has width of 500px and height of 500px with overflow set to auto. And then the div#content that is inside the div#container will always be bigger than div#container (e.g width: 1000px, height: 800px, but this depends on the data being attrieved from database).

 

But when scrolling using trackpad/trackball, I can only scroll to the limit of the div#container but it has been set to overflow: auto, shouldn't it be able to scoll more than that? Or am I doing wrong?

Please use plain text.
Developer
SumiGhosh
Posts: 435
Registered: ‎09-20-2011
My Device: Z10 LE, Playbook, DevAlpha C, 9900, 9380
My Carrier: Vodafone

Re: BlackBerry Webworks Scrolling Beyond Width or Height

As i know this is a limitation in webworks.... I came to same scenario in one of my previous application and i changed the platform( i.e to Blackberry Java).

 

Please check the link: https://github.com/blackberry/bbUI.js/issues/16

Please use plain text.
Regular Contributor
iruka
Posts: 79
Registered: ‎09-17-2012
My Device: Torch 9800
My Carrier: DiGi

Re: BlackBerry Webworks Scrolling Beyond Width or Height

[ Edited ]

Oh dear. My company's customer wants it to be developed using Webworks. :smileysad:

 

Thanks.

 

I almost forgot , did you encounter any problems trying to get scrollbar to display using Webworks?

Please use plain text.
Developer
SumiGhosh
Posts: 435
Registered: ‎09-20-2011
My Device: Z10 LE, Playbook, DevAlpha C, 9900, 9380
My Carrier: Vodafone

Re: BlackBerry Webworks Scrolling Beyond Width or Height

What are all the OS you developing the app for?
yeah, you can use scrollbar by avoiding focus based navigation method.
Please use plain text.
Regular Contributor
iruka
Posts: 79
Registered: ‎09-17-2012
My Device: Torch 9800
My Carrier: DiGi

Re: BlackBerry Webworks Scrolling Beyond Width or Height

We are focusing on OS 6 and OS 7. The device we use for testing are 9800 and 9900. However our customer have users using 9780, 9700 and 9650 which are non-touch screen device.

Please use plain text.
Developer
SumiGhosh
Posts: 435
Registered: ‎09-20-2011
My Device: Z10 LE, Playbook, DevAlpha C, 9900, 9380
My Carrier: Vodafone

Re: BlackBerry Webworks Scrolling Beyond Width or Height

Its ok. By removing focus based navigation you will have cursor pointer, using this you can navigate the pointer to the scrollbar and scroll the page for non touch devices. But in OS5.0, webworks scroll is not so smooth and thats why i asked you the OS that you developing for.
Please use plain text.
Regular Contributor
iruka
Posts: 79
Registered: ‎09-17-2012
My Device: Torch 9800
My Carrier: DiGi

Re: BlackBerry Webworks Scrolling Beyond Width or Height

Thanks for the advice.

 

Wish I could convice them to scroll without focus based navigation but they want focus based navigation for non-touch screen.

Please use plain text.