11.5.对指定组件应用局部Transition
11.5.1. 问题
我想应用一部分Transition, Sequence, 或Parallel 对象到某个子组件上。
11.5.2. 解决办法
在过滤函数基础上为每个特效过滤目标直到返回期望的所有子组件数据。
11.5.3. 讨论
正如第11.4节提及的那样EffectTargetFilter 对象过滤只能应用整个sequence 或整个Parallel组合特效。要想为每个特效过滤目标，你必须编写自定义函数返回每个特效的targets 属性数组。因为特效都有自己的targets 而不依赖与Transition 的targets，过滤函数必须遍历组件内的所有子组件， 这需要付出昂贵的代码，有时候好的办法是把被应用的子组件添加到独立的数组中。
这个例子中的过滤函数循环遍历所有子组件，根据传入方法的参数返回组件中包含的所有HBox 或Canvas 对象数组：
下面的代码将调用这个方法：
每次特效被调用，数组都会被重建，这意味着基于组件的currentState 状态单个特效可应用到不同类型的子组件，这让你创建单个特效却可以以不同的方式使用它，根据过滤函数返回特效所需的所有目标，完整代码如下：
我想应用一部分Transition, Sequence, 或Parallel 对象到某个子组件上。
11.5.2. 解决办法
在过滤函数基础上为每个特效过滤目标直到返回期望的所有子组件数据。
11.5.3. 讨论
正如第11.4节提及的那样EffectTargetFilter 对象过滤只能应用整个sequence 或整个Parallel组合特效。要想为每个特效过滤目标，你必须编写自定义函数返回每个特效的targets 属性数组。因为特效都有自己的targets 而不依赖与Transition 的targets，过滤函数必须遍历组件内的所有子组件， 这需要付出昂贵的代码，有时候好的办法是把被应用的子组件添加到独立的数组中。
这个例子中的过滤函数循环遍历所有子组件，根据传入方法的参数返回组件中包含的所有HBox 或Canvas 对象数组：
+展开
-ActionScript
private function returnArray(state:*):Array
{
var arr:Array = new Array();
var i:int;
if(state == "foo") {
for(i = 0; i<this.numChildren; i++) {
if(getChildAt(i) is HBox) {
arr.push(getChildAt(i));
}
}
} else {
for(i = 0; i<this.numChildren; i++) {
if(getChildAt(i) is Canvas) {
arr.push(getChildAt(i));
}
}
}
return arr;
}
{
var arr:Array = new Array();
var i:int;
if(state == "foo") {
for(i = 0; i<this.numChildren; i++) {
if(getChildAt(i) is HBox) {
arr.push(getChildAt(i));
}
}
} else {
for(i = 0; i<this.numChildren; i++) {
if(getChildAt(i) is Canvas) {
arr.push(getChildAt(i));
}
}
}
return arr;
}
下面的代码将调用这个方法：
+展开
-XML
<mx:states>
<mx:State name="closeState"/>
<mx:State name="openState"/>
</mx:states>
<mx:State name="closeState"/>
<mx:State name="openState"/>
</mx:states>
每次特效被调用，数组都会被重建，这意味着基于组件的currentState 状态单个特效可应用到不同类型的子组件，这让你创建单个特效却可以以不同的方式使用它，根据过滤函数返回特效所需的所有目标，完整代码如下：
+展开
-XML
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" width="400"
height="300">
<mx:Script>
<![CDATA[
import mx.core.UIComponent;
[Bindable]
private function returnArray(state:*):Array
{
var arr:Array = new Array();
var i:int;
if(state == "foo") {
for(i = 0; i<this.numChildren; i++) {
if(getChildAt(i) is HBox) {
arr.push(getChildAt(i));
}
}
} else {
for(i = 0; i<this.numChildren; i++) {
if(getChildAt(i) is Canvas) {
arr.push(getChildAt(i));
}
}
}
return arr;
}
]]>
</mx:Script>
<mx:transitions>
<mx:Transition toState="closeState"
fromState="openState">
<mx:Sequence>
<mx:Move xTo="200" xFrom="0"
targets="{returnArray('foo')}"/>
<mx:Glow color="0xffff00" blurXTo="20"
blurYTo="20" targets="{returnArray('bar')}"/>
</mx:Sequence>
</mx:Transition>
</mx:transitions>
<mx:states>
<mx:State name="closeState"/>
<mx:State name="openState"/>
</mx:states>
<mx:HBox id="one">
<mx:Text text="one"/>
<mx:Text text="two"/>
</mx:HBox>
<mx:HBox id="two">
<mx:Text text="one"/>
<mx:Text text="two"/>
</mx:HBox>
<mx:Canvas id="three">
<mx:Text text="one"/>
<mx:Text text="two" y="10"/>
</mx:Canvas>
<mx:Canvas id="four">
<mx:Text text="three"/>
<mx:Text text="four" x="10" y="10"/>
</mx:Canvas>
<mx:Button click="(currentState == 'openState') ?
currentState='closeState': currentState='openState'"/>
</mx:VBox>
height="300">
<mx:Script>
<![CDATA[
import mx.core.UIComponent;
[Bindable]
private function returnArray(state:*):Array
{
var arr:Array = new Array();
var i:int;
if(state == "foo") {
for(i = 0; i<this.numChildren; i++) {
if(getChildAt(i) is HBox) {
arr.push(getChildAt(i));
}
}
} else {
for(i = 0; i<this.numChildren; i++) {
if(getChildAt(i) is Canvas) {
arr.push(getChildAt(i));
}
}
}
return arr;
}
]]>
</mx:Script>
<mx:transitions>
<mx:Transition toState="closeState"
fromState="openState">
<mx:Sequence>
<mx:Move xTo="200" xFrom="0"
targets="{returnArray('foo')}"/>
<mx:Glow color="0xffff00" blurXTo="20"
blurYTo="20" targets="{returnArray('bar')}"/>
</mx:Sequence>
</mx:Transition>
</mx:transitions>
<mx:states>
<mx:State name="closeState"/>
<mx:State name="openState"/>
</mx:states>
<mx:HBox id="one">
<mx:Text text="one"/>
<mx:Text text="two"/>
</mx:HBox>
<mx:HBox id="two">
<mx:Text text="one"/>
<mx:Text text="two"/>
</mx:HBox>
<mx:Canvas id="three">
<mx:Text text="one"/>
<mx:Text text="two" y="10"/>
</mx:Canvas>
<mx:Canvas id="four">
<mx:Text text="three"/>
<mx:Text text="four" x="10" y="10"/>
</mx:Canvas>
<mx:Button click="(currentState == 'openState') ?
currentState='closeState': currentState='openState'"/>
</mx:VBox>
加支付宝好友偷能量挖...
