2016-02-29 75 views
0

我正在編寫一個應用程序使用反應原生。它有一個ListView來顯示項目列表。我的代碼看起來像這樣:反應本機ListView不滾動

var ListMoviesView = React.createClass({ 

getInitialState() { 
    return { 
     dataSource: new ListView.DataSource({ 
      rowHasChanged: (row1, row2) => row1 !== row2 
     }), 
     loaded: false 
    }; 
}, 

componentDidMount : function() { 
    this.fetchData(); 
}, 



render : function() { 
    if (!this.state.loaded) { 
     return this.renderLoadingView(); 
    } 

    return(

      <ListView 
       dataSource={this.state.dataSource} 
       renderRow={this.renderMovie} 
       style={styleList.listView} /> 
    ); 
}, 

renderMovie(movie) { 
    return (
     <View style={styleList.container}> 
      <Image source={{uri: movie.posters.thumbnail}} style={styleList.thumbnail} /> 
     </View> 
    ); 
}, 

buttonClicked : function (movie){ 
} 


}); 

這是完美的工作列表滾動。但是,如果我有一個這樣的ToolbarAndroid:

return(
     <View> 
      <ToolbarAndroid 
       actions={toolbarActions} 
       onIconClicked={() => this.setState({actionText: 'Icon clicked'})} 
       style={styleToolbar.toolbar} 
       subtitle={this.state.actionText} 
       title="Toolbar" /> 
      <ListView 
       dataSource={this.state.dataSource} 
       renderRow={this.renderMovie} 
       style={styleList.listView} /> 
     </View> 
    ); 

該ListView不滾動。我忘記了什麼?

我的風格:

toolbar: { 
    backgroundColor: '#e9eaed', 
    height: 56 
} 


listView: { 
    flexDirection: 'column', 
    flex:1, 
    backgroundColor: '#F5FCFF' 
} 

我已嘗試添加容器ViewScrollView但是這不太正常工作。

回答

0

你應該一個樣式添加到 像:

<View style={styles.container}> 
    <ToolbarAndroid /> 
    <ListView /> 
</View> 

風格:

container:{ 
flex:1, 
} 

我不知道爲什麼,但它的工作。