Android简单实现自定义流式布局的方法

概述本文实例讲述了Android简单实现自定义流式布局的方法。分享给大家供大家参考，具体如下：

本文实例讲述了AndroID简单实现自定义流式布局的方法。分享给大家供大家参考，具体如下：

首先来看一下 手淘HD - 商品详情 - 选择商品属性 页面的UI

商品有很多尺码，而且展现每个尺码所需要的VIEw的大小也不同（主要是宽度），所以在从服务器端拉到数据之前，展现所有尺码所需要的行数和每一行的个数都无法确定，因此不能直接使用GrIDVIEw或ListVIEw。

如果使用linearLayout呢？

一个linearLayout只能显示一行，如果要展示多行，则每一行都要new一个linearLayout出来，而且还必须要计算出每一个linearLayout能容纳多少个尺码对应的VIEw，实现起来也会比较复杂。

其实要实现这个功能，只需要借鉴一下CSS3的flex-box 就可以了。

要实现一个AndroID版本的flexBox，原理非常简单，为了与AndroID的命名规范保持一致，我们称之为FlowLayout。

1. 首先新建一个FlowLayout类，继承自VIEwGroup
2. 在onMeasure中根据 child vIEws 计算出FlowLayout高度
3. 在onLayout中对child vIEws 的进行布局（layout）

下面只列出了最核心的代码片段，完整代码已经放到Github上－AndroIDFlowLayout，欢迎fork。

在onMeasure中计算FlowLayout的高度

// 遍历所有的子VIEwfor (int i = 0,childCount = getChildCount(); i < childCount; ++i) {  VIEw childVIEw = getChildAt(i);  // measure子VIEw，并获取它的宽度和高度  LayoutParams childLayoutParams = childVIEw.getLayoutParams();  childVIEw.measure(      getChildMeasureSpec(wIDthMeasureSpec,paddingleft + paddingRight,childLayoutParams.wIDth),getChildMeasureSpec(heightmeasureSpec,paddingtop + paddingBottom,childLayoutParams.height));  int chilDWIDth = childVIEw.getMeasureDWIDth();  int childHeight = childVIEw.getMeasuredHeight();  // 计算当前行的高度（当前行所有子VIEw中最高的那个）  lineHeight = Math.max(childHeight,lineHeight);  // 把当前child vIEw放到上一个child vIEw的右边，如果放不下，则换行  if (childleft + chilDWIDth + paddingRight > myWIDth) {    childleft = paddingleft;    childtop += mVerticalSpacing + lineHeight;    lineHeight = childHeight;  } else {    childleft += chilDWIDth + mHorizontalSpacing;  }}int wantedHeight = childtop + lineHeight + paddingBottom;// 计算FlowLayout所需要高度setMeasuredDimension(myWIDth,resolveSize(wantedHeight,heightmeasureSpec));

在onLayout中对child vIEws进行布局

代码与onMeasure非常类似，只需要根据child vIEw的宽度和高度放到指定位置即可。

for (int i = 0,childCount = getChildCount(); i < childCount; ++i) {  VIEw childVIEw = getChildAt(i);  if (childVIEw.getVisibility() == VIEw.GONE) {    continue;  }  int chilDWIDth = childVIEw.getMeasureDWIDth();  int childHeight = childVIEw.getMeasuredHeight();  lineHeight = Math.max(childHeight,lineHeight);  if (childleft + chilDWIDth + paddingRight > myWIDth) {    childleft = paddingleft;    childtop += mVerticalSpacing + lineHeight;    lineHeight = childHeight;  }  // 关键代码  childVIEw.layout(childleft,childtop,childleft + chilDWIDth,childtop + childHeight);  childleft += chilDWIDth + mHorizontalSpacing;}

完整版代码已经放到Github－FlowLayout，打出来的aar包已经上传到了bintray，使用方式非常简单，只需要在项目（project）对应的build.gradle中添加一条dependency即可。

compile 'com.liangfeizc:flowlayout:1.0.0@aar'

把aar包上传到 jCenter

具体做法可参考 publishing gradle android library to jcenter
打包脚本可参考 flowlayout/build.gradle

更多关于AndroID相关内容感兴趣的读者可查看本站专题：《Android布局layout技巧总结》、《Android视图View技巧总结》、《Android *** 作XML数据技巧总结》、《Android编程之activity *** 作技巧总结》、《Android资源 *** 作技巧汇总》、《Android文件 *** 作技巧汇总》、《Android *** 作SQLite数据库技巧总结》、《Android *** 作json格式数据技巧总结》、《Android数据库 *** 作技巧总结》、《Android编程开发之SD卡 *** 作方法汇总》、《Android开发入门与进阶教程》及《Android控件用法总结》

希望本文所述对大家AndroID程序设计有所帮助。

总结

以上是内存溢出为你收集整理的Android简单实现自定义流式布局的方法全部内容，希望文章能够帮你解决Android简单实现自定义流式布局的方法所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。