TextFieldにスタイルシートを適用させてみよう
先日KnuckleがTextFieldのHTMLテキストのリンクイベントをとるというのを書いていたので、 のかってTextFieldのhtmlTextについてちょっと書いてみます。
TextFieldにはstyleSheetプロパティというのがあって、StyleSheetクラスでスタイルを設定できます。
たとえば リンク部分に色を設定して、マウスオーバーされたときだけ下線が表示されるようにするには..
var style1:StyleSheet = new StyleSheet(); style1.setStyle("a", {color:"#0000ff", textDecoration:"none"}); style1.parseCSS('a:hover{text-decoration:underline;}'); var style2:StyleSheet = new StyleSheet(); style2.setStyle("a", {color:"#ff0000", textDecoration:"none"}); style2.parseCSS('a:hover{text-decoration:underline;}'); var tf:TextField = new TextField(); tf.autoSize = TextFieldAutoSize.LEFT; tf.addEventListener(TextEvent.LINK, handleTextLink); tf.styleSheet = style1; tf.htmlText = 'リンクです'; var b:Boolean = true; function handleTextLink(e:TextEvent):void { b = !b; tf.styleSheet = null; var nextStyle:StyleSheet = (b) ? style1 : style2; tf.styleSheet = nextStyle; }
結果は次のようになります。