2017/07/06

React Native開發:Flexbox簡介

main axis:若是水平方向則左邊是main start,右邊是main end
(但main axis不一定是水平方向,透過設定flexDirection來決定)
cross axis:與垂直的軸。若是水平方向則上方是cross start,
下方是cross end

Flexbox屬性
容器屬性:包括flexDirection、flexWrap、alignItems、justifyContent
元素屬性:包括flex、alignSelf

其中,alignItems是指在cross axis上的對齊方式,可能的值有:
flex-start、flex-end、center、stretch

justifyContent是指在main axis上的對齊方式,可能的值有:
flex-start、flex-end、center、space-between、space-around

alignSelf可能的值有:
auto、flex-start、flex-end、center、stretch