2017-03-28 11 views
1

왼쪽에서 오른쪽으로 각각 2 초씩 슬라이드하는 4 개의 이미지로 구성된 배경을 만들고 싶습니다. 이미지를 로컬에 저장했습니다. 나는 그것을 어떻게 달성 할 수 있는지 알 수 없다.React Native에서 슬라이드 배경 이미지

시간 내 주셔서 감사합니다.

Chris.

+0

사용 나는 배경이 자동으로 변경하는 것 수평 스크롤 뷰 https://facebook.github.io/react-native/docs/scrollview.html – JainZz

+0

. ScrollView tho 문서에서 이러한 속성을 볼 수 없습니다. – misi06

답변

1

다음은 질문에 대한 샘플 로직입니다.

const { width, height } = Dimensions.get('window'); 
export default class CustomApp extends Component { 

    componentDidMount() { 
    let scrollValue = 0; 
    setInterval(function(){ 
     scrollValue = scrollValue + width; // width = screen width 
     _scrollView.scrollTo({x: scrollValue}) 
    }, 3000); 
    } 
    render() { 
    return (
    <View> 
     <ScrollView 
     ref={(scrollView) => { _scrollView = scrollView; }} 
     horizontal={true} pagingEnabled={true} 
     > 
      <Image source={require('./1.jpg')} style={{height, width}} /> 
      <Image source={require('./2.jpg')} style={{height, width}} /> 
      <Image source={require('./1.jpg')} style={{height, width}} /> 
      <Image source={require('./2.jpg')} style={{height, width}} /> 
     </ScrollView> 
     <View style={{ position: 'absolute'}}> 
     <Text>Page Content</Text> 
     </View> 
    </View> 
    ); 
    } 
} 
+0

좋아요! 도움을 주셔서 감사합니다, 이것이 정말로 필요한 것입니다. 이 그림들로 무한 루프를 만들 수있는 방법이 있습니까? – misi06

+0

4 개의 이미지가로드 될 때 scrollView에 대해 contentOffset을 x : 0으로 설정하려고합니다 ... 구현하지 않았습니다. 그것을 확인하고 그 결과를 확인하십시오 ... – JainZz

관련 문제