React Native의 ScrollView에서 contentInset 및 contentOffset을 설정하십시오.

Question

콘텐츠가 React Native의 맨 위에서 100 픽셀 시작되도록하려고합니다. 나는

const OFFSET = 100 
const ScrollViewTest = (props) => (
    <ScrollView 
    contentInset={{ top: OFFSET }} 
    contentOffset={{ y: OFFSET }} 
    > 
    <Text>Test</Text> 
    </ScrollView> 
) 

으로 시도하지만 화면을 렌더링 할 때, 그것은 0 픽셀에서 시작,하지만 난 조금 이동하면, 그것은 정상에서 100 픽셀로 스크롤이 유지됩니다.

그래서 React Native가 초기화시 contentOffset 및 contentInset 속성을 트리거하지 않습니다.

어떻게 해결할 수 있습니까? 또한 변경하지 않고 automaticallyAdjustContentInsets={false} 설정을 시도했습니다.

또한이 속성은 iOS 전용입니다. Android와 비슷한 속성이 있습니까?

Answer 1

패딩 같은 효과 :

const OFFSET = 100 
const ScrollViewTest = (props) => (
    <ScrollView> 
     <View style={{ height: OFFSET }} /> 
     <Text>Test</Text> 
    </ScrollView> 
) 

헤더 같은 효과 :

const OFFSET = 100 
const ScrollViewTest = (props) => (
    <View style={{ paddingTop: OFFSET }}> 
     <ScrollView> 
      <Text>Test</Text> 
     </ScrollView> 
    </View > 
) 

Answer 2

componentDidMount(){ 
     if(Platform.OS==='ios'){ 
      this.refs._scrollView.scrollToOffset({animated:false,offset:-OFFSET}); 
     } 
    } 

    render(){ 
     return(
      <ScrollView 
       ref="_scrollView" 
       contentInset={{top: OFFSET}} 
      ...> 
       ... 
      </ScrollView> 
     ) 
    }