android – 如何在反应原生中使用列表视图获取选框效果？

我试图在反应本机列表视图中获取选框效果.我正在尝试以这种方式实现.

<ListView
    horizontal={true}
    ref={ref => this.infoListView = ref}
    showsHorizontalScrollIndicator={false}
    automaticallyAdjustContentInsets={false}
    onContentSizeChange={(contentWidth,contentHeight)=>{        
      this.moveListToEnd()
    }}
    onEndReached={()=>this.moveListToTop()}
    enableEmptySections={true}
    style={styles.infolist}
    dataSource={this.state.dataSource}
    renderRow={(rowData,sectionID,rowID) => < Row data={rowData} rowID = {rowID}/>} />



moveListToEnd(){
    this.infoListView.scrollToEnd({animated: true});
}

moveListToTop(){
    this.infoListView.scrollTo({x: 0,y: 0,animated: true})
    this.moveListToEnd();
}

解决方法

我找到了做到这一点的方法.
首先安装NPM react-timer-mixin.并使用此代码.

var moveListTimer = require('react-timer-mixin');

constds='';
vartimerInterval=10;
varmoveListTimerId;
varpos=0;
varListArr=[];



class MarqueeListClass extends Component{

constructor(props){
    super(props);
    ds = new ListView.DataSource({rowHasChanged: (r1,r2) => r1 !== r2});
    this.state = {
        dataSource: ds.cloneWithRows(ListArr),listLength:ListArr.length,listmovingdirection:'right',};
}


componentDidMount() {
    moveListTimerId = moveListTimer.setInterval( () => { 
        this.moveList();
    },timerInterval);
}


componentwillUnmount() {
  moveListTimerId && clearInterval(moveListTimerId);
}

moveList(){
    if(this.state.listmovingdirection==='right'){
        this.moveListToRight();
    }
    else if(this.state.listmovingdirection ==='left'){
        this.moveListToLeft();
    }
}

moveListToEnd(){
    this.ListView.scrollToEnd({animated: true});
}

moveListToRight(){
    pos = pos + 0.5; 
    this.ListView.scrollTo({x: pos,animated: true})
}

moveListToLeft(){
    if(pos>0){
        pos = pos - 0.5;
        this.ListView.scrollTo({x: pos,animated: true})
    }
    else{
        this.setState({listmovingdirection:'right'});
    } 
}

onListReachEnd(){
    this.setState({listmovingdirection:'left'});
}

render(){

   return(
    <View style = {styles.main}>
                <ListView
                    horizontal={true}
                    ref={ref => this.ListView = ref}
                    showsHorizontalScrollIndicator={false}
                    automaticallyAdjustContentInsets={false}
                    onEndReached={()=>this.onListReachEnd()}
                    enableEmptySections={true}
                    style={styles.list}
                    dataSource={this.state.dataSource}
                    renderRow={(rowData,rowID) => < Row info={rowData} rowID = {rowID}/>} />  
    </View>
  );
}
}