Skip to content
This repository has been archived by the owner on Sep 28, 2021. It is now read-only.

我这样加载怎么是黑屏,加载示例的图片没问题 #454

Open
yuanxiaodong1 opened this issue Mar 25, 2021 · 0 comments
Open

Comments

@yuanxiaodong1
Copy link

import React from 'react';
import { View, TouchableOpacity, StyleSheet,Text,Image,FlatList,Modal } from 'react-native';
// import RefreshListView, { RefreshState } from 'react-native-refresh-list-view';
// import { Toast } from 'teaset';
// import http from '../../../../util/Http';
// import { cleanObj,transDateTime1 } from '../../../../util/CommonUtils';
// import { Api,successCode } from '../../../../constant/Api';
// import Constants from '../../../../constant/Constants';
// import LinearGradient from 'react-native-linear-gradient';
import { isIphoneX, screenW } from '../../../../util/ScreenUtil';
import ImageViewer from 'react-native-image-zoom-viewer';
export default class ApplyPicDetail extends React.Component{
constructor(props){
super(props);
this.picList = this.props.navigation.getParam('picList','');
this.state = {
agreeVisible: false,//是否显示弹框
};
}
componentDidMount = () => {

}

setAgreeVisiblee = (value) => {
this.setState({
agreeVisible: true,

});

}

setAgreeVisiblee1 = (value) => {
this.setState({
agreeVisible: false,

});

}
renderCell(item){

console.log('图片2张',({url: `data:image/png;base64,${item.item}`}));

return (
  <View style={{ marginLeft:(item.index + 1) % 2 === 0 ? 10 : 0,marginTop:item.index > 1 ? 10 : 0 }}>
    <TouchableOpacity onPress={() => this.setAgreeVisiblee(true)}>
      <Image style={{ width:(screenW - 10) / 2,height:(screenW - 10) / 2 }} resizeMode="cover"
        source={{ uri: `data:image/png;base64,${item.item}` }}
      />
    </TouchableOpacity>

  </View>
);

}

render(){

console.log('图片几张',this.picList.map);
console.log('图片1张',this.picList);

// console.log('图片2张',({url: `data:image/png;base64,${item.item}`}));


// this.picList.map

const images = [{
  
  url: 'https://avatars2.githubusercontent.com/u/7970947?v=3&s=460',

  props: {
   
  }

},

]

return (
 
  <View style={{ flex:1,backgroundColor:'#FFFFFF' }}>
    <FlatList
      style={{ flex:1,backgroundColor:'#FFFFFF' }}
      data= {this.picList}
      numColumns={2}
      keyExtractor={(item,index) => index + 'ApplyPicDetailCell'}
      renderItem={this.renderCell.bind(this)}
    />





   <Modal visible={this.state.agreeVisible} transparent={true}  

  //  onRequestClose={() => { this.setAgreeVisiblee1(false); }} 
   >
             {/* <ImageViewer  onClick ={() => this.setAgreeVisiblee1(false)} imageUrls={images}/> */}
            <ImageViewer  
            onClick ={() => this.setAgreeVisiblee1(false)}
             
            imageUrls={ this.picList.map((item) => ({url: `data:image/png;base64,${item.item}`,width:200,height:200})) }
         
            // imageUrls={this.picList.map((item) => ({url: item.item}))}
            />
  </Modal>

 

  </View>
);

}
}

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant