重点:

  1】react native 下的弹性布局名字叫:flexDirection

  2】flexDirection的默认值是column而不是row,而flex也只能指定一个数字值。

  3】使用flexDirectionalignItems和 justifyContent三个样式属性就已经能满足大多数布局需求

  

  在React-Navive中使用flexbox,目前只支持以下几种属性:

   1.alignItems:item在交叉轴上的对齐方式

    alignItems:flex-start | flex-end | center | stretch

 

   2.alignSelf:设置item自己在交叉轴上的对齐方式,会覆盖默认的对齐方式

    alignSelf: auto | flex-start | flex-end | center | stretch

 

     3.flex

 

    4.flexDirection:定义主轴线的方向

    flexDirection:row | column(default)

 

   5.flexWrap:是否换行

    flexWrap:wrap | nowrap

 

  6.justifyContent:item在主轴线的对齐方式

    justifyContent:flex-start | flex-end | center | space-between | space-around

 

  在线调试弹性布局的网站:https://panw3i.gitee.io/flex/

posted on 2018-03-14 15:32  不愿意透露姓名的何先生  阅读(199)  评论(0编辑  收藏  举报