react-native flexbox布局属性

最近刚接触react-native，之前我从事iOS方面，接触到之后发现这两种语言编程方面还是有区别的，开始很不适应，而且国内目前关于react-native的详细介绍都很少，即使是官网也是泛泛而谈，还得自己不断摸索，通过翻墙的话，资源会丰富些。开始对于react-native的布局方式一直都很不理解，每个属性代表的含义是什么，都有区别，导致组件在布局上遇到阻碍，后来就好些了。好了，不扯淡了。至于marginTop,marginBottom等就不说了，谈谈几个常用重要属性的含义：

flex： 表示是否可以伸缩

flexDirection： 指定了主轴伸缩的方法 row 为水平column 为垂直

justifyContent： 定义伸缩组件沿主轴线的对齐方式flex-start、flex-end、center、space-between、space-around

alignItems： 该属性定义了伸缩项目在伸缩容器的交叉轴上的对齐方式flex-start、flex-end、center、baseline、stretch

alignContent：这个属性主要用来调整伸缩项目出现换行后在交叉轴上的对齐方式，类似伸缩项目在主轴上使用justifyContent

order：这个属性用于定义项目的排列顺序，数值越小，排列越靠前，默认值为0

alignSelf: 设置单独的伸缩项目在交叉上的对齐方式

padding: 距离边距的距离

PS：只要将这些重要的属性掌握了，react-native 布局这块你就掌握了。