Adobe Flex - any way to automatically change font size to fit in its container?

Question

I have a component in Flex, and part of that component is a label. Is there a way to automatically adjust the font size to fit into its container?

Answer 1

Not automatically (at least not that I know of), without setting up some sort of event handler, and taking action on the occurrence of some event. Here's a simple AIR app that demonstrates one approach -- in this case, a resize event triggering a change in the fontSize of a Label:

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="this_creationComplete()">

    <mx:Script>
     <![CDATA[

      import mx.binding.utils.BindingUtils;
      import mx.binding.utils.ChangeWatcher;

      [Bindable]
      public var myValue:int = 0;

      private function this_creationComplete():void
      {
       setSize();

       addEventListener(Event.RESIZE, handleResize);
      }

      private function handleResize(event:Event):void
      {
       setSize();
      }

      private function setSize():void
      {
       lbl.setStyle("fontSize", this.height / 2);
      }

     ]]>
    </mx:Script>

    <mx:Label id="lbl" text="Hello, world!" />

</mx:WindowedApplication>

Here, when the app gets resized, the label's fontStyle property gets changed to one-half the app's height; scale it up and down and you'll see how it works. There are certainly other approaches, as always, but because we're dealing with styles and not bindable properties, a little custom coding is most likely called for. Hope it helps!