[Webinar] Streamline your web hosting managementRegister Today

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 265
  • Last Modified:

How can I control the direction of radio buttons in Flex?

I have a Flex app with a bunch of questions and a few radio buttons with multiple choice answers to each question.  Right now, they all display vertically.  I know I can put them in a container like hbox and they'll display horizontally, but I want more control.  An hbox works fine if the choices are true and false, but not so well if there are four choices and they're all heavy on text.  What I'd like to be able to specify is that the layout is horizontal with a maximum of two choices per row.  So, a question with four choices will have two rows of radio buttons.

Ideas?

Jeremy
0
mrcoulson
Asked:
mrcoulson
  • 2
1 Solution
 
vindys80Commented:
I think you can use Grid, GridRow, GridItem for this.

http://www.adobe.com/livedocs/flex/3/langref/mx/containers/Grid.html#includeExamplesSummary
<?xml version="1.0"?>
<!-- Simple example to demonstrate the Grid layout container.-->
<mx:Application borderStyle="none" xmlns:mx="http://www.adobe.com/2006/mxml">
    
    <mx:Panel title="Grid Container Example" height="75%" width="75%" 
        paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10">

        <mx:Label width="100%" color="blue" 
            text="A 3 by 3 Grid container of Button controls."/>

        <mx:Grid>
            <mx:GridRow>
                <mx:GridItem>
                    <mx:RadioButton label="my first radio"/>
                </mx:GridItem>
                <mx:GridItem>
                    <mx:RadioButton label="my second radio"/>
                </mx:GridItem>
            </mx:GridRow>

            <mx:GridRow>
                <mx:GridItem>
                    <mx:RadioButton label="my first radio in second row"/>
                </mx:GridItem>
                <mx:GridItem>
                    <mx:RadioButton label="my first radio in second row"/>
                </mx:GridItem>
              </mx:GridRow>
         </mx:Grid>

    </mx:Panel>        
</mx:Application>

Open in new window

0
 
mrcoulsonAuthor Commented:
Bingo!

Jeremy
0
 
mrcoulsonAuthor Commented:
Thanks!

Jeremy
0

Featured Post

Get your problem seen by more experts

Be seen. Boost your question’s priority for more expert views and faster solutions

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now