TextEvent를 사용해서 htmlText의 링크 클릭이벤트를 처리하기

데이터를 표시 하다보면 어쩔수 없이 버튼등으로 처리 하지 못하고 Text나 Label 등을 사용해서 보여줘야 하는 경우가 생긴다.

Text 데이터를 보여 주면서 외부 링크의 경우 htmlText에 직접 링크를 걸어주면 되지만 플렉스 내부에서 처리 해야 하는 경우에는 좀 곤란해지기도 하는데 이럴때 TextEvent로 htmlText의 링크를 체크 할수 있다.

TextEvent.LINK 와 TextEvent.TEXT_INPUT 두개밖에 없고 매우 간단하다

TextEvent

()

생성자

public function TextEvent(type:String, bubbles:Boolean = false, cancelable:Boolean = false, text:String = "")

언어 버전:

ActionScript 3.0

런타임 버전:

AIR 1.0, Flash Player 9

텍스트 이벤트에 대한 정보가 포함된 Event 객체를 만듭니다. Event 객체는 매개 변수로 이벤트 리스너에 전달됩니다.

매개 변수

	type:String — 이벤트 유형입니다. 이벤트 리스너는 상속된 type 속성을 통해 이 정보에 액세스할 수 있습니다. 사용할 수 있는 값은TextEvent.LINK 및 TextEvent.TEXT_INPUT입니다.
	bubbles:Boolean (default = false) — Event 객체가 이벤트 흐름의 버블링 단계에 참여하는지 여부를 결정합니다. 이벤트 리스너는 상속된 bubbles속성을 통해 이 정보에 액세스할 수 있습니다.
	cancelable:Boolean (default = false) — Event 객체를 취소할 수 있는지 여부를 결정합니다. 이벤트 리스너는 상속된 cancelable 속성을 통해 이 정보에 액세스할 수 있습니다.
	text:String (default = "") — 사용자가 입력한 한 자 이상의 텍스트 문자입니다. 이벤트 리스너는 text 속성을 통해 이 정보에 액세스할 수 있습니다.

예제를 보면 첫번째 Google 링크는 외부 링크로 열리고 네이버 링크는 Flex 내부에서 처리해서 Alert을 띄운다.

[어플리케이션 스크립트소스]

private var text:TextLink;

private function init():void
{
 text = new TextLink();
 
 text.htmlText = "Google = http://google.com
Naver = http://naver.com";
 text.addEventListener(TextEvent.LINK, checkLink);
 addChild(text);
 text.x = 100;
 text.y = 80;
}

private function checkLink(e:TextEvent):void
{
 Alert.show(e.text+" 링크를 클릭했어요");
}

TextLink.as

package
{
 import flash.text.StyleSheet;
 import mx.controls.Text;

 public class TextLink extends Text
 {
  public function TextLink()
  {
   super();
  }
  
  override protected function createChildren():void
  {
   super.createChildren();
   
   var style:StyleSheet = new StyleSheet();
            style.setStyle("a:link", {color:"#0000ff", textDecoration:"underline"});
            style.setStyle("a:hover", {color:"#00ff00", textDecoration:"none"});
            style.setStyle("a:active", {color:"#0000ff", textDecoration:"underline"});
            textField.styleSheet = style;
  }
 }
}

TextLInk.as는 링크 컬러를 설정하기 위해서 Text를 상속받아서 만든 컴포넌트이다. Label, Text, TextArea, TextInput 등등 TextField를 가지고 있는 놈은 어떤것을 상속받더라도 상관없다.