なぜ入力フィールドがアンドロイドで全幅を表示しないのですか？

Question

私はreact-nativeを使用しています。私の入力フィールドはフルで表示されませんwidthなぜですか？しかし、IOSをチェックすると、入力フィールドを全幅で正しく表示できます。 はここhttps://rnplay.org/apps/aHRkHA

import React from 'react'; 
import { 
    registerComponent, 
} from 'react-native-playground'; 
import { 
    StatusBar, 
    StyleSheet, 
    Text, 
    TextInput, 
    View, 
} from 'react-native'; 

class App extends React.Component { 
    render() { 
    return (
      <View style={styles.container}> 

       <Text style={styles.heading}> Login</Text> 
       <TextInput 
        style={styles.loginInput} 
        placeholder="Type here to translate!" 
       /> 
      </View> 
    ); 
    } 
} 

const styles = StyleSheet.create({ 
    container: { 
     backgroundColor: '#EF501E', 
     flex: 1, 
     alignItems: 'center' 
    }, 
    logo: { 
     width: 50, 
     height: 50 
    }, 
    heading: { 
     fontSize: 30, 
     marginTop: 20 
    }, 
    loginInput: { 
     height: 50, 
     borderWidth: 1, 
     borderColor: '#33090C', 
     flexDirection: 'row', 
     justifyContent: 'center', 
    } 
}); 

registerComponent(App); 

Answer 1

私のコード ある<TextInput>ためalignSelf: 'stretch'を持つ親のalignItems: 'center'をオーバーライドしてみてください。

<View style={styles.container}> 
    ... 

    <View style={{alignSelf: 'stretch'}}> 
    <TextInput 
     style={styles.loginInput} 
     placeholder="Type here to translate!" 
    /> 
    </View> 
</View>