javascript - 在 React Native 中垂直对齐文本

Question

我想在图片中制作这样的文字。但是我的文字没有垂直居中。如何实现？

到目前为止我所做的是

<Fragment>
     <HeaderMain navigation={navigation}/>
     <View style={styles.subheader}>
       <Text style={styles.topText}>Заказы</Text>
     </View>
</Fragment>

样式

container: {
    flex: 1,
    paddingHorizontal: 8,
    paddingVertical: 7,
    backgroundColor: '#E5E5E5',
},
subheader:{
    height: 55,
    backgroundColor: '#ffffff',
    flexDirection: 'column',
},
topText:{
    fontWeight: "bold",
    fontSize: 17,
    lineHeight:21,
    fontFamily: MONREGULAR,
    marginLeft: 16,
    justifyContent: 'center',
    alignItems: 'center',
},

Answer 1

您不应在 Text 中使用 justifyContent、alignItems。您应该在 View 中使用它。还为 lineHeight 提供与 fontSize 相同的值。像这样；

subheader:{
    height: 55,
    backgroundColor: '#ffffff',
    flexDirection: 'column',
    justifyContent: 'center',
},

topText:{
    fontWeight: "bold",
    fontSize: 17,
    lineHeight: 21,
    fontFamily: MONREGULAR,
    marginLeft: 16,
},