React Native - 特定のセクションに到達したときにステータスバーの色を変更します。

Question

アプリケーションの特定のセクションに到達したときにStatusBarのbackgroundColorプロパティを変更するにはどうすればよいですか？

例：私はView（Section）を持っています。デフォルトのbackgroundColorは赤です。そのセクションまでスクロールすると、StatusBar backgroundColorを青に変更します。 （：私はネイティブベースを使用してい注）：

は、ここで私はそれをしたいコンポーネントの

  <Container> 
      <StatusBar backgroundColor='#2c3e50' barStyle='dark-content' /> 
      <Content> 
       <Grid> 
        <Col> 
         <Row> 
          <Text> 
           App title name 
          </Text> 
         </Row> 
        </Col> 
        <Row> 
         <Col> 
          <Text> 
           Random description 
          </Text> 
         </Col> 
        </Row> 
        <Col> 
         <Row> 
          <Text> 

          </Text> 
         </Row> 
        </Col> 
        <Row> 
         <Col style={{padding: 20, backgroundColor: '#2980b9'}}> 
          <Text style={{color: 'white', textAlign: 'justify'}}> 
           Random text 
          </Text> 
          <Text style={{ color: 'white', paddingTop: 10, textAlign: 'justify'}}> 
           More random text 
          </Text> 
         </Col> 
        </Row> 
        <Row> 
         <Col style={{backgroundColor: '#1abc9c'}}> 
          <Text style={{color: 'white', fontSize: 40, textAlign: 'center'}}> 
           Chocolate 
          </Text> 
         </Col> 
        </Row> 
        <Row> 
         <Col> 
          <Text> 
           Random txt 
          </Text> 
         </Col> 
        </Row> 
       </Grid> 
      </Content> 
     </Container> 

Answer 1

まずScrollViewreac-nativeコンポーネントとContentを交換してください。状態に背景色を追加し、ScrollViewが特定の位置で反応したときに背景色を更新します。 onScroll機能を使用して、ScrollViewの位置を検出します。

注：Contentネイティブ・ベース成分がScrollViewreac-nativeコンポーネントと類似している場合、その後、あなたはそれを交換する必要はありません。私は経験がありませんnative-base