Hi flexcoders. This is my first post, so hello! I'm relatively new
to Flex, and I am using Flex Builder 3.
I'm trying to lay out some text with Label controls, and this issue is
confusing me. Basically, I want to display a string such as "The
first number is 42 and the second number is 99." The numbers
themselves vary and areto be conditionally styled. In fact, the
values are to be controlled by two sliders, and I want an effect such
that when the slider is dragged, the numbers change colour until the
slider is released.
I had originally laid out the text using a single mx:Label control and
setting htmlText within the string to:
<mx:Label htmlText="The first number is {firstNumber} and the second
number is {secondNumber}."/>
However, I'd like more control over the styling of those bound
numbers, individually. So, I am attempting to factor the string into
multiple Label controls (as in the snippet below.)
However, I can't seem to get the space between the last number and the
period to disappear. I thought by setting the HBox horizontalGap to
zero and each Label's paddingLeft and paddingRight to zero that there
should be no such space, but that's not the case. I imagine I am
misunderstanding how the label widths are calculated and being
rendered, and overlooking something obvious.
So, is there a way to make the adjacent mx:Labels render similar to
the single mx:Label above? Or, is there a better way to accomplish
what I want as I described above? Thank you.
--- 8< code follows 8< ---
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"; layout="absolute">
<mx:Script>
<![CDATA[
[Bindable]
public var firstNumber:int = 42;
[Bindable]
public var secondNumber:int = 99;
]]>
</mx:Script>
<mx:HBox horizontalGap="0">
<mx:Label text="The first number is" paddingRight="0" />
<mx:Label text="{firstNumber}" paddingLeft="0" paddingRight="0" />
<mx:Label text="and the second number is " paddingLeft="0"
paddingRight="0" />
<mx:Label text="{secondNumber}" paddingLeft="0" paddingRight="0" />
<mx:Label text="." paddingLeft="0" />
</mx:HBox>
</mx:Application>
--- 8< end code 8< ---
Regards,
Chris W. Rea
[EMAIL PROTECTED]
