2017-05-18 4 views
0

私はreact-native-swiperを使用していますが、私の問題の解決策はドキュメントで見つかりませんでした。現在は、一度に1枚の写真が表示されます。しかし、私は半分が欲しい、そして常に一つずつスライドします。スライドが厳密な幅を持っているので、何とか可能ですか?私はachiveなるかネイティブスワイパーの複数のイメージに反応します

デザイン:

enter image description here

私の現在のコードがあります:

class Featured extends Component { 
    /** 
    * Render the featured box 
    */ 
    renderFeatured() { 
     return this.props.featured.data.items.map(object => (
       <View style={styles.slide} key={object.id}> 
        <FeaturedBox 
         id={object.id} 
         image={Helpers.getPrimaryImage(object.images)} 
         text={object.name} 
        /> 
       </View> 
      ) 
     ); 
    } 

    render() { 
     if (Helpers.isObjectEmpty(this.props.featured)) { 
      return (
       <View /> 
      ); 
     } 
     return (
      <View> 
       <Swiper 
        style={styles.wrapper} 
        height={150} 
        horizontal={false} 
        showsPagination={false} 
       > 
        {this.renderFeatured()} 
       </Swiper> 
      </View> 
     ); 
    } 
} 

const styles = StyleSheet.create({ 
    wrapper: { 
    }, 
    slide: { 
     flex: 1, 
     justifyContent: 'center', 
     alignItems: 'center', 
    } 
}); 

基本的FeaturedBoxは単なる画像です。

答えて

0

解決策が見つかりました。スワイパをCarouselに変更しました。

0

これは次のコードで行うことができます。

<Swiper removeClippedSubviews={false}> 

<View style={{width: screenWidth - 100}}></View> 

<View style={{marginLeft: - 100}}> </View> 

</Swiper> 
関連する問題