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

Adobe AIR Development


Thank you for visiting the BlackBerry Support Community Forums.

BlackBerry will be closing the BlackBerry Support Community Forums Device Forums on April 1st (Developers, see below)

BlackBerry remains committed to providing excellent customer support to our customers. We are delighted to direct you to the CrackBerry Forums, a well-established and thorough support channel, for continued BlackBerry support. Please visit http://forums.crackberry.com or http://crackberry.com/ask. You can also continue to visit BlackBerry Support or the BlackBerry Knowledge Base for official support options available for your BlackBerry Smartphone.

"When we launched CrackBerry.com 10 years ago, we set out to make it a fun and useful destination where BlackBerry Smartphone owners could share their excitement and learn to unleash the full potential of their BlackBerry. A decade later, the CrackBerry community is as active and passionate as ever and I know our knowledgeable members and volunteers will be excited to welcome and assist more BlackBerry owners with their questions."

- Kevin Michaluk, Founder, CrackBerry.com

Developers, for more information about the BlackBerry Developer Community please review Join the Conversation on the BlackBerry Developer Community Forums found on Inside BlackBerry.


Reply
Developer
Posts: 2,462
Registered: ‎11-04-2010
My Device: Bold 9700

Re: Containers and complex GUI layout

 


jtegen wrote:

Why this could'nt just be an Array with type checking internal to the class is beyond me.


cuz it'd be far too simple.

 

J. Rab (Blog) (Twitter)
--
1. If you liked my post or found it useful please click on the thumbs up and provide a Like!
2. If my post solved your problem please click on the Accept as Solution button. Much appreciated!

Approved Apps: OnTrack | ssShots | Hangman
New Contributor
Posts: 9
Registered: ‎11-10-2010
My Device: Not Specified

Re: Containers and complex GUI layout

Ok another situation, which i can't resolve at all.

 

I am trying to make a form for searching airline travel. It has a bunch of fields. I tried making one search container, and adding a container for the fields and one for the text boxes, another for the options, etc.

 

I had to do this, because i can't see to make them roll down to the next line of the same one, like a word wrap.

 

The main search panel is added to the one that is used by the entire application

 

The only problem is it puts a 500 pixel seperation between the two component containers. How do you nest multiple and have them right below eachother? or is there a way to wrap them in one that is set to horizontal...

 

Here is the code...

 

 

///////containers////////////////////////
	var searchContainer:Container = new Container();
			searchContainer.padding = 10;
			searchContainer.containment = Containment.BACKGROUND;
			searchContainer.align = ContainerAlign.MID;
			searchContainer.setSize(1024,10);
			
			var searchForm:Container = new Container();
			searchForm.padding=10;
			searchForm.flow = ContainerFlow.HORIZONTAL;
			searchForm.containment = Containment.CONTAINED;
			searchForm.align = ContainerAlign.MID;
			searchForm.setSize(1024,10);
			
			var searchTextfields:Container = new Container();
			searchTextfields.padding=10;
			searchTextfields.flow = ContainerFlow.HORIZONTAL;
			searchTextfields.containment = Containment.CONTAINED;
			searchTextfields.align = ContainerAlign.MID;
			searchTextfields.setSize(1024,10);

 

////////Adding Controls////////////////////
			searchContainer.addChild(searchForm);
			searchForm.layout();
			searchContainer.addChild(searchTextfields);
			searchTextfields.layout()
			searchContainer.layout();
			container.addChild(searchContainer);
			container.layout();

 And finally for the container in the main application...

 

private function initializeContainer():void{
			container.setSize(1024,600);
			container.padding = 10;
			container.align = ContainerAlign.NEAR;
			curStage.addChild(container);
		}

 

Any ideas or does anyone have expeience with doing this?

 

 

 

More videos and my experiences with Playbook here: http://playbook.kraftworkgames.com/
New Contributor
Posts: 9
Registered: ‎11-10-2010
My Device: Not Specified

Re: Containers and complex GUI layout

And now for the exciting conclusion to nesting complex containers together...

 

Here's how to do it.

 

 

var searchContainer:Container = new Container(100,"percent");
			//searchContainer.setSize(1024,100);
			searchContainer.flow = ContainerFlow.VERTICAL;
			searchContainer.align = ContainerAlign.MID;
			searchContainer.padding = 0;
			searchContainer.containment = Containment.BACKGROUND;
			searchContainer.sizeMode = SizeMode.FLOW;
			//searchContainer.sizeUnit = SizeUnit.PIXELS;
			searchContainer.margins = v_sc;
			searchContainer.layout();
			
			var labelContainer:Container = new Container(10);
			//labelContainer.setSize(1024,100);
			labelContainer.flow = ContainerFlow.HORIZONTAL;
			labelContainer.align = ContainerAlign.MID;
			labelContainer.padding = 4;
			labelContainer.margins = v_sc;
			labelContainer.layout();
			
			var NewContainer:Container = new Container(10);
			//labelContainer.setSize(1024,100);
			NewContainer.flow = ContainerFlow.HORIZONTAL;
			NewContainer.align = ContainerAlign.MID;
			NewContainer.padding = 4;
			NewContainer.margins = v_sc;
			NewContainer.layout();

 

setting that constructor to 10 tells it 10% and the default is 100%. The 100% creates the gap.

 

 

More videos and my experiences with Playbook here: http://playbook.kraftworkgames.com/
New Contributor
Posts: 9
Registered: ‎11-10-2010
My Device: Not Specified

Re: Containers and complex GUI layout

[ Edited ]

Full explaination of the code will be available in the link in my signature.

 

here is the image it created

 

search_form.png

More videos and my experiences with Playbook here: http://playbook.kraftworkgames.com/
Highlighted
Developer
Posts: 265
Registered: ‎01-02-2011
My Device: Z30, PlayBook
My Carrier: AT&T

Re: Containers and complex GUI layout

The API has a good example of how to add nested containers.

 

http://www.blackberry.com/developers/docs/airapi/1.0.0/qnx/ui/core/Container.html

 

It also points out the debugging color, so you can see your container frames.

 

I think an important step is how you create and add items.

  1. Create Main Container and sub containers
  2. Add Main Container
  3. Create items for sub containers
  4. Add items to sub containers
  5. Add sub containers to Main Container
  6. Set size of Main Container
_________________
Meetup for BlackBerry 10
Meetup Search Tool - not available at the moment