реагировать на передачу данных на другой экран - PullRequest
1 голос
/ 26 мая 2020

Я новичок, чтобы реагировать на родной язык. Я хочу, чтобы в моем приложении было много изображений в каждом меню. Когда я нажимаю на изображение, я хочу просмотреть изображение в размере экрана. Дело в том, когда я нажимаю на каждое изображение, которое я хочу, чтобы оно было направлено на одну страницу и вызвало изображение оттуда .. как можно передать переменную изображения с разных страниц на одну страницу .. до сих пор визуализация одной страницы изображения была такой, как показано ниже:, когда компонент изображения включен, он просматривает только первое изображение, а не другое. Какое решение?

render() {
 this.state.incident = this.props.navigation.getParam('incidents','hi!!');
    this.state.tenantattachedagreement = this.props.navigation.getParam('tenantattach','hi!!!')
    // this.state.residents = this.props.navigation.getParam('residents','');
    // this.state.tenantattachedagreement = this.props.navigation.getParam('attachedagreement','');
    // console.log("attached agreement",this.state.tenantattachedagreement);
    // incidents = this.props.navigation.getParam('incidents,'');
    // console.log("hello",attached);
    // console.log("l&f pic",this.state.lostfound);
    console.log("incidentpic",this.state.incident);
    console.log("tenantattach",this.state.tenantattachedagreement);

    // console.log("residents",this.state.residents);



    return (
       <View style={{flex:1}}>
             <StatusBar 
       barStyle = "light-content"
       hidden = {false}
       backgroundColor = "#32ACFD"
       translucent = {false}
       networkActivityIndicatorVisible = {true}
       /> 
        <View style={{flexDirection:'row',height:50,width:'100%',justifyContent:'center',alignItems:'center',backgroundColor:'#32ACFD',elevation:5,borderBottomWidth:1,borderColor:'#5b9bd5'}}>
             <TouchableOpacity onPress={()=>{this.props.navigation.goBack()}} style={{height:'100%',width:'12%',justifyContent:'center',alignItems:'center'}}>
               <Icon name="angle-left" style={{fontSize:25,color:'white'}}/>
             </TouchableOpacity>
             <TouchableOpacity onPress={()=>{this.props.navigation.navigate('DashBoard')}} style={{width:'33%',height:'100%',justifyContent:'center'}}>
               <Text style={{color:'white',fontSize:18,textShadowColor: 'grey',paddingLeft:'5%',fontWeight:'500',fontStyle:'normal',textShadowRadius:5,textShadowOffset: {width: -1, height: 1}}}>Smart Vitae</Text>
             </TouchableOpacity>
             <View style={{width:'35%',height:'100%',justifyContent:'center',alignItems:'center'}}>
                <Text style={{color:'white'}}>Unit: {this.state.unitname}</Text>
             </View>
             <TouchableOpacity onPress={()=>{this.props.navigation.navigate('Notification')}} style={{width:'10%',height:'100%',justifyContent:'center',alignItems:'center'}}>
                <Icon name="bell-o" style={{color:'white',fontSize:22}}/>
             </TouchableOpacity>
             <TouchableOpacity onPress={()=>{this.props.navigation.navigate('Settings')}} style={{width:'10%',height:'100%',justifyContent:'center',alignItems:'center'}}>
                 <Icon name="cog" style={{color:'white',fontSize:24}}/>
             </TouchableOpacity>
          </View>
        <View>
                <View style={{height:'100%',width:'100%',justifyContent:'center',alignItems:'center',borderColor:'#2E4053'}}>  

                              <Image source={{uri:this.state.residents}} style={{height:'100%',width:'100%'}}></Image>
                              <Image source={{uri:this.state.lostfound}} style={{height:'100%',width:'100%'}}></Image> 
                              <Image source={{uri:this.state.tenantattachedagreement}} style={{height:'100%',width:'100%'}}></Image> 
                              <Image source={{uri:this.state.incident}} style={{height:'100%',width:'100%'}}></Image>            
                </View>
        </View>                     

       </View>
    );
  }
}

1 Ответ

0 голосов
/ 26 мая 2020

Я считаю, что это проблема стиля, у вас есть несколько изображений, которые пытаются заполнить на 100%

<Image source={{uri:this.state.residents}} style={{height:'100%',width:'100%'}}></Image>

Попробуйте использовать flex или обновить свою высоту, например:

<Image source={{uri:this.state.residents}} style={{height:'25%',width:'100%'}}></Image>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...