Flex 3 and Form container layout issues

Kinda taking off from where I was at in this old post of mine, I’m now having some issues with how Flex does it’s calculations for the vertical scrollbar. Specifically when using a TabNavigator component that has Form components as it’s children. Here’s some of the code:


	
		
			
		
		.
		.
		.
		
			
		
	


The problem is no matter what I tell the TabNavigator to be height wise (either with a height percentage or a constraint based amount) the Form when it has too much content in it will create an application wide vertical scrollbar. I’m trying to make it so that the scrollbar is relative to the actual TabNavigator, so it appears alongside that content. I’ve read through the Adobe documentation about containers and layouts but that didn’t really shed any light on the subject (or my issue at least).

Placing the Form inside a Canvas tag solves the issue, but I’d like to think I can get the Form working as I think it should be.

Has anyone got any pearls of wisdom regarding the issue I’m experiencing?

Be Sociable, Share!
Tagged with: , , , ,
Posted in Flex

6 comments on “Flex 3 and Form container layout issues
  1. I have the same problem with dynamically adding components to a VBox inside a tabNavigator.
    Diving into the source to see what the story is.

  2. Well this property solved my issue: resizeToContent (set to true)

  3. Am I correct in saying that that property is only available for the Accordion component?

  4. Vajahat Ali says:

    Ya it helped me
    Regards,
    Ali Vajahat
    Software Engineer
    Lahore Pakistan

  5. Adam says:

    If you still care, I found the way to fix this is to bind the width/height of the Form (or Grid since it has the same problem) to the width/height of the container.

    I overlooked that option for a whole day before I figured it out.

    So in your case:

    becomes

    Cheers.

  6. Adam says:

    doh….

    mx:Form indicatorGap=”5″ verticalGap=”10″ label=”1. Personal Details”

    becomes

    mx:Form indicatorGap=”5″ verticalGap=”10″ label=”1. Personal Details” width=”{tabbar.width}” height={tabbar.height}

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Posts this month
October 2008
M T W T F S S
« Sep   Nov »
 12345
6789101112
13141516171819
20212223242526
2728293031  
Archives