Click event on Button causes components to shift right.

Question

I have a pretty basic photo viewer app. When I click on the 'next' button all the components shift to the right a small, but noticeable amount. When I click the 'previous' button the app does not drift either way immediately. If I click previous twice and then next once it has a cummulative effect of moving the components left 1 space. I have never seen this happen before. Any thoughts?
< mx:Application >
<mx:HBox>
<mx:VBox>
<mx:Button id="prvBt"  click="prevGroup();"
  upSkin="@Embed(source='prev.png')"
      overSkin="@Embed(source='prev_over.png')"
              downSkin="@Embed(source='prev.png')"
  icon="@Embed(source='prev.png')" >
</mx:Button>
<mx:TileList width="120" id="photoList"  height="475" >
<mx:itemRenderer>
<mx:Component>
<mx:Image
horizontalAlign="center"
verticalAlign="center"
source="{data.filename}"
toolTip="{data.name}"
width="100"
height="150" />
</mx:Component>
</mx:itemRenderer>
</mx:TileList>
<mx:Button id="nxtBt" click="nextGroup();"
upSkin="@Embed(source='next.png')"
    overSkin="@Embed(source='next_over.png')"
        downSkin="@Embed(source='next.png')"
        icon="@Embed(source='next.png')" >
</mx:Button>
</mx:VBox>
<mx:VBox>
<mx:ProgressBar id="progressBar" source="{image}" visible="false" />
<mx:Image width="640" height="474" id="image" source="{photoList.selectedItem.filename}"
horizontalAlign="center" verticalAlign="center"
open="progressBar.visible=true" complete="progressBar.visible=false" />
</mx:VBox>
</mx:HBox>
</mx:Application>

Answer 1

Here is the method in question.
endRec, STEPVAL, startRec, X are all integers.
The purpose is to load the next 4 photos in a tilelist component, the photo data is coming from an xml file.
private function nextGroup():void{
endRec = endRec + STEPVAL;
startRec += STEPVAL;
x = startRec;
if(endRec > totalRec)
endRec = totalRec;
if(startRec < STEPVAL)
prvBt.enabled = false;
else
prvBt.enabled = true;
if(endRec >= totalRec)
nxtBt.enabled = false;
else
nxtBt.enabled = true;
tempPhotos.length = 0;
try{
while(x < endRec){
var po:PhotoObject = new PhotoObject();
po.name = photoFeed.photo[x].@name;
po.filename = photoFeed.photo[x].@filename;
tempPhotos.push(po);
x++;
photoList.dataProvider = tempPhotos;
}catch(err:Error){
Alert.show("a Next Error: " + ObjectUtil.toString(err));