是否可以在 2 个文本对象之间画一条垂直线?我对此进行了调查,但这并不是我所需要的:
https://reactjsexample.com/draw-a-line-between-two-elements-in-react/
<View style={styles.ridesFriends}>
<Text style={styles.numbers}>132 </Text>
<Text style={styles.numbers}>{numberOfFriends}</Text>
</View>
ridesFriends: {
paddingTop: 70,
alignItems: 'center',
flexDirection: 'row',
justifyContent: 'space-evenly',
width: '100%',
},
numbers: {
fontSize: 30,
color: '#31C283',
fontWeight: 'bold',
},
编辑:
我尝试在两个数字之间添加一个 View :
verticleLine:{
height: '100%',
width: 1,
backgroundColor: '#909090',
},
<View style={styles.ridesFriends}>
<Text style={styles.numbers}>132</Text>
<View style={styles.verticleLine}></View>
<Text style={styles.numbers}>{numberOfFriends}</Text>
</View>
但它不在中心
最佳答案
一种方法是创建一个 View ,然后给它一个 height of 100%
, width of 1px
和 background-colour
.然后继续将此 View 放置在两个元素之间。
<View style={styles.ridesFriends}>
<Text style={styles.numbers}>132</Text>
<View style={styles.verticleLine}></View>
<Text style={styles.numbers}>2</Text>
</View>
ridesFriends: {
paddingTop: 70,
alignItems: 'center',
flexDirection: 'row',
justifyContent: 'space-evenly',
width: '100%',
marginBottom: 20,
},
numbers: {
fontSize: 30,
color: '#31C283',
fontWeight: 'bold',
},
verticleLine: {
height: '100%',
width: 1,
backgroundColor: '#909090',
}
关于javascript - 在两个对象之间画一条垂直线,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62418215/