如何从服务器获取的URL减少图像大小? (阵营天然)

时间:2016-07-28 09:29:11

标签: javascript android ios reactjs react-native

我已经实现了fetch()请求来调用从服务器传输大量图像的api。我想在我的应用程序中加载这些图像,但是当我由于图像的大尺寸而将其实现为swiper时,应用程序会崩溃。我们可以通过其网址调整该图像的大小,因为我只获得了图像结果。您可以将我的代码视为:`

render(){
var pages = [];
for (var i = 0; i < this.props.items.length; i++) {
const imageURL = 'http://photoos.boondrive.com/'+ this.props.items[i].large_file_path + this.props.items[i].display_name;

pages.push(
  <View style={{flex:1, backgroundColor:'black', justifyContent:'center', alignItems:'center'}} key={i}>
    <View>
      <Image
        style={{width:width,height:height}}
        source={{uri:imageURL}}>
        </Image>
    </View>
  </View>

);
}


return(
  <View style={{flex:1}}>
  <View>
  <AndroidToolBar title={'Photos'} navIcon={JResource.back} flowIcon={JResource.expandarrow}
  onPress={()=>this.props.navigator.pop()}/>
  </View>

  <Swiper style={{flex:1}} index={this.props.items.indexOf(this.props.item)}  loop={false}>
  {pages}
  </Swiper>

  </View>
);
}

}

我已经猜到了当我将图像输入到数组中时会产生大尺寸的数组,因此当它被渲染时,应用程序会分配大约255mb的大内存,因此我无法扫描所有图像。应用程序被绞死并崩溃。如何获得我期望的输出以及如何在当前问题中优化内存。任何建议都会非常有帮助。

0 个答案:

没有答案