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
Posts: 435
Registered: ‎09-20-2011
My Device: Z10 LE, Playbook, DevAlpha C, 9900, 9380
My Carrier: Vodafone
Accepted Solution

How to centalize the container in a page?

[ Edited ]

Hi,

 

Below is my code

    Container {
        background: back.imagePaint
        horizontalAlignment: HorizontalAlignment.Fill
        verticalAlignment: VerticalAlignment.Fill
        layout: StackLayout {
        }
        Container{
id:tocenter background: cont.imagePaint horizontalAlignment: HorizontalAlignment.Fill verticalAlignment: VerticalAlignment.Center Container { horizontalAlignment: HorizontalAlignment.Left Label { id:quotetf text:"\""+objectQD.text+"\"" multiline: true; textStyle.fontSize: FontSize.Large textStyle.fontFamily: "" textStyle.fontStyle: FontStyle.Normal textStyle.textAlign: TextAlign.Left } } Container { rightPadding: 100.0 horizontalAlignment: HorizontalAlignment.Right Label{ id: authortf text:"- "+objectQD.dayauthor textStyle { base: authorstyle.style } maxWidth: 768 } } } }

 Here i want to centralize the container with id:tocenter, but its not working with the above code

Developer
Posts: 188
Registered: ‎07-19-2012
My Device: Z10 LE
My Carrier: Three

Re: How to centalize the container in a page?

Are there any parent containers above your root container in that code? If so, you'll need to make sure that every container level uses horizontalAlignment: HorizontalAlignment.Fill as a container can only ever be as big as its parent.

 

If not, the quick and dirty method would be add preferredHeight: 1280 to your root container. This should be ok for the Q10 as it'll automatically set your container's height to be 720, the maximum space available.



Did this post help you? If so, please make sure to "like" it!
Developer
Posts: 435
Registered: ‎09-20-2011
My Device: Z10 LE, Playbook, DevAlpha C, 9900, 9380
My Carrier: Vodafone

Re: How to centalize the container in a page?

No other container, it is inside a Page. I'm only having a title bar and container that i coded above. I have chaged as you said.... but cant see any change.........
Highlighted
Developer
Posts: 188
Registered: ‎07-19-2012
My Device: Z10 LE
My Carrier: Three

Re: How to centalize the container in a page?

Just to confirm, you're trying to vertically center that container?



Did this post help you? If so, please make sure to "like" it!
Developer
Posts: 1,524
Registered: ‎12-18-2012
My Device: Z30, Z10 LE, DevAlpha C, PlayBook

Re: How to centalize the container in a page?

"preferredHeight: Infinity" should likely work as well.

 

When using a vertical StackLayout, verticalAlignment property won't work. Only horizontal one will.

 

To center the item vertically you can add empty containers above and below with layoutProperties set to StackLayoutProperties with spaceQuota: 1, or use a DockLayout.

 


Andrey Fidrya, @zmeyc on twitter
Developer
Posts: 435
Registered: ‎09-20-2011
My Device: Z10 LE, Playbook, DevAlpha C, 9900, 9380
My Carrier: Vodafone

Re: How to centalize the container in a page?

[ Edited ]

@mdodd Yes...

Developer
Posts: 188
Registered: ‎07-19-2012
My Device: Z10 LE
My Carrier: Three

Re: How to centalize the container in a page?

I agree with Zmey, a DockLayout shoud do the trick.



Did this post help you? If so, please make sure to "like" it!
Developer
Posts: 435
Registered: ‎09-20-2011
My Device: Z10 LE, Playbook, DevAlpha C, 9900, 9380
My Carrier: Vodafone

Re: How to centalize the container in a page?

Thanks Zmey and mdodd. DockLayout has done the work.