我需要将所有这些元素置于屏幕中央,但是,当使用 justifyContent: "center"
时,什么也没有发生。
我删除了一些我认为不必要的代码。如果是这样,就说我会完整地发布它:
环境
- native react :0.60
- 设备:三星 S8+
代码
<View>
<Header style={{ backgroundColor: '#006bb3' }}>
<Left>
<Icon
name="arrow-left" type='MaterialCommunityIcons'
style={{ color: "#FFF" }}
onPress={() => this.props.navigation.navigate('HomeLogin')} />
</Left>
<Body>
<Title style={{color:'#FFF'}}>Entrar</Title>
</Body>
<Right />
</Header>
</View>
<View style={styles.container }>
<Image source={require('../assets/logo.png')} style={{width: 284, height: 76, marginBottom: 78}} />
<TextInput
placeholder="E-Mail"
style={styles.input}
/>
<TouchableOpacity style={styles.btn} activeOpacity={0.8}>
<LinearGradient start={{x: 0, y: 0}} end={{x: 1, y: 0}} style={styles.btn} colors={['#1aa3ff', '#006bb3']}>
<Text style={styles.textbtn}>
Entrar
</Text>
</LinearGradient>
</TouchableOpacity>
</View>
</View>
样式:
import { StyleSheet, Dimensions } from 'react-native';
container: {
alignItems:'center',
justifyContent:"center"
},
我希望内容在设备屏幕上垂直居中。
最佳答案
使用这个:
container: {
flex:1
alignItems:'center',
justifyContent:'center'
},
关于javascript - 在 View 中垂直居中元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57446600/