Spark Datagrid 滚动答案

【问题标题】：Spark Datagrid scrollingSpark Datagrid 滚动
【发布时间】：2015-05-07 07:02:29
【问题描述】：

我有一个数据（例如一百万行）要显示在移动应用程序的数据网格中。我试图找出一种方法，一旦滚动到达页面末尾，即。它再次向服务器请求下一组记录的网格上的最后一行。 MX 数据网格 (http://blog.tremend.ro/2009/03/02/flex-live-scroll-datagrid/) 中的 Scroll 事件可以轻松完成，但在 spark 数据网格中不存在。我希望用 spark 数据网格来完成。

我怎样才能做到这一点。需要帮助..!!

谢谢

【问题讨论】：

我已经提供了答案并且它有效。

标签： actionscript-3 apache-flex datagrid flex4.5

【解决方案1】：

我已经快速编译了一个有效的示例。您可以将侦听器添加到 datagrid dg 的滚动条中：

dg.scroller.verticalScrollBar.addEventListener(Event.CHANGE, list_verticalScrollBar_change);
private function list_verticalScrollBar_change(evt:Event):void {
            var vsb:VScrollBar = evt.currentTarget as VScrollBar;
            // Now you can check for scroll position.
}

完整代码如下：

<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" minWidth="955" minHeight="600"
               creationComplete="application1_creationCompleteHandler(event)">
    <fx:Script>
        <![CDATA[
            import mx.controls.Alert;
            import mx.events.FlexEvent;

            import spark.components.VScrollBar;

            protected function application1_creationCompleteHandler(event:FlexEvent):void
            {
                dg.scroller.verticalScrollBar.addEventListener(Event.CHANGE, list_verticalScrollBar_change)
            }

            private function list_verticalScrollBar_change(evt:Event):void {
                var vsb:VScrollBar = evt.currentTarget as VScrollBar;
                if(dg.grid.contentHeight == dg.grid.layout.verticalScrollPosition+dg.grid.height) {
                    Alert.show("Making service call");
                    // make some service call.
                }
            }

        ]]>
    </fx:Script>
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <s:DataGrid id="dg" width="100%" height="100">
        <s:dataProvider>
            <s:ArrayList> 
                <fx:Object age="24" sex="f" name="Susan" joinDate="{new Date(2007, 5, 15)}" />
                <fx:Object age="36" sex="f" name="Ashley" joinDate="{new Date(1998, 7, 20)}" />
                <fx:Object age="24" sex="f" name="Jennifer" joinDate="{new Date(2001, 3, 24)}" />
                <fx:Object age="19" sex="f" name="Emma" joinDate="{new Date(2002, 3, 24)}" />
                <fx:Object age="44" sex="f" name="Carol" joinDate="{new Date(1999, 9, 16)}" />
                <fx:Object age="28" sex="m" name="Peter" joinDate="{new Date(2005, 3, 12)}" />
                <fx:Object age="35" sex="m" name="Mike" joinDate="{new Date(2008, 10, 10)}" />
                <fx:Object age="26" sex="m" name="Dave" joinDate="{new Date(2008, 10, 10)}" />
                <fx:Object age="44" sex="m" name="William" joinDate="{new Date(2004, 9, 16)}" />
                <fx:Object age="24" sex="m" name="Sean" joinDate="{new Date(2006, 3, 24)}" />
            </s:ArrayList> 
        </s:dataProvider>
    </s:DataGrid>
</s:Application>

【讨论】：