React native:当我使用Swiper模块时,不能在Android中获取图像

时间:2017-02-22 11:53:20

标签: react-native

我正在开发示例应用程序,我在ios中获得了图像,但我没有得到Android

我正在使用此模块import Swiper from 'react-native-swiper'; 这是我的代码:

    constructor(props){
        super(props);
        this.state = {
          ListImages:[{img:require('./../images/Scrolling Ticker/slider1.png')},
          {img:require('./../images/Scrolling Ticker/slider2.png')},
          {img:require('./../images/Scrolling Ticker/slider3.png')},
          {img:require('./../images/Scrolling Ticker/slider4.png')},
          {img:require('./../images/Scrolling Ticker/slider5.png')},
          {img:require('./../images/Scrolling Ticker/slider6.png')},
          {img:require('./../images/Scrolling Ticker/slider7.png')},
          {img:require('./../images/Scrolling Ticker/slider8.png')},
          {img:require('./../images/Scrolling Ticker/slider9.png')}]
        }
      }

                      <Swiper showsButtons={true} autoplay={false} horizontal={true}>
                        {
                          this.state.ListImages.map((pics, key)=>{
                            return <Image source = {pics.img} style={{width:windowSize.width,height:windowSize.height}}/>
                          })
                        }     
                      </Swiper>

             </View> 
**Styels here:**

var styles = StyleSheet.create({

body:{
    flex:0.85
  }
})

所以我在React原生的swiper中有一个图像但在android中没有得到图像。

1 个答案:

答案 0 :(得分:1)

更改

<Image source = {pics.img} style={{width:windowSize.width,height:windowSize.height}}/>

<Image source = {{pics.img}} style={{width:windowSize.width,height:windowSize.height}}/>

希望这会有用

这是我在我的应用中实现的方式

<Swiper style={styles.wrapper} 
    height={height/1.5}
    showsButtons={false} 
    autoplay={true}
    dot ={
           <View style={{width: 12, height: 12,borderRadius: 6, marginLeft: 3, marginRight: 3, marginTop: 3, marginBottom: 3,borderColor:'#048d81', borderWidth:1}} />
       }
       activeDot ={
           <View style={{backgroundColor: '#048d81', width: 12, height: 12,borderRadius: 6, marginLeft: 3, marginRight: 3, marginTop: 3, marginBottom: 3,borderColor:'#048d81', borderWidth:1}} />
       }>
       <View style={{alignItems:'center'}}>
         <Image source={require('./images/bg-four.png')} style={{resizeMode:'contain', height:height/2.1, width:width-40}}/>
         <Text style={{fontSize:16,color:'#048d81',fontFamily:'Lato-Heavy',paddingLeft:20,paddingRight:20}}>
          {"India's first Broker - Developer network"} 
         </Text>
       </View>

       <View style={{alignItems:'center'}}>
         <Image source={require('./images/bg-three.png')} style={{resizeMode:'contain', height:height/2.1, width:width-40}}/>
         <Text style={{fontSize:16,color:'#048d81',fontFamily:'Lato-Heavy',paddingLeft:20,paddingRight:20,textAlign:'center'}}>
         Get latest project updates straight from builders
         </Text>
       </View>

       <View style={{alignItems:'center'}}>
         <Image source={require('./images/bg-one.png')} style={{resizeMode:'contain', height:height/2.1, width:width-40}}/>
         <Text style={{fontSize:16,color:'#048d81',fontFamily:'Lato-Heavy'}}>
          We connect brokers to builders
         </Text>
       </View>

</Swiper>