设置 React Native ListView 的初始滚动位置 [英] Setting an initial scroll position of a React Native ListView

问题描述

我正在尝试在 React Native 中设置 ListView 的初始滚动位置.

I'm trying to set the initial scroll position of a ListView in react native.

现在，我正在这样做:

componentDidMount() {
  let i = this.props.images.indexOf(this.props.current);
  if(i != -1) {
    this.refs.listView.scrollTo({ x:i*this.props.width, y:0, animated:false });
  }
}

其中 images 道具是 ListView 的数据源，current 道具是我最初想要滚动到的位置，以及 width prop 是组件的宽度.(组件水平滚动).

where the images prop is the datasource for the ListView, the current prop is where I want to be initially scrolled to, and the width prop is the width of the component. (The component scrolls horizontally).

这有效，但在初始渲染和调用 componentDidMount 之间有一个延迟，在滚动列表之前给我一个列表末尾的闪烁.

This works, but there's a delay between the initial render and the call to componentDidMount, giving me a flash of the end of end of the list before the list is scrolled.

有没有办法设置列表的初始滚动位置?或者有更好的方法来摆脱那个闪光?

Is there a way of setting an initial scroll position of the list? Or better way of doing this to get rid of that flash?

推荐答案

在 iOS 上你可以使用 ScrollView#contentOffset 设置ListView的初始滚动位置，继承了ScrollView的属性.

On iOS you can use the ScrollView#contentOffset to set the initial scroll position of a ListView, which inherits the properties of ScrollView.

如果您正在寻找 Android 解决方案，那么您正在调用的 ListView.scrollTo 方法似乎是一般情况下的最佳选择.

If you are looking for an Android solution, the ListView.scrollTo method you are calling seems like the best bet for the general case.

也就是说，如果我正确地解释了您的代码示例，您是否正在将 ListView 用于分页的水平列表，也许是在 pagingEnabled 属性的帮助下?如果是这种情况，在 Android 上您可能会考虑使用 ViewPagerAndroid 代替，并设置 initialPage 属性.

That said, if I interpret your code sample correctly, you are using the ListView for a paginated, horizontal list, perhaps with the help of the pagingEnabled property? If this is the case, on Android you might look at using ViewPagerAndroid instead, and setting the initialPage property.

这篇关于设置 React Native ListView 的初始滚动位置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！