React 네이티브 텍스트가 오버플로되는 것을 방지하고 특정 너비 내에서 텍스트를 중앙에 맞추는 방법은 무엇입니까?

<View style={{flex: 1, flexDirection: 'column', justifyContent: 'flex-start', backgroundColor: 'grey'}}>
  <View style={{flex: 0.5, flexDirection: 'column', alignItems: 'center', backgroundColor: 'blue'}}>
    <View style={{flex: 0.3, flexDirection: 'column', alignItems: 'center', justifyContent: 'center', flexWrap: 'wrap', flexShrink: 1}}>
      <Text style={{backgroundColor: 'green', fontSize: 16, color: 'white', textAlign: 'center', flexWrap: 'wrap'}}>
        Here is a really long text that you can do nothing about, its gonna be long wether you like it or not, so be prepared for it to go off screen. Right? Right..!
      </Text>
    </View>
  </View>
  <View style={{flex: 0.5, flexDirection: 'column', alignItems: 'center', backgroundColor: 'orange'}}>
    <View style={{flex: 0.3, flexDirection: 'column', alignItems: 'center', justifyContent: 'center', flexWrap: 'wrap', flexShrink: 1}}>
      <Text style={{backgroundColor: 'green', fontSize: 16, color: 'white', textAlign: 'center', flexWrap: 'wrap'}}>
        Some other long text which you can still do nothing about.. Off the screen we go then.
      </Text>
    </View>
  </View>
</View>