你如何适应原生的反应？

Posted 2021-05-06

//如何在不丢失宽高比的情况下将图像设置在屏幕顶部？

[![import React, { Component } from 'react';
    import { AppRegistry, View, Image, StyleSheet } from 'react-native';
    export default class DisplayAnImageWithStyle extends Component {
      render() {
        return (
          <View style={{flex:1}}>
            <Image
              resizeMode="contain"
              style={{flex:1}}
              source={{uri: 'https://i.pinimg.com/originals/ba/84/1c/ba841cc07934b508458a7faea62141a8.jpg'}}
            />
          </View>
        );
      }
    }

    // Skip these lines if you are using Create React Native App.
    AppRegistry.registerComponent(
      'DisplayAnImageWithStyle',
      () => DisplayAnImageWithStyle
    );][1]][1]

//这里喜欢的图片显示它不合适......它没有从顶部显示...你知道如何设置图像而不用任何填充吗？ [1]：https://i.stack.imgur.com/LYNKn.png

答案

所以你可能想要使用高度和宽度的resizeMode: 'cover'。

<Image
  resizeMode="contain"
  style={{ width: 200, height:220, resizeMode: 'cover'}}
  source={{uri: 'https://i.pinimg.com/originals/ba/84/1c/ba841cc07934b508458a7faea62141a8.jpg'}}
 /> 

这是https://snack.expo.io/HJTFg9tU4的一个例子

如果这对您有用，请告诉我。