我正在尝试制作自己的组件,该组件的行为类似于列表并支持无限滚动(在一维:垂直或水平) - 两个方向。例如,一个垂直布局的列表,用户可以永远向上或向下滚动 - 而无需点击"最后一个"或"第一个"项目。这是一个很好的用途:将每个月显示为列表项的日历。
无论如何,有很多事情需要克服。我认为,其中第一个是禁用滚动条的弹跳效果(在最新的 Flex 4.5(移动)SDK 中引入)。
如果我可以禁用反弹效果,我猜我可以根据需要在列表中添加/删除项目,它会无限滚动。
有什么想法吗?
奎 师 那
就个人而言,无限列表意味着核心列表组件的大量返工。 逆向工程需要做很多工作,你可能会碰壁。 我认为您要做的是从头开始创建一个组件并扩展SkinnableContainer
.
从现在开始,您需要决定如何实现无限列表以及用户交互是什么,然后需要实现适当的实践并重用您的项目渲染器。
根据我的经验,您可以通过将属性更改事件添加到列表 dataGroup 的视口来简单地实现 List 组件上的延迟加载
list.dataGroup.addEventListener( PropertyChangeEvent.PROPERTY_CHANGE, onScrollPropertyChangeHandler );
然后在事件中,收听垂直滚动位置
if ( event.property == "verticalScrollPosition" ){
var listHeight:Number = itemList.height;
var curAnchorPoint:Number = event.newValue + listHeight;
var bottomPositionToLoad:Number = 200; // Start loading when the list nearly reach the bottom minus 200
var anchorToLoadNextPage:Number = itemList.dataGroup.contentHeight - bottomPositionToLoad;
if(curAnchorPoint >= anchorToLoadNextPage){
loadNextPage();
}
}
当 loadNextPage() 运行时,请记住删除属性更改事件,这样 loadNextPage 就不会被多次调用。