如何以编程方式进行 pageScroll mx.DataGrid？

Question

如有英文错误，敬请见谅。
我想通过单击按钮栏事件以编程方式滚动数据网格。

以下代码有效，但它会逐一滚动。
我需要的是页面滚动，比如点击空白的水平 scrollTrack 区域。
任何帮助将不胜感激。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init()">
    <mx:Script>
        <![CDATA[
            import mx.events.ItemClickEvent;
            import mx.collections.ArrayCollection;

            private var arr:ArrayCollection = new ArrayCollection([
                {COL1:"aaa",COL2:"bbb",COL3:"ccc",COL4:"ddd",COL5:"eee",COL6:"fff",COL7:"ggg",COL8:"hhh",COL9:"iii",COL10:"jjj",COL11:"kkk",COL12:"lll",COL13:"mmm",COL14:"nnn",COL15:"ooo",COL16:"ppp",COL17:"qqq",COL18:"rrr",COL19:"sss",COL20:"ttt"}
            ]);
            public function init(): void
            {
                scrollController.dataProvider=["|<", "<", ">", ">|"];
                grid.dataProvider = arr;
            }

            public function doScroll(event: ItemClickEvent): void
            {
                if (event.index ==0)
                {
                    // force move to left end.
                    grid.horizontalScrollPosition = 0;
                }
                else if (event.index ==1){
                    // move left one by one
                    // *** I want modify here.
                    if (grid.horizontalScrollPosition > 0){
                        grid.horizontalScrollPosition -= 1;
                    }
                }
                else if (event.index ==2){
                    // move right one by one
                    // *** I want modify here too.
                    if (grid.horizontalScrollPosition < grid.maxHorizontalScrollPosition){
                        grid.horizontalScrollPosition += 1;
                    }
                }
                else{
                    // force move to right end.
                    if (grid.horizontalScrollPosition < grid.maxHorizontalScrollPosition){
                        grid.horizontalScrollPosition = grid.maxHorizontalScrollPosition;
                    }
                }
            }

        ]]>
    </mx:Script>
    <mx:ButtonBar id="scrollController" y="0" itemClick="doScroll(event)"/>
    <mx:DataGrid id="grid" y="30" width="340" horizontalScrollPolicy="on">
        <mx:columns>
            <mx:DataGridColumn headerText="COL1" dataField="COL1" width="100"/>
            <mx:DataGridColumn headerText="COL2" dataField="COL2" width="100"/>
            <mx:DataGridColumn headerText="COL3" dataField="COL3" width="100"/>
            <mx:DataGridColumn headerText="COL4" dataField="COL4" width="100"/>
            <mx:DataGridColumn headerText="COL5" dataField="COL5" width="100"/>
            <mx:DataGridColumn headerText="COL6" dataField="COL6" width="100"/>
            <mx:DataGridColumn headerText="COL7" dataField="COL7" width="100"/>
            <mx:DataGridColumn headerText="COL8" dataField="COL8" width="100"/>
            <mx:DataGridColumn headerText="COL9" dataField="COL9" width="100"/>
            <mx:DataGridColumn headerText="COL10" dataField="COL10" width="100"/>
            <mx:DataGridColumn headerText="COL11" dataField="COL11" width="100"/>
            <mx:DataGridColumn headerText="COL12" dataField="COL12" width="100"/>
            <mx:DataGridColumn headerText="COL13" dataField="COL13" width="100"/>
            <mx:DataGridColumn headerText="COL14" dataField="COL14" width="100"/>
            <mx:DataGridColumn headerText="COL15" dataField="COL15" width="100"/>
            <mx:DataGridColumn headerText="COL16" dataField="COL16" width="100"/>
            <mx:DataGridColumn headerText="COL17" dataField="COL17" width="100"/>
            <mx:DataGridColumn headerText="COL18" dataField="COL18" width="100"/>
            <mx:DataGridColumn headerText="COL19" dataField="COL19" width="100"/>
            <mx:DataGridColumn headerText="COL20" dataField="COL20" width="100"/>
        </mx:columns>
    </mx:DataGrid>
</mx:Application>

Run demo on wonderfl

9 月 16 日更新17:15（日本标准时间）
我在 CustomDateGrid(extended mx.DataGrid) 中编写了这段代码并从 ButtonBar 调用。但是什么也没有发生。

    public function scrollToRightPage(): void{

        var delta:Number = this.horizontalScrollBar.pageScrollSize != 0 ? this.horizontalScrollBar.pageScrollSize : this.horizontalScrollBar.pageSize;
        var direction:Number = 1;
        var scrollPosition:Number = this.horizontalScrollPosition + direction * delta;

        var oldPosition: Number = this.horizontalScrollPosition;
        var event:ScrollEvent = new ScrollEvent(ScrollEvent.SCROLL);
        event.detail = ScrollEventDetail.PAGE_RIGHT;
        event.position = scrollPosition;
        event.delta = scrollPosition - oldPosition;
        event.direction = ScrollBarDirection.HORIZONTAL;
        this.horizontalScrollBar.dispatchEvent(event);

        // Call scrollHandler(the protected function defined at DataGrid.as) instead of horizontalScrollBar.dispatchEvent was also nothing occurred.
        // scrollHandler(event);
    }

Answer 1

我放弃派发ScrollEvent。但无论如何我通过设置 horizontalScrollPosition.

解决了它

首先，我将这些函数添加到 CustomDataGrid。

public function scrollToRightPage(): void{

    // I got a hint from "mx_internal function pageScroll"(defined at ScrollBar.as).
    var delta:Number = this.horizontalScrollBar.pageScrollSize != 0 ? this.horizontalScrollBar.pageScrollSize : this.horizontalScrollBar.pageSize;
    var direction:Number = 1;
    var scrollPosition:Number = this.horizontalScrollPosition + direction * delta;

    this.horizontalScrollPosition = scrollPosition;
}

public function scrollToLeftPage(): void{

    var delta:Number = this.horizontalScrollBar.pageScrollSize != 0 ? this.horizontalScrollBar.pageScrollSize : this.horizontalScrollBar.pageSize;
    var direction:Number = -1;
    var scrollPosition:Number = this.horizontalScrollPosition + direction * delta;

    this.horizontalScrollPosition = scrollPosition;
}

并从外部调用 class，如下所示。

if (event.index ==0)
{
    grid.horizontalScrollPosition = 0;
}
else if (event.index ==1){
    if (grid.horizontalScrollPosition > 0){
        //grid.horizontalScrollPosition -= 1;

        // Jump to left page.
        grid.scrollToLeftPage();
    }
}
else if (event.index ==2){
    if (grid.horizontalScrollPosition < grid.maxHorizontalScrollPosition){
        //grid.horizontalScrollPosition += 1;

        // Jump to right page.
        grid.scrollToRightPage();
    }
}
else{
    if (grid.horizontalScrollPosition < grid.maxHorizontalScrollPosition){
        grid.horizontalScrollPosition = grid.maxHorizontalScrollPosition;
    }
}

如何以编程方式进行 pageScroll mx.DataGrid？

How to pageScroll mx.DataGrid programmatically?

apache-flex

flex3

actionscript-3