Flex button or any control with two labels

How can I have two labels on a Flex button, one label on t开发者_StackOverflow中文版op and another on the bottom?

With a Spark architecture button, you should just be able to create a custom button skin.

If you're using the Halo/MX architecture, then you'll have to extend the component. IF you google for multilabel button, a bunch of solutions come up.

You can make custom skin for your button. In that skin's Label, set the maxDisplayedLines attribute to as many lines as you need.

<mx:VBox verticalGap="0"  x="60" y="107">
    <mx:Canvas cornerRadius="5" backgroundColor="0xff0000" backgroundAlpha=".5" borderStyle="solid">
        <mx:Label text="Step 1" fontSize="20" fontStyle="italic" fontWeight="bold" width="171" />
    </mx:Canvas>
    <mx:Canvas cornerRadius="5" backgroundColor="0xff0000" backgroundAlpha=".5" borderStyle="solid">
        <mx:Label text="Initial Request" fontSize="20" fontStyle="italic" fontWeight="bold" width="100%" />
    </mx:Canvas>
</mx:VBox>

This is not the correct solution, but you can make a Canvas feel like button if you want. Flexlib has a component where they provide solution for Multiline Label.