スライドさせて選択する

/**
 * Copyright propg ( http://wonderfl.net/user/propg )
 * MIT License ( http://www.opensource.org/licenses/mit-license.php )
 * Downloaded from: http://wonderfl.net/c/jiRB
 */

<?xml version="1.0" encoding="utf-8"?>
<s:Application
    xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:s="library://ns.adobe.com/flex/spark"
    xmlns:mx="library://ns.adobe.com/flex/mx"
    creationComplete="OnCreationCompleteHandler(event)">

    <fx:Style>
        @namespace s "library://ns.adobe.com/flex/spark";
        @namespace mx "library://ns.adobe.com/flex/mx";
        @namespace controls "nt.controls.*";
        @namespace controls1 "labo.controls.*";
        @namespace code "http://code.google.com/p/flexlib/";
        s|Application {
            backgroundColor: #EFE1FF;
        }

        global { 
            font-family: "MS UI Gothic", Verdana, Arial, Helvetica, sans-serif;
            fontSize:14px;
        }


    </fx:Style>

    <fx:Script>
        <![CDATA[
           import spark.components.BorderContainer;
           import spark.components.HGroup;
           import spark.components.Label;
           import spark.components.Button;
           private function OnCreationCompleteHandler(event:Event):void {
                var idx:int = 0;
                for each (var item:String in items) {
                    var container:BorderContainer = new BorderContainer();
                    container.width = 80;
                    container.left = idx * 80;
                    container.top = 0;
                    container.bottom = 0;
                    container.height = 25;
                    container.setStyle("backgroundAlpha", 0);
                    var itemLabel:Label = new Label();
                    itemLabel.text = item;
                    itemLabel.setStyle("textAlign", "center");
                    itemLabel.left = 0;
                    itemLabel.right = 0;
                    itemLabel.percentHeight = 80;
                    itemLabel.setStyle("color", "#ffffff");
                    itemLabel.setStyle("verticalAlign", "middle");
                    container.addElement(itemLabel);
                    outerFlame.addElement(container);
                    idx++;
                } // end-of-for
                                
                selectButton = new Button();
                selectButton.left = 0;
                selectButton.width = 80;
                selectButton.height = 22;
                selectButton.label = items[0];
                selectButton.setStyle("fontWeight", "bold");
                outerFlame.addElement(selectButton);
                
            }
    
    private var selectButton:Button
    private var canvasX:Number;
    private var canvasY:Number;
    private var mapX:Number;
    private var mapY:Number;
           
    // マウスボタンダウン
    private function mouseDownHandler(event:MouseEvent):void {
      canvasX = outerFlame.mouseX;
      canvasY = outerFlame.mouseY;
      mapX = selectButton.x;
      mapY = selectButton.y;
      trace("mouseDownHandler()実行！ (cx,cy,vx,vy)=["+canvasX+","+canvasY+","+mapX+","+mapY+"]");
    }

    // マウス移動(ドラッグ)
    private function mouseMoveHandler(event:MouseEvent):void {
      if (!event.buttonDown) return;
      selectButton.x = outerFlame.mouseX - canvasX + mapX;
      selectButton.y = outerFlame.mouseY - canvasY + mapY;
      trace("mouseMoveHandler()実行！ (x,y)=["+selectButton.x+","+selectButton.y+"]");
    }            
     
    private var currentIndex:int = 0;        
    private var items:Array = ["un", "deux", "trois", "quatre", "cinq"];
    
    private var itemWidth:int = 70;
        ]]>
    </fx:Script>
 
    <fx:Declarations>
        <mx:AnimateProperty id="animeEff" property="left" duration="200"/>
    </fx:Declarations>
    
  
    
    <s:layout>
        <s:VerticalLayout paddingLeft="5" paddingTop="5" paddingBottom="5" paddingRight="5"/>
    </s:layout>
    
    <s:HGroup>
        <s:Button label="PREV" 
        click="{if (currentIndex &gt; 0) {animeEff.fromValue = currentIndex * 80; currentIndex--;animeEff.toValue = currentIndex * 80;animeEff.play([selectButton]);selectButton.label=items[currentIndex];}}"/>
       <s:Button label="NEXT" click="{if (currentIndex &lt; items.length-1) {animeEff.fromValue = currentIndex * 80; currentIndex++; animeEff.toValue = currentIndex * 80;animeEff.play([selectButton]);selectButton.label=items[currentIndex];}}"/>
     </s:HGroup>
    <s:BorderContainer id="outerFlame" height="25" borderVisible="true" backgroundColor="black" mouseDown="mouseDownHandler(event)" mouseMove="mouseMoveHandler(event)">
        
    </s:BorderContainer>
    
    <s:Label text="これをマウスでドラッグさせたいけど・・・この実装は明らかにおかしい"/>
</s:Application>