ReactNative小笔记
import React, { Component } from 'react';
import { AppRegistry, View } from 'react-native'; export default class AlignItemsBasics extends Component {
render() {
return (
// 尝试把`alignItems`改为`flex-start`看看
// 尝试把`justifyContent`改为`flex-end`看看
// 尝试把`flexDirection`改为`row`看看
<View style={{
flex: 1,
flexDirection: 'column',
justifyContent: 'center',
alignItems: 'stretch',
}}>
<View style={{
flex: 1,
flexDirection: 'row',
justifyContent: 'center',
alignItems: 'center',
}}>
<View style={{width: 50, height: 50, backgroundColor: 'red'}} />
<View style={{width: 50,height: 50, backgroundColor: 'blue'}} />
<View style={{width: 50,height: 100, backgroundColor: 'black'}} />
</View>
</View>
);
}
};
一个横向排列,一个竖向排列,子视图居中 https://reactnative.cn/docs/flexbox/
alignItems子视图对齐方式,例如:视图内容横向排列,则是标识竖向对齐方式
同一子视图的flex都设定值的话,子视图的宽高大小将按照此比例分配,不说明宽高情况下为auto自适应宽高
https://blog.csdn.net/u011468619/article/details/72781959 创建页面并绑定跳转
https://reactnative.cn/docs/using-a-listview/ 列表的书写FlatList SectionList
https://reactnative.cn/docs/network/ Fetch进行同步或异步网络请求上传等操作
https://www.jianshu.com/p/4c81995746ea 导航跳转相关
ReactNative小笔记的更多相关文章
- react-native学习笔记--史上最详细Windows版本搭建安装React Native环境配置
参考:http://www.lcode.org/react-native/ React native中文网:http://reactnative.cn/docs/0.23/android-setup. ...
- 转:【iOS开发每日小笔记(十一)】iOS8更新留下的“坑” NSAttributedString设置下划线 NSUnderlineStyleAttributeName 属性必须为NSNumber
http://www.bubuko.com/infodetail-382485.html 标签:des class style 代码 html 使用 问题 文件 数据 ...
- 小笔记:Timer定时间隔时间操作
小笔记:Timer定时间隔时间操作,后面有时间再补充和完善: public class TimingSvc { /// <summary> /// 定时器,执行定时任务 /// </ ...
- 关于 linux中TCP数据包(SKB)序列号的小笔记
关于 SKB序列号的小笔记 为了修改TCP协议,现在遇到了要改动tcp分组的序列号,但是只是在tcp_sendmsg函数中找到了SKB的end_seq 一直没有找到seq 不清楚在那里初始化了,就 ...
- Linux下postgres9.4 版本的单机版安装小笔记
1.添加RPMyum install https://download.postgresql.org/pub/repos/yum/9.4/redhat/rhel-7-x86_64/pgdg-redha ...
- 深入剖析Nginx一点小笔记
前几天在图书馆看书,恰好看到这本<深入剖析nginx>,花了快一周的时间看完了这本书,写点笔记心得便于以后复习. 以前对nginx的认识就只是停留在一个反向代理服务器上.百度了一下ngin ...
- react-native学习笔记——简单尝试
毫无疑问,我是个不善于写博文的人. 毫无疑问,react是个出的框架. 毫无疑问,react-native更是个牛逼的引擎. 我个人对react-native的理解就是js被js引擎编译,去调用本地语 ...
- ReactNative开发笔记(持续更新...)
本文均为RN开发过程中遇到的问题.坑点的分析及解决方案,各问题点之间无关联,希望能帮助读者少走弯路,持续更新中... (2019年3月29日更新) 原文链接:http://www.kovli.com/ ...
- react-native学习笔记--首次安装apk到小米5报错
本文直接引用大神文档: [WINDOWS环境 React Native初识]com.android.ddmlib.InstallException: Failed to establish sessi ...
随机推荐
- Docker 以 docker 方式运行 jenkins
https://testerhome.com/topics/5798 Docker 以 docker 方式运行 jenkins jmcn · 2016年08月26日 · 最后由 blueshark 回 ...
- js 学习
{% load static %} <!DOCTYPE html> <html lang="en"> <head> <meta chars ...
- Hexo NexT 博客与Github page 关联指南
上篇文章 Hexo 博客框架NexT主题搭建指南 我们已经在本地搭建好了Hexo博客框架NexT 主题的博客程序,但是这感觉还是远远不够. 我们还想把它部署到我们的Github上,让其他人可以看到我们 ...
- rsync用于数据迁移/备份的几个细节
上周我们的一个GitLab服务频繁出现web页面卡死问题,得重启虚拟机才可恢复,但重启之后没多久又会卡死.后来发现是虚拟机的磁盘大小超过了2T,而虚拟机管理那层的文件系统是ext3,最大单文件只能支持 ...
- 【iCore1S 双核心板_FPGA】例程十六:基于SPI的ARM与FPGA通信实验
实验现象: 核心代码: int main(void) { int i,n; ]; ]; HAL_Init(); system_clock.initialize(); led.initialize(); ...
- 微信mac版的bug 直接显示了消息原始数据
<msg> <voicemsg endflag="1" cancelflag="0" forwardflag="0" vo ...
- hdoj:2042
#include <iostream> using namespace std; int main() { int n,a; while (cin >> n) { while ...
- hdoj:2034
#include <iostream> #include <vector> #include<algorithm> //包含sort函数 using namespa ...
- 最全面的Spring-Boot-Cache使用与整合
一:Spring缓存抽象 Spring从3.1开始定义了org.springframework.cache.Cache和org.springframework.cache.CacheManager接口 ...
- 完全卸载MySQL
1.先停止mysql服务,cmd模式下输入net stop mysql; 或者在图形服务面板停止mysql服务 2.进入控制面板卸载mysql; 3.windows+R运行“regedit”文件,打开 ...