时间戳

首页 > 解决方案 > 图像未在其容器 React Native 顶部对齐

react-native - 图像未在其容器 React Native 顶部对齐

问题描述

我正在尝试在其容器顶部对齐图像以响应本机，尤其是在横向上。

<View style={{flexDirection: 'row', justifyContent: 'center',alignItems: 'center'}}>
    <View style={{flex:1,backgroundColor: 'green'}} >
      <Image resizeMode='contain'style={{ flex:1,width:"100%",height:"100%"}} source={{uri:"https://www.tageblatt.lu/wp-content/uploads/2020/09/250112_cx__cy__cw__ch_-1-739x493.jpeg"}}   />
    </View>
    <View style={{width:"15%",backgroundColor: 'blue' }}>
      <Text style={{color:"white",padding:7}}>{caption}</Text>
    </View>
</View>

这段代码的输出是：

在此处输入图像描述

在风景上：

在此处输入图像描述

所需的输出是：

在此处输入图像描述

如果我在我的编辑器上按 control+s（保存），我会进入横向。 我遵循这个问题，但对我没有解决方案。我也为 resizeMode 尝试了不同的值。

标签： react-native

解决方案

你试过改变resizeMode吗？

<Image resizeMode='cover' ... />

推荐阅读