2007年11月30日 星期五

Flex Label, TextField 半透明小技巧

Ticore's Blog

在 Flex 內,預設是沒有嵌入字體的
所以假如想要對組件設定 alpha 半透明
就會發現到組件內 Label, TextField 無法表現半透明效果
如下所示:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
 layout="horizontal" verticalAlign="middle">
 <mx:Fade id="fadeOut" duration="500" alphaFrom="1" alphaTo="0.2" />
 <mx:Fade id="fadeIn" duration="500" alphaFrom="0.2" alphaTo="1" />
 <mx:Button label="Tween Alpha Button" alpha="0.2"
  rollOverEffect="{fadeIn}" rollOutEffect="{fadeOut}" />
</mx:Application>

這時候只要利用 AS3 DisplayObject 的混合模式
將 BlendMode 設為 "layer" 就可以對 Label, TextField 作 alpha 效果了

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
 layout="horizontal" verticalAlign="middle">
 <mx:Fade id="fadeOut" duration="500" alphaFrom="1" alphaTo="0.2" />
 <mx:Fade id="fadeIn" duration="500" alphaFrom="0.2" alphaTo="1" />
 <mx:Button label="Tween Alpha Button" alpha="0.2"
  blendMode="{flash.display.BlendMode.LAYER}"
  rollOverEffect="{fadeIn}" rollOutEffect="{fadeOut}" />
</mx:Application>

相關連結:
Flash 8 半透明輸入、動態文字欄位
Flex TextField Render Bug

轉載請註明出處 http://ticore.blogspot.com/2007/11/flex-label-alpha-tip.html

0 意見 :