Image组件
/* 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组件的更多相关文章
- ExtJS 4.2 评分组件
上一文章是扩展ExtJS自带的Date组件.在这里将创建一个评分组件. 目录 1. 介绍 2. 示例 3. 资源下载 1. 介绍 代码参考的是 Sencha Touch 2上的一个RatingStar ...
- react组件的生命周期
写在前面: 阅读了多遍文章之后,自己总结了一个.一遍加强记忆,和日后回顾. 一.实例化(初始化) var Button = React.createClass({ getInitialState: f ...
- react-router 组件式配置与对象式配置小区别
1. react-router 对象式配置 和 组件式配置 组件式配置(Redirect) ----对应---- 对象式配置(onEnter钩子) IndexRedirect -----对应-- ...
- Angular2入门系列教程3-多个组件,主从关系
上一篇 Angular2项目初体验-编写自己的第一个组件 好了,前面简单介绍了Angular2的基本开发,并且写了一个非常简单的组件,这篇文章我们将要学会编写多个组件并且有主从关系 现在,假设我们要做 ...
- Angular2入门系列教程2-项目初体验-编写自己的第一个组件
上一篇 使用Angular-cli搭建Angular2开发环境 Angular2采用组件的编写模式,或者说,Angular2必须使用组件编写,没有组件,你甚至不能将Angular2项目启动起来 紧接着 ...
- .NET Core 首例 Office 开源跨平台组件(NPOI Core)
前言 最近项目中,需要使用到 Excel 导出,找了一圈发现没有适用于 .NET Core的,不依赖Office和操作系统限制的 Office 组件,于是萌生了把 NPOI 适配并移植到 .NET C ...
- .NetCore中的日志(1)日志组件解析
.NetCore中的日志(1)日志组件解析 0x00 问题的产生 日志记录功能在开发中很常用,可以记录程序运行的细节,也可以记录用户的行为.在之前开发时我一般都是用自己写的小工具来记录日志,输出目标包 ...
- BootStrap_02之全局样式及组件
1.BootStrap指定的四种屏幕尺寸: ①超大PC屏幕--lg(large):w>=1200px: ②中等PC屏幕--md(medium):1200px>w>=992px: ③P ...
- ExtJS 4.2 组件介绍
目录 1. 介绍 1.1 说明 1.2 组件分类 1.3 组件名称 1.4 组件结构 2. 组件的创建方式 2.1 Ext.create()创建 2.2 xtype创建 1. 介绍 1.1 说明 Ex ...
- ExtJS 4.2 组件的查找方式
组件创建了,就有方法找到这些组件.在DOM.Jquery都有各自的方法查找元素/组件,ExtJS也有自己独特的方式查找组件.元素.本次从全局查找.容器内查找.form表单查找.通用组件等4个方面介绍组 ...
随机推荐
- nodejs npm install -g 全局安装和非全局安装的区别
1. npm install xxx -g 时, 模块将被下载安装到[全局目录]中. [全局目录]通过 npm config set prefix "目录路径" 来设置. 比如说, ...
- 各大IT/IC公司offer比较
1:本人西电通院2013届毕业硕士,根据今年找工作的情况以及身边同学的汇总,总结各大公司的待遇如下,吐血奉献给各位学弟学妹,公司比较全,你想去的公司不在这里面,基本上是无名小公司了:但无名小公司有时也 ...
- JAVA基础知识总结15(集合容器)
集合框架:用于存储数据的容器. 1:对象封装数据,对象多了也需要存储.集合用于存储对象. 2:对象的个数确定可以使用数组,但是不确定怎么办?可以用集合.因为集合是可变长度的. 集合和数组的区别: 1: ...
- SQL Server误区30日谈 第26天 SQL Server中存在真正的“事务嵌套”
误区 #26: SQL Server中存在真正的“事务嵌套”错误 嵌套事务可不会像其语法表现的那样看起来允许事务嵌套.我真不知道为什么有人会这样写代码,我唯一能够想到的就是某个哥们对SQL Serve ...
- Deepin 2014.2正式版发布 - 自由·独特·前卫
感谢 deepin 的投递 deepin致力于为全球用户提供美观易用.安全可靠的Linux系统. deepin系统使用基于HTML5技术开发的深度桌面环境,搭配深度音乐.深度影院.WPS和搜狗输入法等 ...
- Luogu 4949 最短距离
这就是个水题. 一开始想把整个环找出来断开当一条链,然后其他部分正常链剖,两个点之间的路径如果经过环就考虑一下走哪边更快. 但是这样子还是太麻烦了. 我们可以直接断开环上的一条边,然后正常链剖,只要在 ...
- python文件处理os模块
一.os模块概述 Python os模块包含普遍的操作系统功能.如果你希望你的程序能够与平台无关的话,这个模块是尤为重要的.(一语中的) 二.常用方法 1.os.name 输出字符串指示正在使用的平台 ...
- Flask框架 之 学生管理分析
先看模板吧. index.html <body> <h1>学生列表</h1> <table border="1"> <thea ...
- HTML总结之:HTML5的DOCTYPE 与 meta 属性介绍
HTML5头部常用介绍: [DOCTYPE html] 声明文档类型为HTML5文件. [meta标签] <meta> 元素可提供有关页面的元信息(meta-information), ...
- C# Socket通信改进记录
1. Socket 使用原始Socket,Send和Recv方法 进行发送和消息获取.(另起后台线程 不停获取和发送) public void RecvMsg() { //receive messag ...