React-native学习---No.1

justifyContent  和 alignItems

很多资料上的解释是 justifyContent 设置横向排列位置 ， alignItems 是设置纵向排列位置。

但是在实际操作中总结了一下，以下的总结似乎更为贴切：

justifyContent 设置与排布方向相同的排列位置，alignItems设置与排布方向相饭的排列位置。

一. 对于justifyContent：'center' 

当flexDirection的值为 row的时候，是水平方向居中

backgroundColor: 'gray',
 flexDirection: 'row', 
justifyContent: 'center'

当flexDirection的值为column的时候，是垂直方向居中

backgroundColor: 'gray',
 flexDirection: 'column', 

justifyContent: 'center'

二. 同样对于alignItems：'center' 

当flexDirection的值为 row的时候，是垂直方向居中

backgroundColor: 'gray',
 flexDirection: 'row', 

alignItems: 'center'

当flexDirection的值为column的时候，是水平方向居中

backgroundColor: 'gray',
 flexDirection: 'column', 

alignItems: 'center'