/* Image* 用于显示图片的组件,包括网络图片,静态资源 * 经常使用性能: * resizeMode 图片适应模式 cover , contain , stretch * source 图片的引用地址 * * iOS支持的属性: onLoad , onLoadEnd ,onLoadStart, onProgress * * 练习:显示两张图片,分别是网络图片,静态资源 * https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1512489433426&di=fcc41e3d4a372da2f5098d0f121d5224&imgtype=0&src=http%3A%2F%2Fimg1c.xgo-img.com.cn%2Fpics%2F1538%2Fa1537493.jpg** */export default class App extends Component<> { render() { return ( <View style={styles.container}> <View style={styles.net}> <Image style={styles.netImage} source={{url:"https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1512489433426&di=fcc41e3d4a372da2f5098d0f121d5224&imgtype=0&src=http%3A%2F%2Fimg1c.xgo-img.com.cn%2Fpics%2F1538%2Fa1537493.jpg"}} /> </View> <View style={styles.local}> <Image style={styles.localImage} source={require("image!图片的名字")}//固定写法image! 在叹号后面写"图片的名字" /> </View> </View> ); }}var styles = StyleSheet.create({ container:{ flex:1, margin:25, alignItems:"center" }, net:{ marginTop:30, width:300, height:300, justifyContent:"center", alignItems:"center", backgroundColor:"cyan" }, netImage:{ width:280, height:200, backgroundColor:"gray" }, local:{ marginTop:30, width:300, height:300, justifyContent:"center", alignItems:"center", backgroundColor:"yellow" }, localImage:{ width:280, height:200, backgroundColor:"gray" },});