React-Native初学者Image布局

React-Native中的图片布局和web或者H5有比较大的差别。

主要有resizeMode:'stretch' || 'contain' || 'cover'（该属性只能加在Image标签上，加在其他标签上没有作用，也不会报错，但会有warning）。

resizeMode在未设置Image标签的宽高则无效。本实验是以width:375,height:667，即占满整个iPhone6屏幕。

好，一个个讲讲这仨resizeMode。

stretch：不按原图宽高比例，而按照设置的宽高拉伸。

cover:按照原图大小展示，在容器（整个屏幕）里只显示原图的左上角的一部分。

contain:按照原图的宽高比例，根据Image设置的宽高中比例较小的缩小图片展示。

而且Image标签的source有些蛋疼的是require的方式不允许动态地址如require(this.state.url)。

var url = null;

switch (this.props.id){
            case './images/1.jpg':
            url = require('./images/1.jpg');
            break;
            case './images/2.jpg':
            url = require('./images/2.jpg');

}如果几个图片的话，简单的用switch方式可以解决。