一行展示2个控件,一个居右,一个居中,类似下图这种
image.png
现在最外面设置一个横向布局,中间的控件居中用justifyContent和alignItems展示,右边的控件居右,使用绝对布局,right: 4,距离右边边缘4个单元
代码如下:
<View
style={{
backgroundColor: "#fff",
height: 40,
flexDirection: "row",
// justifyContent: "space-around",
}}
>
<View
style={[
{
justifyContent: "center",
alignItems: "center",
flex:1
},
]}
>
<Text
style={{
fontWeight: "bold",
fontSize: 13,
textAlign: "center",
}}
numberOfLines={2}
>
{'测试'}
</Text>
</View>
<View style={{
justifyContent: "center",
alignItems:'center',
right: 4,
position: 'absolute',
}}>
<Image
source={imageDown}
style={{ height: 20, width: 20,marginLeft:20 }}
></Image>
</View>
</View>
网友评论