Anistar RIA Blog

突然興起來寫一下Flex中viewStates的動畫處理方式，有上過Flex課程的同學都知道若是想在Flex中切換viewStates，我們可以加上<mx:transitions>標籤來描述動畫效果，不過到底裡面的filter屬性在幹嘛？這可能就是大家的疑問，可以說是一個很容易讓大家誤解的屬性，而這篇就專門在解釋transtions effect中的filter屬性使用方法。

filter屬性第一次看到的時候會很容易聯想到濾鏡效果，我第一次看也誤以為是這樣，結果看完help後，就發現這可是個天大的誤會啊，transitions effect中的filter和DisplayObject的filters是不一樣的，正確的來說應該說是完全沒有關係，好啦，以後在transition effct中看到filter就別在往濾鏡這個方向去想了。

話句話說，filter在transition effect這邊指的不是濾鏡，反而是過濾的意思，也就是他會負責過濾tigger，只要被指定的元件(components)發出的trigger符合filter所標示的對象，就會套用該效果(effect)，這邊我們做一個基礎的示範，若是我想要在兩個viewStates中產生動畫效果，如下方式示範，當"click me"按紐被按下時，panel1會移致左方，而panel2會移至右方並將visible屬性設為false(隱藏)，那當套用玩下方的mxml transitions語法後就會如展示的效果一樣，自動的比對tirgger來觸發effect。

 <mx:transitions>
  <mx:Transition>
   <mx:Parallel targets="{[panel1,panel2]}">
    <mx:Sequence filter="hide">
     <mx:Fade alphaTo="0"/>
     <mx:SetPropertyAction name="visible" value="false"/>
    </mx:Sequence>
    <mx:Move filter="move"/>
    <mx:Sequence filter="show">
     <mx:SetPropertyAction name="visible" value="true"/>
     <mx:Fade alphaTo="1"/>
    </mx:Sequence>
   </mx:Parallel>
  </mx:Transition>
 </mx:transitions>


好啦，問題來了，如果我不用filter屬性到底能不能完成這個任務？答案是肯定的，只要你有耐心，一定是可以完成的，所以filter不算是一個必學的項目，但是如果你想要讓transitions的標籤看起來更加精簡，或是在一個Transition標籤中就能一次處理多個狀態，那麼filter就值得拿出來探討一下。

後記：最近事情實在太忙了，又剛好碰上手骨折，一堆消息被我壓著沒發佈出來，看來我必須要趕在過年前好好的出清一下庫存才行，先在這邊預告一下:

1. ezAlbum上個月就已經完成了，該來發佈出來給大家享用一下。
2. 我寫的ActionScript 3.0書已經於上個月邁入第2刷，下次來讓大家看看第2刷刷出來的樣子。
3. silverlight 1.0 RC的教學已經壓了半年有了，慢慢放出來吧。
4. 捷克旅遊的內容好像也欠了4個多月了，沒辦法太忙啦，也來慢慢的寫遊記。

糟糕，怎麼覺得自己欠了一屁股債啊。 Orz