我希望能够底部对齐图像使用图像或ImageBackground，但一直没有成功这样做。
<View style={styles.moduleHeader}>
<ImageBackground
style={styles.image}
source={{ uri: image }}
resizeMode="cover">
<Text>text</Text>
</ImageBackground>
</View>
moduleHeader: {
height: 200,
},
image: {
width: Layout.viewport.width, //device width
height: 200,
position: "absolute",
bottom: 0,
},其他尝试包括负上边距和填充。
我还在纵横比上做了手脚，但这需要一个更精确的数字，我不需要那种精度。
绝对和底部的包含没有影响，我可以告诉...基本上我想模仿background-position: center bottom;在CSS中的效果。
我不介意图像是否被水平裁剪，只是图像的底部与容器的底部对齐。
我还不能确定这在React-Native中是可能的，所以确认这个理论将构成一个正确的答案。
一如既往，任何和所有方向都非常赞赏，所以提前感谢！
2条答案
按热度按时间kmbjn2e31#
您需要从ImageBackground样式中删除位置和底部标签，并添加到View样式中
就像这样
请检查此小吃博览会代码
https://snack.expo.io/@vishal7008/again-bottom-ui
kqqjbcuj2#
我想这可能太老了，但我确实在网上找到了这个，因为我现在在同一条船上object-fit
如果这个链接死了，两个重要的属性是对象适合和对象位置，我正在尝试调整我正在制作的2D游戏的图像剪辑方式，所有图像的左上角都自然地以图形方式对齐会使它变得困难，这似乎有助于快速移动，直到看起来漂亮。Idk如果它适合您的情况（如果仍然相关）