首页 文章

如何设置TextInput的宽度以匹配父级，而父级的alignItems = 'center'？

提问于
浏览 次
0

我在View中有一个TextInput，它有alignItems ='center' . 使用此设置，TextInput将获取TextInput中文本类型的长度 .

<View style={{
        flex: 1,
        alignItems: 'center',
        justifyContent: 'center'
    }} >
        <TextInput />
        <Text>This is React Native</Text>
    </View>

屏幕截图如下

enter image description here

enter image description here

而我想要实现的是将子项对齐在中心，并且还拉伸TextInput的宽度以匹配父项

就像在这张图片中一样

enter image description here

如何在本机中做到这一点？

react-native flexbox alignment

2 回答

  • 1
    <View style={{
    flex: 1,
    justifyContent: 'center'
}} >
    <TextInput />
    <Text style={{
      alignSelf:'center'
   }}>This is React Native</Text>
</View>

    用你的代码替换上面的代码 .

    回复于
  • 1
    Import {Dimensions} from 'react-native';

var { height, width } = Dimensions.get('window');

<TextInput style={styles.textInput}/>

const styles = StyleSheet.create({
  textInput:{
    width:width;
  },  })
    回复于

相关问题