хочет автоматически прокручивать плоский список в реакцию родного - PullRequest
Новая
       6

хочет автоматически прокручивать плоский список в реакцию родного

0 голосов
/ 07 февраля 2019

Я пытаюсь автоматически прокрутить свой плоский список, но когда я запускаю свой код, я не могу прокрутить автоматически, и если я хочу выполнить ручную прокрутку, он приходит к индексу 0 через каждые 5 секунд ... вот мой весь код плоского списка и его ссылкифункция

в конструкторе 

this.flatList1=null;

и в компонентеwillMount 

componentWillMount(){

  setInterval(()=>{
    if(this.flatList1!==null){
      this.flatList1.scrollToOffset({ offset: 1 })
    }
  }, 5000);
}

<FlatList horizontal
  data={this.state.getallvideos}
  ref={flatList1 => { this.flatList1 = flatList1 }}
  renderItem={({item}) =>  

    <TouchableOpacity onPress={this.playvideoinnetpage.bind(this,item.vd_link,item.vd_thumbnail,item.vd_id,item.vd_title)}>

      <Card
        containerStyle={{
          padding:0, 
          width:180,
          height:112,
          backgroundColor:'#000',
          borderColor:'#000',
          marginTop:10,
          marginLeft: 5,
          marginRight:5,
          marginBottom:5
        }}
        image={{uri:item.vd_thumbnail}}
        imageStyle={'stretch'}
      >

        <View style={{position:'relative',bottom:75,}}> 
          <Text numberOfLines={1} style={{color:'#fff',fontWeight:'bold',fontSize:14}}> {item.vd_title}</Text>
        </View>
      </Card>
    </TouchableOpacity>
  }
/>

1 Ответ

0 голосов
/ 07 февраля 2019

Вы можете прочитать ответ здесь [ Как сделать, чтобы список (FlatList) автоматически прокручивал элементы, используя Animated? ] 

scrollToIndex = (index, animated) => {
   this.listRef && this.listRef.scrollToIndex({ index, animated })
 }

 componentDidMount() {  // use componentDidMount instead since the WillMount is getting deprecated soon
   setInterval(function() {
     const { sliderIndex, maxSlider } = this.state
     let nextIndex = 0

     if (sliderIndex < maxSlider) {
       nextIndex = sliderIndex + 1
     }

     this.scrollToIndex(nextIndex, true)
     this.setState({sliderIndex: nextIndex})
   }.bind(this), 3000)
 }

Вы должны существенно увеличить индекс вместо этогоустановить его на 1 каждые 5000 мсек, как в коде выше.Сохраните currentIndex, maxIndex и используйте функцию scrollToIndex после увеличения currentIndex, как описано выше.Убедитесь, что вы изменяете состояние после обновления currentIndex с помощью setInterval

...