这段时间一直忙于工作，最近终于有时间休息下了，然后总想写点什么发现不知道写什么。苦思之后，想到我之前的一个遗憾，那就Google新推出的盒子布局，我想我应该写点什么了。
说明:
FlexboxLayout是google官方开源的一个可以简单快速创建具有弹性功能的流式布局，它的目的是使用我们常见的布局模式，帮我们很好的实现UI区域的比例划分，比如三列布局，可以非常简单的实现。它支持非常多的属性设置，用起来很简单。
Android studio使用配置如下：
dependencies { compile 'com.google.android:flexbox:0.3.0' }
使用方式如下XML：
介绍说明：FlexboxLayout集成子ViewGroup，类似LinearLayout 和RelativeLayout.可以直接在xml中设置需要指定的属性。
<com.google.android.flexbox.FlexboxLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" app:flexWrap="wrap" app:alignItems="stretch" app:alignContent="stretch" > <TextView android:id="@+id/textview1" android:layout_width="120dp" android:layout_height="80dp" app:layout_flexBasisPercent="50%" /> <TextView android:id="@+id/textview2" android:layout_width="80dp" android:layout_height="80dp" app:layout_alignSelf="center" /> <TextView android:id="@+id/textview3" android:layout_width="160dp" android:layout_height="80dp" app:layout_alignSelf="flex_end" /> </com.google.android.flexbox.FlexboxLayout>
或者使用另一种方式，在代码中设置对应的属性值，如下图
FlexboxLayout flexboxLayout = (FlexboxLayout) findViewById(R.id.flexbox_layout); flexboxLayout.setFlexDirection(FlexDirection.ROW); View view = flexboxLayout.getChildAt(0); FlexboxLayout.LayoutParams lp = (FlexboxLayout.LayoutParams) view.getLayoutParams(); lp.order = -1; lp.flexGrow = 2; view.setLayoutParams(lp);
属性介绍如下:
1、flexDirection
该属性决定了盒子布局主轴方向类似线性布局方向。
允许的值如下：
row(default) 默认按照行的排列方式(水平方向)
row_reverse 按照行的反向排列(倒序)
column 列排列方式(竖直方向)
column_reverse 列的反向排列方式(倒序)
效果参考官方gif图：
2、flexWrap
该属性决定盒子模型是单行显示还是多行显示
允许的值如下：
nowrap(default) 不换行
wrap 换行
wrap_reverse 换行(倒序排列)
效果参考官方gif图：
3、justifyContent
主轴排列方向(跟flex的方向来决定)
允许的值如下：
flex_start(default) 左对齐
flex_end 右对齐
center 居中对齐
space_between 剩余空间等间隙均分排列(不包括两端)
space_around 剩余空间等间隙均分排列(包括两端)
效果参考官方gif图：
4、alignItems
该属性决定主轴的交叉轴中所有view的排列方式。
允许的值如下：
strech(default) 填充列的高度(假设主轴方向是row)
flex_start 对齐列的顶端(假设主轴方向是row)
flex_end 对齐列的低端 (假设主轴方向是row)
center 居中对齐
baseline 对齐基准线
效果参考官方gif图：
5、alignContent
该属性决定交叉轴列的排列方式(在交叉轴为多行/列时才有效)
允许的值如下：
strech(default) 交叉轴的高度/宽度
flex_start 交叉轴排列方式对齐顶端从上而下无间隙排列(假设主轴方向是row)
flex_end 交叉轴排列方式对齐底端从上而下无间隙排列(假设主轴方向是row)
center 交叉轴排列方式居中对齐无间隙排列(假设主轴方向是row)
space_between 交叉轴排列方式对齐顶端和低端中间部分等分剩余空间
space_around 交叉轴排列方式所有列等分剩余空间
效果参考官方gif图：
6、showDividerHorizontal
该属性决定水平分割线
允许的值如下(允许键入多个值)：
none 无
beginning 开始位置
middle 中间位置
end 结束位置
7、showDividerVertical
该属性等同showDividerHorizontal,不同在于竖直方向.
8、showDivider
该属性等同showDividerHorizontal和showDividerVertical,不同在于包含两者.
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
盒子布局中item属性定义
9、layout_order
该属性决定item位置，默认是1，该值越大显示越靠后.(必须是整数)
效果参考官方gif图：
10、layout_flexGrow
类似线性布局权重，填充剩余空间。(可以为整数和小数)
效果参考官方gif图：
11、layout_flexShrink
该属性决定当行内收缩比例，当一行内元素宽度一定，缩小宽度时，所有view水平压缩比。（默认是1，等比压缩，0表示不压缩）
效果参考官方gif图：
12、layout_alignSelf
该属性决定单个item的对齐方式,只有当交叉轴的高度大于item高度时才有效果(alignContent属性).用于重载alignItems效果.
alignContent属性：
strech 有效果
align_start 需要调整对齐方式的item的高度小于交叉轴高度则有效果
align_end 需要调整对齐方式的item的高度小于交叉轴高度则有效果
center 需要调整对齐方式的item的高度小于交叉轴高度则有效果
space_around 需要调整对齐方式的item的高度小于交叉轴高度则有效果
space_between 需要调整对齐方式的item的高度小于交叉轴高度则有效果
允许的值如下：
auto(default) 由alignItems来决定
strech 填充列的高度(假设主轴方向是row)
flex_start 对齐列的顶端(假设主轴方向是row)
flex_end 对齐列的低端 (假设主轴方向是row)
center 居中对齐
baseline 对齐基准线
效果参考官方git图：
13、layout_minWidth / layout_minHeight
设置最小宽度和最大高度，允许缩放的最小值。
效果参考官方gif图：
14、layout_maxWidth / layout_maxHeight
设置最大宽度和最大高度，允许缩放的最大值。
效果参考官方gif图：
15、layout_wrapBefore
该属性控制在该item前增加换行操作，boolean值，默认false。
效果参考官方gif图：
更多关于盒子模型可参考github官方教程
https://github.com/google/flexbox-layout