How can I extend a LinkButton to allow HTML text in Flex?

Question

I am feeding the label to my LinkButton directly from a string I receive from a Google API that puts html to format the label.

I want to extend linkbutton to allow this. I wrote a class myself to allow html text for the label and that aspect of it works but now the background that appears when you hover is way too big. I tried to override measure() to fix this but I didn't have a clue how. Here is the class I wrote:

package com.kranichs.components
{
    import mx.controls.LinkButton;

    public class HTMLLinkButton extends LinkButton
    {
     protected var _isHTML:Boolean;

     public function HTMLLinkButton()
     {
      super();
     }

     [Bindable]
     public function set isHTML(value:Boolean):void
     {
      _isHTML = value;
     }
     public function get isHTML():Boolean
     {
      return _isHTML;
     }

     override protected function updateDisplayList(unscaledWidth:Number,
                                                  unscaledHeight:Number):void
        {
            super.updateDisplayList(unscaledWidth, unscaledHeight);
            if(_isHTML)
            {
             textField.htmlText = label;
            }
        }



    }
}

Answer 1

the measure() function is the key.

Assuming you are using a flex compatibility version >= 3.0, the key line is in Button.measure():

var lineMetrics:TextLineMetrics = measureText(label);

You need to change this to something like:

var lineMetrics:TextLineMetrics = _isHTML ? measureHTMLText(label) : measureText(label);

You will probably need to copy the measure function from button into your class and make this change.

If you do that, you will most likley need to import the internal namespace, like this:

import mx.core.mx_internal;

use namespace mx_internal;