最近刚接触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 布局这块你就掌握了。