?
Solved

How do I control multiple States in Flex 3?

Posted on 2010-01-12
9
Medium Priority
?
699 Views
Last Modified: 2013-11-11
Hello,

Right now I have 3 states for a certain container and I would like each state to be added depending on whether a radio button was selected or not (the radio buttons are in three separate radio groups, so in other words, each section is independent).

I used to have it where if one state is added and if another gets selected, the first state goes away.  That's not what I wanted.  So, I added on the attribute "baseOn", but the problem with that is if a second state is selected based on a radio button selection, then the first state shows up as well...


Thank you very much in advance!!!!!!!!!!!

<mx:State name="added_state1" >

    	<mx:AddChild relativeTo="{speed}" position="after" creationPolicy="all">
    	<mx:FormItem label="Deliver to what Address:">
		            <mx:ComboBox id="DELPrimSec" width="200">
		              <mx:ArrayCollection>
		                 <mx:String>Primary</mx:String>
		                 <mx:String>Secondary</mx:String>
		              </mx:ArrayCollection>                     
		            </mx:ComboBox>
		        </mx:FormItem>
		        </mx:AddChild>
    	</mx:State>

<mx:State name="added_state2"  basedOn="added_state1">
    	
    	<mx:AddChild relativeTo="{selectCheese}" position="after" creationPolicy="all">
    			<mx:FormItem label="Select a Cheese:">
		            <mx:ComboBox prompt="Please Select"  dataProvider="{recievedData5}" labelField="{comboDisplay2}" id="DesCheese" width="200"/>
		        </mx:FormItem>
    		</mx:AddChild>

    	</mx:State>


...

<mx:FormItem label="Speed:" direction="vertical" id="speed" fontWeight="bold">
		            <mx:RadioButtonGroup id="radiogroup1"/>
		         <!--there are other buttons in here but this is the only one that triggers something-->
		            <mx:RadioButton label="I would like to request the delivery location" groupName="radiogroup1" click="currentState='added_state1'" value="I would like to request the date/time"/>
		            
		        </mx:FormItem>


</mx:FormItem>
		          <mx:FormItem label="Cheese:" direction="vertical" id="selectCheese" fontWeight="bold">
		            <mx:RadioButtonGroup id="radiogroup2"/>
		     <!--there are other buttons in here but this is the only one that triggers something, and no, selecting the type of cheese is not the real question hahaha-->
		            <mx:RadioButton label="I want to pick the Cheese" groupName="radiogroup2" click="currentState='added_state2'" value="I want to pick the Cheese"/>
		        </mx:FormItem>

Open in new window

0
Comment
Question by:stracqan
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 2
  • 2
9 Comments
 
LVL 11

Expert Comment

by:vindys80
ID: 26300512
Hi,

I think you just need visibility of the components according to radio button status. Then do you really need to use states? You can achieve the same with visible = true/false right?

Thanks,
Vindys
0
 
LVL 37

Expert Comment

by:zzynx
ID: 26302893
>> I would like each state to be added depending on whether a radio button was selected or not
>> (the radio buttons are in three separate radio groups, so in other words, each section is independent)
Given the above, why do you use radio buttons and not check boxes?
0
 
LVL 37

Expert Comment

by:zzynx
ID: 26302985
>> why do you use radio buttons and not check boxes?
Forget it. I think I see why.

I'm afraid you'll need to define your states in such a way that they take into acount what the previous states could have been.
eg. "added_state2" also needs - besides adding its own controls - to remove "added_state1" if present.
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:stracqan
ID: 26304929
vindys80, thank you for your comment.  I cannot use the Visible = true/false and then use actionscript to turn it on or off because when the content is not visible it leaves a gap between the form elements that I do not wish to have.  Thank you for your suggestion though!!!!!

zzynx, I would like to thank you too for your comments.  In regards to your first question, I'm using radio buttons because I do not want users to be able to select more than one check box at a time.  As far as I know, I couldn't pull that off with just check boxes (I could be wrong though..).

In regards to your second comment, how do I define/add the logic to take into account if another state was there or not?
0
 
LVL 37

Expert Comment

by:zzynx
ID: 26305219
>> how do I define/add the logic to take into account if another state was there or not?
You probably can't do that in pure MXML.
But I think you can in action script.
There you could look for certain variables that are set (by the code of another state) or not and depending on that remove certain controls (added by another state)
0
 
LVL 11

Accepted Solution

by:
vindys80 earned 1000 total points
ID: 26310618
Hi,

You can avoid gap by making height as 0 when its not visible and height defined when its visible.

Thanks,
Vindys
0
 
LVL 37

Assisted Solution

by:zzynx
zzynx earned 1000 total points
ID: 26311800
Or you can set the properties includeInLayout and visible to false to hide a component and set them to true if you want it to be visible.
Something like this:

I suppose you initially "add" all different states once. Then you can write:
<mx:State name="added_state1" >
        <mx:AddChild relativeTo="{speed}" position="after" creationPolicy="all">
            <mx:FormItem id="fi1" label="Deliver to what Address:">
             ...
        </mx:AddChild>
</mx:State>

<mx:State name="added_state2"  basedOn="added_state1">
        <mx:AddChild relativeTo="{selectCheese}" position="after" creationPolicy="all">
               <mx:FormItem id="fi2" label="Select a Cheese:">
                            <mx:ComboBox prompt="Please Select"  dataProvider="{recievedData5}" labelField="{comboDisplay2}" id="DesCheese" width="200"/>
               </mx:FormItem>
        </mx:AddChild>
</mx:State>

...
<mx:RadioButton label="I would like to request the delivery location" groupName="radiogroup1" click="switchToState1()" value="I would like to request the date/time"/>
...
<mx:RadioButton label="I want to pick the Cheese" groupName="radiogroup2" click="switchToState2()" value="I want to pick the Cheese"/>
...

<mx:Script>
    <![CDATA[
          private function switchToState1():void {
                fi1.visible = true;
                fi1.includeInLayout = true;
                fi2.visible = false;
                fi2.includeInLayout = false;
          }

          private function switchToState2():void {
                fi1.visible = false;
                fi1.includeInLayout = false;
                fi2.visible = true;
                fi2.includeInLayout = true;
          }
       
	]]>
</mx:Script>

Open in new window

0
 

Author Closing Comment

by:stracqan
ID: 31676198
I would like to thank you both for your great suggestions!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

In the end I ended up using a hybrid of what you guys gave me.  I used the actionscript from zzynx and the visibility idea from vindys80.

Thank you very very much!!!!!!!!!!
0
 
LVL 37

Expert Comment

by:zzynx
ID: 26321253
Thanx 4 axxepting
0

Featured Post

On Demand Webinar: Networking for the Cloud Era

Ready to improve network connectivity? Watch this webinar to learn how SD-WANs and a one-click instant connect tool can boost provisions, deployment, and management of your cloud connection.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I come across a lot of question about how to access things in the document class from a movieclip, or accessing something from a movieclip in the document class. It took me a while to figure this out but once I did it makes life so much easier. …
I have found that much of my time doing support ends up being a constant repetition of the same steps to different people.  Early on I stated using web pages with Frequently Asked Questions (FAQs) to alleviate most of the burden.  Sometimes this jus…
The goal of the tutorial is to teach the user how to how to record live broadcast.
The goal of the tutorial is to teach the user how to set there setting in Adobe Flash Media Live Encoder and YouTube for optimal video and audio quality.
Suggested Courses

752 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question