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小笔记的更多相关文章

  1. react-native学习笔记--史上最详细Windows版本搭建安装React Native环境配置

    参考:http://www.lcode.org/react-native/ React native中文网:http://reactnative.cn/docs/0.23/android-setup. ...

  2. 转:【iOS开发每日小笔记(十一)】iOS8更新留下的“坑” NSAttributedString设置下划线 NSUnderlineStyleAttributeName 属性必须为NSNumber

    http://www.bubuko.com/infodetail-382485.html 标签:des   class   style   代码   html   使用   问题   文件   数据 ...

  3. 小笔记:Timer定时间隔时间操作

    小笔记:Timer定时间隔时间操作,后面有时间再补充和完善: public class TimingSvc { /// <summary> /// 定时器,执行定时任务 /// </ ...

  4. 关于 linux中TCP数据包(SKB)序列号的小笔记

    关于  SKB序列号的小笔记 为了修改TCP协议,现在遇到了要改动tcp分组的序列号,但是只是在tcp_sendmsg函数中找到了SKB的end_seq  一直没有找到seq 不清楚在那里初始化了,就 ...

  5. Linux下postgres9.4 版本的单机版安装小笔记

    1.添加RPMyum install https://download.postgresql.org/pub/repos/yum/9.4/redhat/rhel-7-x86_64/pgdg-redha ...

  6. 深入剖析Nginx一点小笔记

    前几天在图书馆看书,恰好看到这本<深入剖析nginx>,花了快一周的时间看完了这本书,写点笔记心得便于以后复习. 以前对nginx的认识就只是停留在一个反向代理服务器上.百度了一下ngin ...

  7. react-native学习笔记——简单尝试

    毫无疑问,我是个不善于写博文的人. 毫无疑问,react是个出的框架. 毫无疑问,react-native更是个牛逼的引擎. 我个人对react-native的理解就是js被js引擎编译,去调用本地语 ...

  8. ReactNative开发笔记(持续更新...)

    本文均为RN开发过程中遇到的问题.坑点的分析及解决方案,各问题点之间无关联,希望能帮助读者少走弯路,持续更新中... (2019年3月29日更新) 原文链接:http://www.kovli.com/ ...

  9. react-native学习笔记--首次安装apk到小米5报错

    本文直接引用大神文档: [WINDOWS环境 React Native初识]com.android.ddmlib.InstallException: Failed to establish sessi ...

随机推荐

  1. Atitit 数据库 标准库  sdk 函数库 编程语言 mysql oracle  attilax总结

    Atitit 数据库 标准库  sdk 函数库 编程语言 mysql oracle  attilax总结 1.1. 常见的编程语言以及数据库 sql内部函数库标准化库一般有以下api1 1.2. 各个 ...

  2. Source Insight 常用设置

    1.背景色选择 要改变背景色Options->preference->windows background->color设置背景色2.解决字符等宽对齐问题    SIS默认字体是VE ...

  3. Android查询不到电话号码解决方法

    貌似联系人有三个数据库,且不同步,另外也有可能是版本问题. 解决方案:https://github.com/codinguser/android_contact_picker 接下来会对其进行一些改造 ...

  4. 《软件测试自动化之道》读书笔记 之 XML测试

    <软件测试自动化之道>读书笔记 之 XML测试 2014-10-07 待测程序测试程序  通过XmlTextReader解析XML  通过XmlDocument解析XML  通过XmlPa ...

  5. 【iCore4 双核心板_FPGA】例程九:锁相环实验——锁相环使用

    实验现象: 利用Quartus内部组件生成锁相环,用SignalTap II进行校验. 核心代码: module pll( input clk_25m, output clk_100m, output ...

  6. stm32+rx8025

    // 设备读写地址 #define        RX8025_ADDR_READ                0x65 #define        RX8025_ADDR_WRITE       ...

  7. Mysql系列五:数据库分库分表中间件mycat的安装和mycat配置详解

    一.mycat的安装 环境准备:准备一台虚拟机192.168.152.128 1. 下载mycat cd /softwarewget http:-linux.tar.gz 2. 解压mycat tar ...

  8. Scala学习笔记(二):object、伴生对象和基本类

    object object 是只有一个实例的类.它的定义与Java中的class类似,如: // 单例对象 object AppEntry { def main(args: Array[String] ...

  9. 一个Login页面全面了解session与cookie

    背景 做了四年的前端开发,对外一直说自己是web开发,那么身为一个web开发怎能不知道session与cookie以及其管理方式呢~ Login涉及技术栈:Nodejs,MongoDB,Express ...

  10. [Artoolkit] Marker Training

    Link: Documentation About the Traditional Template Square Marker Limitations (重要) Traditional Templa ...