落叶随风将要去何方

页面等待render的效果

页面在网络获取网络数据的时候根据手机质量不同时间也不同,一些硬件质量不高的手机可能

会要很长一段时间,这样就会出现1至3秒的空白期,这感觉很糟糕,于是就想在这个空白期加个

ActivityIndicator,这样感觉大概会好一点

constructor(props) {
      super(props);
      this.state={
        
        animating: true,
        loaded: false,
      };
   
  }
  fetchStories() {
    var uu=http://192.168.1.202:7073/ consumerapp/getmytradelist
  
  fetch(uu)
  .then((response) => response.json())
  .then((responseData) => {
    if(responseData.statusCode==0){
      if(responseData.data.length!=0){
      this.setState({
     
        animating: false,
        loaded:true,
      });
    }
    }
  })
  .catch((error) => {
   console.error(error);
  })
  .done();
}
renderLoadingView() {return (
      <View style={{flex:1,justifyContent:"center",alignItems:'center'}}>
        <ActivityIndicator
              size='large'
              color='#1980DC'
              animating={this.state.animating}
          />
      </View>
    );
  }
render(){if (!this.state.loaded) {
           return this.renderLoadingView();
         }
      return(

            <ListView
                dataSource={this.state.dataSource}
                renderRow={this._renderRow.bind(this)}
                initialListSize ={5}
                pageSize ={5}
                showsVerticalScrollIndicator={false}
            />

      );
  }

 

posted @ 2016-11-30 10:25  木子飞2  阅读(284)  评论(0编辑  收藏  举报

只留给天空美丽一场