Effect help - no states being used

[RR_QQ]

OK I am wondering if this is possible at all. Below are two mxml components, a Canvas with a LinkButton visible=true and an HBox with visible=false that contains various other components.


<mx:Canvas x="0" y="2" width="469" height="22"
id="filterHideCanvas"
visible="true">
<mx:LinkButton id="showFilterForm" label="Filter Results"/>
</mx:Canvas>
<mx:HBox x="0" y="2" width="469" height="22"
id="searchFilterHBox"
horizontalScrollPolicy="off"
visible="false">
<mx:ComboBox id="searchFields" width="112" height="22"></mx:ComboBox>
<mx:ComboBox id="searchOperators" width="77" height="22">
<mx:ArrayCollection>
<mx:Object data="" label=""/>
<mx:Object data="equals" label="equals"/>
<mx:Object data="begins" label="begins with"/>
<mx:Object data="ends" label="ends with"/>
<mx:Object data="within" label="contains"/>
</mx:ArrayCollection>
</mx:ComboBox>
<mx:TextInput width="88" height="22" fontSize="9" id="searchString"/>
<mx:Button label="GO" id="filterSearchButton" height="22" width="21" fontSize="9" paddingBottom="0" paddingLeft="0" paddingRight="0" paddingTop="0" click="onFilterSearchClick();"/>
<mx:LinkButton label="Show All Records" id="showAllButton" visible="false" click="onShowAllButtonClick();" width="136" color="#02BF0B"/>
</mx:HBox>


What I am trying to do is when the user clicks on the Canvas LinkButton id="showFilterForm" there is some effect that makes this LinkButton animate to the right and disappear in a slow manner and then the HBox becomes visible=true.

Is this possible even though I am not using states?? Any help is appreciated!

[RR_QQ]

Well this did not work:


<mx:Canvas x="0" y="2" width="469" height="22"
id="filterHideCanvas"
visible="false">
<mx:LinkButton id="showFilterForm" label="Filter Results" click="displayFilterForm();"/>
</mx:Canvas>
<mx:HBox x="0" y="2" width="469" height="22"
id="searchFilterHBox"
horizontalScrollPolicy="off"
visible="true">
<mx:ComboBox id="searchFields" width="112" height="22"></mx:ComboBox>
<mx:ComboBox id="searchOperators" width="77" height="22">
<mx:ArrayCollection>
<mx:Object data="" label=""/>
<mx:Object data="equals" label="equals"/>
<mx:Object data="begins" label="begins with"/>
<mx:Object data="ends" label="ends with"/>
<mx:Object data="within" label="contains"/>
</mx:ArrayCollection>
</mx:ComboBox>
<mx:TextInput width="88" height="22" fontSize="9" id="searchString"/>
<mx:Button label="GO" id="filterSearchButton" height="22" width="21" fontSize="9" paddingBottom="0" paddingLeft="0" paddingRight="0" paddingTop="0" click="onFilterSearchClick();"/>
<mx:LinkButton label="Show All Records" id="showAllButton" visible="false" click="onShowAllButtonClick();" width="136" color="#02BF0B"/>
</mx:HBox>



public function displayFilterForm():void
{
//Alert.show("sdf");
var move:Move = new Move();
move.xFrom = showFilterForm.x;
move.xTo = showFilterForm.x + 300;
move.easingFunction = Bounce.easeOut;
move.duration = 1000;

showFilterForm.setStyle("showEffect", move);
}


Any ideas why???