htmlText のハイパーテキストリンクで TextEvent.LINK イベントを発火

TextField や Text, Lable には htmlText というフィールドが存在する。これはその名の通り、そこに HTML のテキストを突っ込んで上げると、単純なテキスト表示でなくマークアップされたテキストを表示してくれる、というもの。下記の例みたいに a href を指定してあげれば、ブラウザのリンクっぽい動作が実現できる。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" applicationComplete="init()">
    <mx:Script>
        <![CDATA[
            private function init():void {
                var textField:TextField = new TextField();
                textField.htmlText = "<a href='http://www.google.co.jp'>google</a>";
                this.stage.addChild(textField);
            }
        ]]>
    </mx:Script>
</mx:Application>

navigateToURL とほぼ同じ動作ですかね？

次に、TextEvent.LINK というイベントが存在する。こいつは htmlText 内のリンクがクリックされたときに送出されるもの。ただし、URL は Flex 独自のお作法に沿う必要があって、"event:" で始めないといけない。使い方の例はこんな感じ。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" applicationComplete="init()">
    <mx:Script>
        <![CDATA[
            import mx.controls.Alert;
            private function init():void {
                var textField:TextField = new TextField();
                textField.htmlText = "<a href='event:hogePiyo'>hoge</a><a href='event:hogeFuga'>fuga</a>";
                textField.addEventListener(TextEvent.LINK, linkHandler);
                this.stage.addChild(textField);
            }

            private function linkHandler(event:TextEvent):void {
                Alert.show(event.text);
            }
        ]]>
    </mx:Script>
</mx:Application>

実行して TextField の hoge をクリックすると hogehogePiyoPiyo と表示、fuga をクリックすると hogeFuga と表示される。TextEvent#text に "event:" の後ろ側に書いた文字列が渡ってきてます。リンクのイベント取りたい場合はこんな感じに使うと。

最後に TextEvent.LINK でハマッた箇所について。Lable やそのサブクラスの Text にも htmlText プロパティが存在して、TextEvent.LINK を取れる。ただし、TextEvent.LINK を拾うには selectable プロパティを true にする必要がある。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" applicationComplete="init()">
    <mx:Script>
        <![CDATA[
            import flash.net.navigateToURL;
            import mx.controls.Alert;
            private function init():void {
                hogeLabel.htmlText = "<a href='event:hogePiyo'>hoge</a><a href='event:hogeFuga'>fuga</a>";
            }

            private function linkHandler(event:TextEvent):void {
                Alert.show(event.text);
            }
        ]]>
    </mx:Script>
    <mx:Label id="hogeLabel" link="linkHandler(event)" selectable="true"/>
</mx:Application>