我試圖將這兩個物體在整個設備上均勻地隔開。雖然以我目前的方式實施它,但空間均勻地呈現,但它通過文字將其隔開。我希望空間均勻地將其間距基于圖示。
我在這里提供了一個演示以及下面的代碼。
render() {
return (
<View
style={{
flexDirection: 'row',
top: 75,
justifyContent: 'space-evenly',
}}>
<View style={{ justifyContent: 'center', alignItems: 'center' }}>
<MaterialCommunityIcons
name="map-marker-radius-outline"
color="black"
size={50}>
</MaterialCommunityIcons>
<Text style={{ fontSize: 15 }}>
WORD
</Text>
</View>
<View style={{ justifyContent: 'center', alignItems: 'center' }}>
<MaterialCommunityIcons
name="star-outline"
color="black"
size={50}>
</MaterialCommunityIcons>
<Text style={{ fontSize: 15 }}>
WORD WORD
</Text>
</View>
</View>
);
}
}
uj5u.com熱心網友回復:
如果我理解您的問題,您需要兩個元素在可用寬度上占用相同的空間。為此,您必須將 flex: 1 添加到您的兩個內部視圖中
<View style={{ justifyContent: 'center', alignItems: 'center', flex: 1 }}>
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/386483.html
上一篇:箭頭函式不通知redux狀態變化
