4 Replies Latest reply on Jul 5, 2012 12:13 PM by byoder7

    Label width in an item renderer

    OsmanU

      In the following example, the first label in the item renderer is supposed to truncate long text to fit. However, it is not doing so and is instead pushing the second label outside of the viewing area. Any suggestions on how I can fix this?

       

      <?xml version="1.0" encoding="utf-8"?>
      <s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
                             xmlns:s="library://ns.adobe.com/flex/spark"
                             xmlns:mx="library://ns.adobe.com/flex/mx">
          <fx:Declarations>
              <s:ArrayCollection id="testData">
                  <fx:Object name="Short name" count="0" />
                  <fx:Object name="ReallyLongNameIHopeThisGetsTruncatedLetsSee" count="2" />
              </s:ArrayCollection>
              <!-- Place non-visual elements (e.g., services, value objects) here -->
          </fx:Declarations>
          <mx:List width="150" dataProvider="{testData}">
              <mx:itemRenderer>
                  <fx:Component>
                      <mx:Canvas width="100%" height="25" horizontalScrollPolicy="off">
                          <mx:HBox width="100%" horizontalScrollPolicy="off">
                              <mx:Label text="{data.name}" width="100%" truncateToFit="true"/>
                              <mx:Label text="{data.count}" width="30" textAlign="right" />                   
                          </mx:HBox>
                      </mx:Canvas>
                  </fx:Component>
              </mx:itemRenderer>
          </mx:List>
      </s:WindowedApplication>