/*  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"
}, });

Image组件的更多相关文章

  1. ExtJS 4.2 评分组件

    上一文章是扩展ExtJS自带的Date组件.在这里将创建一个评分组件. 目录 1. 介绍 2. 示例 3. 资源下载 1. 介绍 代码参考的是 Sencha Touch 2上的一个RatingStar ...

  2. react组件的生命周期

    写在前面: 阅读了多遍文章之后,自己总结了一个.一遍加强记忆,和日后回顾. 一.实例化(初始化) var Button = React.createClass({ getInitialState: f ...

  3. react-router 组件式配置与对象式配置小区别

    1. react-router 对象式配置 和 组件式配置    组件式配置(Redirect) ----对应---- 对象式配置(onEnter钩子) IndexRedirect -----对应-- ...

  4. Angular2入门系列教程3-多个组件,主从关系

    上一篇 Angular2项目初体验-编写自己的第一个组件 好了,前面简单介绍了Angular2的基本开发,并且写了一个非常简单的组件,这篇文章我们将要学会编写多个组件并且有主从关系 现在,假设我们要做 ...

  5. Angular2入门系列教程2-项目初体验-编写自己的第一个组件

    上一篇 使用Angular-cli搭建Angular2开发环境 Angular2采用组件的编写模式,或者说,Angular2必须使用组件编写,没有组件,你甚至不能将Angular2项目启动起来 紧接着 ...

  6. .NET Core 首例 Office 开源跨平台组件(NPOI Core)

    前言 最近项目中,需要使用到 Excel 导出,找了一圈发现没有适用于 .NET Core的,不依赖Office和操作系统限制的 Office 组件,于是萌生了把 NPOI 适配并移植到 .NET C ...

  7. .NetCore中的日志(1)日志组件解析

    .NetCore中的日志(1)日志组件解析 0x00 问题的产生 日志记录功能在开发中很常用,可以记录程序运行的细节,也可以记录用户的行为.在之前开发时我一般都是用自己写的小工具来记录日志,输出目标包 ...

  8. BootStrap_02之全局样式及组件

    1.BootStrap指定的四种屏幕尺寸: ①超大PC屏幕--lg(large):w>=1200px: ②中等PC屏幕--md(medium):1200px>w>=992px: ③P ...

  9. ExtJS 4.2 组件介绍

    目录 1. 介绍 1.1 说明 1.2 组件分类 1.3 组件名称 1.4 组件结构 2. 组件的创建方式 2.1 Ext.create()创建 2.2 xtype创建 1. 介绍 1.1 说明 Ex ...

  10. ExtJS 4.2 组件的查找方式

    组件创建了,就有方法找到这些组件.在DOM.Jquery都有各自的方法查找元素/组件,ExtJS也有自己独特的方式查找组件.元素.本次从全局查找.容器内查找.form表单查找.通用组件等4个方面介绍组 ...

随机推荐

  1. Reading RxJava Marble Diagrams

    ------>表示一个Observable(承时间推移,由左入右,左边item先发射) ------>上面的图形,表示这个Observable发射的item ------>上的的|( ...

  2. Tarjan的强连通分量算法

    Tarjan算法用于寻找图G(V,E)中的所有强连通分量,其时间复杂度为O(|V|+|E|). 所谓强连通分量就是V的某个极大子集,其中任意两个结点u,v在图中都存在一条从u到v的路径. Tarjan ...

  3. FZU2282 Wand

    题意 n个数字,要求至少k个数字位置不变,其余进行错排的方案数 分析 错排公式: D(n)=(n-1)[D(n-2)+D(n-1)]  如果n个数字,i个数字位置不变,其余进行错排的的方案数是C(n, ...

  4. sql去除重复记录 且保留id最小的 没用

    第一步:查询重复记录   SELECT * FROM TableName   WHERE RepeatFiled IN (   SELECT RepeatFiled   FROM TableName ...

  5. hdu 2553 N皇后问题(一维数组详尽解释)

    //一维数组解法(注释详尽)//num皇后可以表示第num列,然后枚举num皇后所在的行//二维数组对角线转换为坐标的关系#include<stdio.h> #include<str ...

  6. Linux网络编程IPv4和IPv6的inet_addr、inet_aton、inet_pton等函数小结(转)

    原文:http://blog.csdn.net/ithomer/article/details/6100734 知识背景: 210.25.132.181属于IP地址的ASCII表示法,也就是字符串形式 ...

  7. Oracle 触发器 删除操作时再查询本表数据 功能不正确

    背影如下: 表名,WFGTEST create table WFGTEST ( NAME1 ) not null, NAME2 ), CAPACITY ,) ) 表结构如下: NAME1 NAME2 ...

  8. sql server重建系统数据库

    方法一:https://bbs.csdn.net/topics/100013082 方法二:http://blog.51cto.com/jimshu/1095780 *** 方法三:https://b ...

  9. SQL server T-sql语句查询执行顺序

    前言 数据库的查询执行,毋庸置疑是程序员必备的技能之一,然而数据库查询执行的过程绚烂多彩,却是很少被人了解,今天我们来深入了解下sql查询的来龙去脉,为查询的性能优化打个基础 这篇博客,摒弃查询优化性 ...

  10. Kotlin when 流程判断

    如果学过C或者java C#等语言. 一定熟悉SWITCH这个流程判断 但是在kotlin中却没有这个.而是 使用了When来代替. 当什么时候. 下面我觉一个简单的例子: import java.u ...