Flex verticalScrollPosition動的制御スクロールバー

直接コード:(1日ひっくり返してテストした、汗)
1番目のDataGridのitemをクリックすると、右側のVboxのスクロールバーが2番目のDataGridにスライドして表示されます.
2番目のDataGridのitemをクリックすると、右側のVboxのスクロールバーが3番目のDataGridにスライドして表示されます.
要点:VboxのverticalScrollPositionプロパティを制御することでスクロールバーを位置決めします.

  
  
  
  

   
   
   
   
<?xml version="1.0" encoding="utf-8"?> 
   
   
   
   
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" minWidth="955" minHeight="600"> 
   
   
   
   
    <mx:Script> 
   
   
   
   
        <![CDATA[ 
   
   
   
   
            import mx.collections.ArrayCollection; 
   
   
   
   
            import mx.controls.Alert; 
   
   
   
   
            import mx.core.ScrollPolicy; 
   
   
   
   
            import mx.events.ListEvent; 
   
   
   
   
            import mx.events.ScrollEvent; 
   
   
   
   
             
   
   
   
   
            import org.hamcrest.mxml.collection.EveryItem; 
   
   
   
   
             
   
   
   
   
            [Bindable] 
   
   
   
   
            public var arrCollection:ArrayCollection=new ArrayCollection([ 
   
   
   
   
                {"id":1,"title":" 1"}, 
   
   
   
   
                {"id":2,"title":" 2"}, 
   
   
   
   
                {"id":3,"title":" 3"}, 
   
   
   
   
                {"id":4,"title":" 4"}, 
   
   
   
   
                {"id":5,"title":" 5"}, 
   
   
   
   
                {"id":6,"title":" 6"}, 
   
   
   
   
                {"id":7,"title":" 7"}, 
   
   
   
   
                {"id":8,"title":" 8"}, 
   
   
   
   
                {"id":9,"title":" 9"}, 
   
   
   
   
                {"id":10,"title":" 10"}, 
   
   
   
   
                {"id":11,"title":" 11"}, 
   
   
   
   
                {"id":12,"title":" 12"}, 
   
   
   
   
                {"id":13,"title":" 13"}, 
   
   
   
   
                {"id":14,"title":" 14"} 
   
   
   
   
            ]); 
   
   
   
   
             
   
   
   
   
            private var timer:Timer; 
   
   
   
   
            private var stepNumber:Number=10; 
   
   
   
   
            protected function dg1_itemClickHandler(event:ListEvent):void 
   
   
   
   
            { 
   
   
   
   
                timer=new Timer(0); 
   
   
   
   
                timer.repeatCount=dg1.height/stepNumber; 
   
   
   
   
                timer.addEventListener(TimerEvent.TIMER,app1); 
   
   
   
   
                timer.start(); 
   
   
   
   
            } 
   
   
   
   
             
   
   
   
   
            private function app1(evt:TimerEvent):void{ 
   
   
   
   
                vboxbgg.verticalScrollPosition+=stepNumber; 
   
   
   
   
                if(vboxbgg.verticalScrollPosition>=dg1.height){ 
   
   
   
   
                    vboxbgg.verticalScrollPosition=dg1.height; 
   
   
   
   
                    timer.stop(); 
   
   
   
   
                } 
   
   
   
   
            } 
   
   
   
   
             
   
   
   
   
            protected function dg2_itemClickHandler(event:ListEvent):void 
   
   
   
   
            { 
   
   
   
   
                timer=new Timer(0); 
   
   
   
   
                timer.repeatCount=(dg1.height+dg2.height)/stepNumber; 
   
   
   
   
                timer.addEventListener(TimerEvent.TIMER,app2); 
   
   
   
   
                timer.start(); 
   
   
   
   
            } 
   
   
   
   
             
   
   
   
   
            private function app2(evt:TimerEvent):void{ 
   
   
   
   
                vboxbgg.verticalScrollPosition+=stepNumber; 
   
   
   
   
                if(vboxbgg.verticalScrollPosition>=dg1.height+dg2.height){ 
   
   
   
   
                    vboxbgg.verticalScrollPosition=dg1.height+dg2.height; 
   
   
   
   
                    timer.stop(); 
   
   
   
   
                } 
   
   
   
   
            } 
   
   
   
   
             
   
   
   
   
            protected function button1_clickHandler(event:MouseEvent):void 
   
   
   
   
            { 
   
   
   
   
                vboxbgg.verticalScrollPosition=0; 
   
   
   
   
            } 
   
   
   
   
        ]]> 
   
   
   
   
    </mx:Script> 
   
   
   
   
    <!-- flex3    height="{this.height}"  ， 100% --> 
   
   
   
   
    <mx:VBox width="100%" height="{this.height}" id="vboxbgg"> 
   
   
   
   
         
   
   
   
   
        <mx:DataGrid id="dg1" width="100%" height="150" dataProvider="{arrCollection}" paddingRight="100" 
   
   
   
   
                     itemClick="dg1_itemClickHandler(event)" 
   
   
   
   
                     verticalScrollPolicy="on"> 
   
   
   
   
            <mx:columns> 
   
   
   
   
                <mx:DataGridColumn dataField="id" headerText=" 1"/> 
   
   
   
   
                <mx:DataGridColumn dataField="title" headerText=" 1"/> 
   
   
   
   
            </mx:columns> 
   
   
   
   
        </mx:DataGrid> 
   
   
   
   
        <mx:DataGrid id="dg2" width="100%" height="200" dataProvider="{arrCollection}" 
   
   
   
   
                     verticalScrollPolicy="on" itemClick="dg2_itemClickHandler(event)"> 
   
   
   
   
            <mx:columns> 
   
   
   
   
                <mx:DataGridColumn dataField="id" headerText=" 2"/> 
   
   
   
   
                <mx:DataGridColumn dataField="title" headerText=" 2"/> 
   
   
   
   
            </mx:columns> 
   
   
   
   
        </mx:DataGrid> 
   
   
   
   
        <mx:DataGrid id="dg3" width="100%" height="500" dataProvider="{arrCollection}"> 
   
   
   
   
            <mx:columns> 
   
   
   
   
                <mx:DataGridColumn dataField="id" headerText=" 3"/> 
   
   
   
   
                <mx:DataGridColumn dataField="title" headerText=" 3"/> 
   
   
   
   
            </mx:columns> 
   
   
   
   
        </mx:DataGrid> 
   
   
   
   
        <mx:Button click="button1_clickHandler(event)" label=" "/> 
   
   
   
   
    </mx:VBox> 
   
   
   
   
</mx:Application>