React Native：なぜ、justifyContentとalignItemsが子のために動作しないのですか？<View/>？

Question

React Nativeでは、私は別のビューの中に子ビューを持っていますが、ページの真ん中にはありません。しかし、子ビューが親ビューの中に単独で存在しない場合、それはページの真ん中でうまくいきます。

子ビューが別のビュー（parentView）内にある間にページの中央にくるようにするにはどうすればよいですか？ここで

はコードです：

render() { 

    return (
     <View id="parentView"> 
      <View 
      id="childView" 
      style={ 
       flex: 1, 
       justifyContent: 'center', 
       alignItems: 'center', 
      } 
      > 
      <Text>Center This to Middle of Page</Text> 
      </View> 
      <View 
      id="childViewTwo" 
      > 
      <Text>Don't center me</Text> 
      </View> 
     </View> 
    ); 
    } 

Answer 1

ちょうどあなたの親ビューにflex:1を追加します。私はあなたのために働い例を作った：ありがとう@antseburova https://rnplay.org/apps/zHO1YA

return (
     <View id="parentView" style={{flex: 1}}> 
      <View 
      id="childView" 
      style={{ 
       flex: 1, 
       justifyContent: 'center', 
       alignItems: 'center', 
      }} 
      > 
      <Text>Center This to Middle of Page</Text> 
      </View> 
      <View 
      id="childViewTwo" 
      > 
      <Text>Don't center me</Text> 
      </View> 
     </View> 
    );