React Native 加载图片

效果图如下

import React, { Component } from 'react';

import {
  Text,Image,StyleSheet,View
} from 'react-native';

/*获得屏幕的宽和高需要导入的Dimensions包*/
var Dimensions = require('Dimensions');

export default class HelloWorldApp extends Component {
    render() {
        let pic = {
            uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg'
        };
        return (
            
              
              Hello
            

        );
    }
}
/*获得屏幕宽度*/
let Screen_width = Dimensions.get('window').width;

const styles = StyleSheet.create({

    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF',
    },

    picStyle: {
      width:Screen_width,
        height:3*Screen_width/4.0,
    },

    helloTextStyle: {
        fontSize: 20,
        textAlign: 'center',
        margin: 10,
    },

});