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个方面介绍组 ...
随机推荐
- FastDFS介绍和配置过程 二
最近在研究负载均衡和集群,其中涉及到一个主要问题是,如何让集群中的real server共享一套文件系统.在网上查到FastDFS,国人(happy fish,感谢他的开源精神)开发的一套轻量级分 ...
- Luogu 4784 [BalticOI 2016 Day2]城市
斯坦纳树复习,我暑假的时候好像写过[JLOI2015]管道连接来着. 设$f_{i, s}$表示以$i$为根,$k$个重要点的连通状态为$s$,($0$代表没有连进最小生成树里面去,$1$代表连进了最 ...
- 用CSS3.0画圆
CSS3.0中有一个border-radius属性,这个属性允许向 div 元素添加圆角边框,也就是div边角不再一直是直角,在CSS3.0中可以做成圆角了,所以我们可以用这个属性用div画一个圆,或 ...
- jquery select 左右移动
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx. ...
- Entity Framework Tutorial Basics(43):Download Sample Project
Download Sample Project: Download sample project for basic Entity Framework tutorials. Sample projec ...
- bootstrap图片切换效果
<!DOCTYPE html><html lang="zh-cn"><head><meta charset="utf-8&quo ...
- requests基础
爬虫的基本原理:爬虫本质上是模拟人浏览信息的过程,只不过他通过计算机来达到快速抓取筛选信息的目的.所以我们想要写一个爬虫,最基本的就是要将我们需要抓取信息的网页原原本本的抓取下来.这个时候就要用到re ...
- Oracle数据库之日期函数
今天给大家介绍一下oracle数据中的日期函数的用法.废话不多说,我们看一下oracle给我们提供了那些函数? 1.sysdate 用途:获取当前系统时间. 2.to_date('字符类型','日期类 ...
- HTTP Debugger Pro安装教程
相关链接:HTTP Debugger Pro使用教程 安装步骤: 1.解压压缩包 2.双击运行安装文件 3.根据向导提示点击Next 4.选择接受协议,点击Next 5.选择高级模 ...
- 第16章-使用Spring MVC创建REST API
1 了解REST 1.1 REST的基础知识 REST与RPC几乎没有任何关系.RPC是面向服务的,并关注于行为和动作:而REST是面向资源的,强调描述应用程序的事物和名词. 为了理解REST是什么, ...