【Facebook的UI开发框架React入门之八】Image的使用简单介绍(iOS平台)-goodmao
var styles = StyleSheet.create({
container: {
//flex: 1, flexDirection: 'row', position: 'absolute',
top: 100,
left: 10, justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
}, size: {
width: 100,
height: 150,
},
});
注意:须要设置flex属性为0或者使用默认值。否则flex:1,则图片会被拉伸。
var HelloReact = React.createClass({ //设置视图Image
render: function() {
return (
<View style = {styles.container}>
<Image
style = {styles.size}
source = {require('image!1')} //1.Images.xcassets图片
/> <Image
style = {styles.size}
source = {require('image!2')} //2.Xcode中直接加入Images路径和图片
/>
</View>
);
}
});
var HelloReact = React.createClass({ //创建组件类 //组件的渲染方法
//设置视图Image
render: function() {
return (
<View style = {styles.container}>
<Image
source = {{uri: 'http://172.16.105.149:8081/server-image/goodmao.jpg'}} //3.网络图
style = {styles.size}
/>
</View>
);
}
});
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvbWFveWluZ3lvbmc=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="">
【Facebook的UI开发框架React入门之八】Image的使用简单介绍(iOS平台)-goodmao的更多相关文章
- 【Facebook的UI开发框架React入门之九】button简单介绍(iOS平台)-goodmao
--------------------------------------------------------------------------------------------------- ...
- 文顶顶 iOS开发UI篇—UITabBarController简单介绍 iOS开发UI篇—UITabBarController简单介绍
一.简单介绍 UITabBarController和UINavigationController类似,UITabBarController也可以轻松地管理多个控制器,轻松完成控制器之间的切换,典型的例 ...
- 《R语言入门》语言及环境简单介绍
简单介绍 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/diss ...
- apicloud入门学习笔记1:简单介绍
官网地址:https://www.apicloud.com/ 新手开发指南:https://docs.apicloud.com/APICloud/junior-develop-guide 开发语言:H ...
- 基于React 的前端UI开发框架 及与Electron 的结合 https://cxjs.io/
1.cxjs 基于React 的前端UI开发框架 https://cxjs.io/ coreu http://coreui.io/ 2.antd-admin ...
- React 入门实例教程
现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Native 发布,结果一天之内,就获得了 5000 颗星,受瞩目程度可见一斑. React 起源于 Face ...
- React入门 (1)—使用指南(包括ES5和ES6对比)
前言 本篇会简明扼要的介绍一下React的使用方法.代码会用JSX+ES5和JSX+ES6两种方式实现. React简介 React来自Facebook,于2013年开源.至今不断修改完善,现在已经到 ...
- 2015年最热门前端框架React 入门实例教程
现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Native 发布,结果一天之内,就获得了 5000 颗星,受瞩目程度可见一斑. React 起源于 Face ...
- react 入门教程 阮一峰老师真的是榜样
- 转自阮一峰老师博客 React 入门实例教程 作者: 阮一峰 日期: 2015年3月31日 现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Nati ...
随机推荐
- Visual Studio中Radio Button组绑定变量方法(DDX_Radio方法)
需求描述:Visual Studio 创建的界面程序中又许多 Radio Button,希望这些所有的Radio Button统一绑定到一个变量上,这个变量一旦改变,Radio Button的选中状态 ...
- 通俗理解 模糊自适应PID
模糊自适应PID算法就是在经典的PID的基础上添加模糊控制规则库,建立这个库的目的就是算法能够自己来进行改变P.I.D的值. 就拿温度的上升过程控制来说,刚开始的时候,希望温度能够快速的升到终点温度, ...
- 暑假集训 || LCA && RMQ
LCA定义为对于一颗树 树上两个点的最近公共祖先 一.Tarjan求LCA(离线方法 https://blog.csdn.net/lw277232240/article/details/7701751 ...
- ssh 带密码私钥 输入密码
$ssh-agent bash $ssh-add -k ~/.ssh/id_rsa Enter passphrase for /home/ubuntu/.ssh/id_rsa: Identity ad ...
- linux下vi修改文件用法
进入vi的命令 vi filename :打开或新建文件,并将光标置于第一行首 vi +n filename :打开文件,并将光标置于第n行首 vi + filename :打开文件,并将光标置于最后 ...
- pc端移动端兼容的大图轮播
body, html { width: 100%; } * { margin:; padding:; list-style: none; } .haha { list-style-type: none ...
- <Spring Cloud>入门二 Eureka Client
1.搭建一个通用工程 1.1 pom 文件 <?xml version="1.0" encoding="UTF-8"?> <project x ...
- MVC Remote属性验证
模型验证方式一: 1.需要添加引用: using System.Web.Mvc; 2.在模型属性上添加验证: [Remote("CheckIsHaveSerialNo", &quo ...
- 【02】koala编译中文出错(已放弃不用)
http://koala-app.com/index-zh.html koala 下载地址. sass.中文编译出错: 打开 Koala文件夹位置->rubygems->gems- ...
- laravel 文件删除
删除文件 <?php class demo{ public function del(){ $disk = Storage::disk('public');//获取磁盘实例 $disk-> ...