如何在React Native中显示图像的顶部，

Question

这是我现在的情况，我的形象是这样的

这是我当前的代码

<View>
      <Image
        style={{width: '100%', height: 285}}
        source={{
          uri: `${posterPath + data?.poster_path}`,
        }}
        resizeMode="cover"
      />

      <Text>{data?.title}</Text>
    </View>

我希望我的图像看起来像这样

（这只是一个例子）

我知道在普通的CSS中我们是否可以使用object-position，但不幸的是React Native并不直接支持object-positionCSS属性，所以我很困惑如何实现这个

Answer 1

您需要使用 Flex:1，它使用整个屏幕，然后相应地定位和调整图像大小。

<View style={{flex:1}}>
      <Image
        style={{width:'100%', height:285}}
        source={{
          uri: `${posterPath + data?.poster_path}`,
        }}
        resizeMode="cover"
      />

      <Text>{data?.title}</Text>
    </View>