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

Native Development

Reply
Developer
urbanglowcam
Posts: 148
Registered: ‎10-30-2010
My Carrier: Verizon
Accepted Solution

Scrolling/Overflow for QML Pages?

Someone fill me in on the nature of each QML Page Component.

 

I assumed stacking components (ImageView, Label, TextArea, etc.) with a top-down direction will eventually cause the page to scroll vertically.

 

However, in my case, I created a page with a Page, then Container, then ImageView component with an image that takes about half the screen. I then added TextArea component with several paragraphs of text. But it seemed to squish my image vertically so it's not proportional and distorted. I think it did this to fit everything on the screen as now the TextArea cuts off right before my tab bar at the bottom.

 

But shouldn't the TextArea extend down to where the text ends, and the whole page should scroll for the user? Coincidentally, my goal is to keep the TextArea how that is and have it independently scroll with a smaller space taken. But the point is, I don't know why the image at the top was squished to do this. I fixed the issue with adjusting the image scaling, but shouldn't everything have an overflow and allow vertical scrolling by default?

 

Sorry if this is an obvious answer, but I'm still getting used to Cascades. Thank you.

Please use plain text.
Developer
bobdodd
Posts: 116
Registered: ‎10-31-2012
My Carrier: -

Re: Scrolling/Overflow for QML Pages?

[ Edited ]

Actually I wouldn't expect a Page to scroll unless I had told it to scroll. Just different ways of looking at things I guess.

 

There is a separate ScrollView element, so you could add that to the page and insert your content into the ScrollView. Perhaps you could try that?

Please use plain text.
Developer
urbanglowcam
Posts: 148
Registered: ‎10-30-2010
My Carrier: Verizon

Re: Scrolling/Overflow for QML Pages?

Great. I will try this. The reason I ask this is because in another QML Page, using the ListView had everything scroll automatically. I guess it's a difference of what ListView allows by default Vs. ImageView / TextArea.

Please use plain text.
Developer
peter9477
Posts: 6,447
Registered: ‎12-08-2010
My Carrier: none

Re: Scrolling/Overflow for QML Pages?

As bobdodd said, and also note this property which may have some role to play: https://developer.blackberry.com/cascades/reference/bb__cascades__page.html#resizebehavior

Peter Hansen -- (BB10 and dev-related blog posts at http://peterhansen.ca.)
Author of White Noise and Battery Guru for BB10 and for PlayBook | Get more from your battery!
Please use plain text.
Developer
urbanglowcam
Posts: 148
Registered: ‎10-30-2010
My Carrier: Verizon

Re: Scrolling/Overflow for QML Pages?

Thanks you two. ScrollView definitely gave me what I was originally looking for. The only thing is, now that I have it, it appears to give me too much elasticity to the point where the whole page feels like a webpage, more than a stationary app. It could come in handy in the future though.

 

Peter, I took your suggestion and tried including

 

Page {

resizeBehavior: PageResizeBehavior.None

*

*

*

 

But it didn't seem to do anything for me. There wasn't an error or anything though. But using it still gave me the squished image when too many components are listed. I think my best bet is applying the image scale/height adjustments.

 

ImageView {
    id: driverPhotoURL
    scalingMethod: ScalingMethod.AspectFill
    minHeight: 481.0
}

 

Thanks again!

Please use plain text.
Developer
bobdodd
Posts: 116
Registered: ‎10-31-2012
My Carrier: -

Re: Scrolling/Overflow for QML Pages?

You could try wrapping your ScrollView inside a Container

 

https://developer.blackberry.com/cascades/reference/bb__cascades__container.html

 

It's possible to set preferred, minimum, and maximum sizes for a container, so that may give you the control you want.

 

 

So something like:

 

Page {

   Container {

       ScrollView {

           content....

      }

}

 

You can also wrap your content in Containers to help define their sizes also.

 

Please use plain text.
Developer
urbanglowcam
Posts: 148
Registered: ‎10-30-2010
My Carrier: Verizon

Re: Scrolling/Overflow for QML Pages?

Yeah, that's what I did. Though I just wanted the TextArea component to show scrollin text at the bottom, so I wrapped it in a ScrollView.

 

Now everything is looking closer to how I want it. :smileyhappy:

Please use plain text.