RE: [flexcoders] Re: Flex 2.01 - Multiline LinkButton

[Jack @ Zingit]

That works.
 
I greatly appreciate you taking the time.
 
Thanks,
 
Jack

  _____  

From: flexcoders@yahoogroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of valdhor
Sent: Thursday, May 08, 2008 10:11 AM
To: flexcoders@yahoogroups.com
Subject: [flexcoders] Re: Flex 2.01 - Multiline LinkButton



Using ALex Harui's blog post at
http://blogs.adobe.com/aharui/2007/04/multiline_buttons.html I put together
the following in around 30 minutes:

Application:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"; layout="absolute"
    creationComplete="onCreationComplete()">
     <mx:Script>
         <![CDATA[
             import customclasses.MultiLineLinkButton;
             
             private var myMultiLineLinkButton:MultiLineLinkButton = new
MultiLineLinkButton();
             [Bindable] [Embed(source="images/smile.png")] public var
myIcon:Class;
             
             public function onCreationComplete():void
             {
                 myMultiLineLinkButton.label = "My multi line label\nfor a
linkbutton";
                 myMultiLineLinkButton.x = 300;
                 myMultiLineLinkButton.y = 300;
                 myMultiLineLinkButton.width = 300;
                 myMultiLineLinkButton.setStyle("icon", myIcon);
                 myMultiLineLinkButton.labelPlacement = "BOTTOM";
                 this.addChild(myMultiLineLinkButton);
             }
         ]]>
     </mx:Script>
</mx:Application>

customclasses.MultiLineLinkButton:
package customclasses
{
    import flash.text.TextLineMetrics;
    import flash.display.DisplayObject;
    import mx.controls.LinkButton;
    import mx.core.IFlexDisplayObject;
    import mx.core.mx_internal;
    import customclasses.NoTruncationUITextField;
    use namespace mx_internal;

    public class MultiLineLinkButton extends LinkButton
    {
        public function MultiLineLinkButton()
        {
            super();
        }
    
        override protected function createChildren():void
        {
            if (!textField)
            {
                textField = new NoTruncationUITextField();
                textField.styleName = this;
                addChild(DisplayObject(textField));
            }
            super.createChildren();
            textField.wordWrap = true;
            textField.multiline = true;
        }    

        override protected function measure():void
        {
            if (!isNaN(explicitWidth))
            {
                var tempIcon:IFlexDisplayObject = getCurrentIcon();
                var w:Number = explicitWidth;
                if (tempIcon)
                    w -= tempIcon.width + getStyle("horizontalGap") +
getStyle("paddingLeft") + getStyle("paddingRight");
                textField.width = w;
            }
            super.measure();
        
        }
    
        override public function measureText(s:String):TextLineMetrics
        {
            textField.text = s;
            var lineMetrics:TextLineMetrics = textField.getLineMetrics(0);
            lineMetrics.width = textField.textWidth + 4;
            lineMetrics.height = textField.textHeight + 4;
            return lineMetrics;
        }
    }
}

customclasses.NoTruncationUITextField:
package customclasses
{
    import mx.core.UITextField;
    
    public class NoTruncationUITextField extends UITextField
    {
    
        public function NoTruncationUITextField()
        {
            super();
        }
    
        override public function truncateToFit(s:String = null):Boolean
        {
            return false;
        }
    }
}

--- In flexcoders@yahoogroups.com, "Jack @ Zingit" <[EMAIL PROTECTED]> wrote:
>
> 
> I have been searching all day for a multiline LinkButton 
> custom component and can not find one.
> 
> I want the label below the icon and allow for two lines
> of centered text beneath the icon.
> 
> Does anyone know of and/or can you direct me to an
> example?
> 
> I will be most appreciative.
> 
> Thanks,
> 
> Jack
>