Sequencing in functions

Question

I have a function that hides a horizontal rule, moves it
relative to the currentTarget, and makes it reappear. The
showEffect on the HR is an instance of the WipeRight effect, and
the hideEffect is an instance of the WipeLeft effect. So, in
essence, when a user clicks on a button, a line "grows" out of that
button to the right. When a user clicks another button, the line
"shrinks" from its current position, moves to the new position, and
"grows" from there. At least, that was the plan. The problem is the
the move occurs faster than the effect, and the line ends up EITHER
turning visible or invisible, but not both, as planned. Here's the
code for the function:
quote:
public function moveHideHRule(event:Event):void {
myLine.visible = false;
myLine.x = event.currentTarget.x + 135;
myLine.y = event.currentTarget.y + 10;
myLine.visible = true;
here's where I call the event:
quote:
<mx:LinkButton id="addBtn" x="10" y="50" label="Add a New
Resource"
click="theWindow.selectedChild=myAdd; moveHideHRule(event);"
/>
<mx:LinkButton id="updateBtn" x="10" y="80" label="Update
a Resource"
click="theWindow.selectedChild=myUpdate;
moveHideHRule(event);"/>
<mx:LinkButton id="searchBtn" x="10" y="110"
label="Search for a Resource"
click="theWindow.selectedChild=mySearch;
moveHideHRule(event);"/>
and here's where I create/call the effects:
quote:
<mx:HRule width="50" strokeWidth="1" strokeColor="blue"
x="139" y="60" visible="false" id="myLine"
showEffect = "{myRightWipe}" hideEffect="{myLeftWipe}"/>

Answer 1

I've been able to create a Sequence effect, as suggested by
dimpled, but it does not completely solve my problem. You see, I
don't actually want to see myLine move (right now, I'm using a Move
effect). I thought I might be able to get around this by embedding
the move within a sequence in a function, but I can't seem to
figure out how to embed other, non-effect, actions within a
sequence. The best I can get is for the sequence to run and then
myLine appears at the new spot, or vice versa.
As Screenivas mentions, I could easily create two (or more)
HRules and forget about the moving, but I'd like to figure out if
there's a way to include non-effect actions within a sequence.
Here's the new code (in it's entirety, as Greg asked for). You see
that I can get a sequence to work, but I don't actually want to see
the HRule move.
quote:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="
http://www.adobe.com/2006/mxml"
layout="absolute" xmlns:ns1="*">
<mx:Script>
<![CDATA[
private function moveLine(e:Event):void {
myLine.visible = true;
myMove.end();
myMove.xTo = e.currentTarget.x + 145;
myMove.yTo = e.currentTarget.y + 10;
myMove.play();
myLineMove.play();
]]>
</mx:Script>
<mx:Sequence id="myLineMove" target="{myLine}" >
<mx:WipeLeft id="myWL" duration="500"/>
<mx:Move id="myMove" />
<mx:WipeRight id="myWR" duration="500"/>
</mx:Sequence>
<mx:Panel x="10" y="0" width="100%" height="90%"
layout="absolute" title="Intro Panel" id="P_intro">
<mx:Text x="10" y="24" text="What would you like to do?"
width="229"/>
<mx:LinkButton id="addBtn" x="10" y="50" label="Add a New
Resource"
click="theWindow.selectedChild=myAdd; moveLine(event);"
/>
<mx:LinkButton id="updateBtn" x="10" y="80" label="Update
a Resource"
click="theWindow.selectedChild=myUpdate;
moveLine(event);"/>
<mx:LinkButton id="searchBtn" x="10" y="110"
label="Search for a Resource"
click="theWindow.selectedChild=mySearch;
moveLine(event);"/>
<mx:ViewStack x="173" y="10" id="theWindow" width="100%"
height="95%">
<mx:Panel id="starterPanel" borderColor="blue">
<mx:Text text="Welcome!" id="welcomeMsg" x="45"
y="78"/>
</mx:Panel>
<ns1:addRecord id="myAdd" />
<ns1:searchForm id="myUpdate" />
<ns1:updateRecord id="mySearch" />
<mx:Canvas label="Add" width="100%" height="100%">
</mx:Canvas>
</mx:ViewStack>
<mx:HRule width="50" strokeWidth="1" strokeColor="blue"
x="139" y="60" visible="false" id="myLine" />
</mx:Panel>
</mx:Application>