import React, {Component} from 'react';
import {Modal,View,Text,TouchableOpacity,Image,StyleSheet} from 'react-native';


export default class CodeDetail extends Component {

  constructor(props) {
    super(props);//这一句不能省略，照抄即可
    this.state = {
        animationType: 'fade',//none slide fade
        modalVisible: false,//模态场景是否可见
        transparent: true,//是否透明显示
    };
  }

  render() {
    return <Modal
        animationType={this.state.animationType}
        transparent={this.state.transparent}
        visible={this.state.modalVisible}
        onRequestClose={() => {
            this._setModalVisible(false)
        }}
        onShow={this.startShow} 
    >
       <TouchableOpacity style={styles.modalContainer} onPress={() => {
                    this._setModalVisible(false)
                  }}>
                <TouchableOpacity activeOpacity={1} style={styles.modalContent} onPress={() => {
                   return
                  }}>
                    <Image style={styles.codeimg} source={require('../static/img/QR_code.png')}/>
                  </TouchableOpacity>
                  </TouchableOpacity>
  </Modal>
  }

  _setModalVisible = (visible) => {
    this.setState({modalVisible: visible});
  }
  startShow = () => {
  //   alert('开始显示了');
  }
}
const styles = StyleSheet.create({
  modalContainer:{
    flex:1,
    justifyContent:'center',
    alignItems: 'center',
    backgroundColor:'rgba(0, 0, 0, 0.5)'
  },
  modalContent:{
    backgroundColor:'#ddd',
    borderTopLeftRadius:5,
    borderTopRightRadius:5
  },
  codeimg:{
    width:150,
    height:150
  }
});