Flex 3: How can I change a PopupButton into a regular Button when there's only one menu item available?

Question

Hi there.

I have a PopUpButton that only contains 2 actions. Both actions are complete opposites of each other and switches a boolean property on an object from true to false or false to true. To avoid redundancy, I've only displaying one action at a time. So, if the property is true, the action to change it to true is not shown.

If my PopUp menu has a single option, I would like to remove the menu from being shown and basically revert the PopUpButton to act and look like a regular button. So far, I haven't really found a good way to do that in ActionScript without adding, removing or modifying styles for the button.

Is there a nice way to simply tell the button to hide the PopUp toggle?

PS: In my specific example, YES it might be easier if I just used a toggle button. However, I want to reuse this button when dealing with an Array of objects. If I have more than one, the property could be true and false at the same time. In that case, I want to show the menu so they can choose what option to set all the object's properties to.

Answer 1

You could try using a State for this. It would remove the multi-option pop-up button and show a new single-option button in its place:

<mx:states>
  <mx:State name="singleOptionState">
    <mx:AddChild relativeTo="{multiOptionPopUpButton}" position="after">
      <mx:Button id="singleOptionButton" 
        width="80" 
        label="{buttonLabel}" 
        click="onClick(event)" />
    </mx:AddChild>
    <mx:RemoveChild target="{multiOptionPopUpButton}" />
  </mx:State>
</mx:states>

The names and attributes would be specific to your app, of course.

When you determine that it's time to show the single-option button just do

currentState = "singleOptionState";

When it's time to show the multi-option pop-up button, just do:

currentState = "";

Hope this helps.