react native 支持採用flex方式佈局。默認情況下如果不設置flex容器的寬度，那麼flex容器會100%自適應屏幕寬度。
學習flex佈局要明白兩個概念：主軸和交叉軸。所謂主軸即容器延伸方向，默認是row(橫向延伸)，此時與水平垂直的軸即爲交叉軸，反之亦然。
伸縮容器有以下六大屬性 ：
1.flexDirection(主軸方向,子元素在父容器中的排列位置)
flexDirection:row | row-reverse | column(默認) | column-reverse
2.flexWrap(子元素超出父容器時是否換行)
flexWrap:nowrap | wrap | wrap-reverse
3.justifyContent(主軸內容對齊方式)
justifyContent:flex-start(默認值) | flex-end | center | space-between | space-around
4.alignItems(交叉軸項目對齊方式)
alignItems:flex-start(默認) | flex-end | center | stretch
5.flex(flex-grow,flex-shrink,flex-basis的合體，默認0 1 auto)
a.flex-grow(元素擴展佔比,默認0，0不起作用，值越大擴展能力越強，表示在 item 總寬度比容器小的時候，爲了讓 item 填滿容器，每個 item 增加的寬度)
b.flex-shrink(元素的收縮能力，默認1,值越大收縮能力越大，shrink 表示在 item 總寬度比容器大的時候，爲了讓 item 填滿容器，每個 item 減少的寬度)
c.flex-basis(元素伸縮基準值 默認auto)
6.alignSelf(指定特定元素的對齊方式)
舉個例子，如果有一段文本要設置水平垂直居中，並且超出部分換行可以書寫爲
justifyContent:center;
alignItems：center;