RN中Image

RN中图片的使用

图片分为很多种

静态图片的加载

source={require('./icon_my_pic.png')} 写上路径进行调用
可以进行设置图片的宽高。
可以为你的图片设置resizeMode 这个是就是图片的一种呈现缩放方式

• cover 默认的 保持图片宽高比的前提下，对图片进行缩放。知道宽度或者高度大于或者等于容器的尺寸。
• contain 保持图片宽高比的前提下。图片的宽高不大于外部Image的宽高。

• stretch 不保持图片的宽高

  
  QQ截图20170926204952.png
  

  比，进行对图片任意缩放。

• reapeat 在保证图片宽高比的情况下，对图片进行等比例的重复平铺图片，知道图片沾满这个容器。只有在ios上有效 android无效
• center 对图片进行居中，不回对图片进行其他的操作。

网络图片的加载

• 前提是必须要将图片设置宽和高 ，不然没办法完成渲染。
  上代码

<Image
                    style={{width:100,height:100,top:50}}
                    source={{uri:'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1506530199842&di=c8eade19712a7708cc1e97a1f9955fa7&imgtype=0&src=http%3A%2F%2Fpic2.ooopic.com%2F12%2F22%2F94%2F30b1OOOPIC5c.jpg'}}/>

加载原生的图片资源