Android 自定义UI 实战 02 流式布局

最新推荐文章于 2024-05-03 06:31:21 发布

2401_84545908

最新推荐文章于 2024-05-03 06:31:21 发布

阅读量305

点赞数 5

分类专栏：程序员文章标签： android ui

本文链接：https://blog.csdn.net/2401_84545908/article/details/138297476

版权

程序员专栏收录该内容

173 篇文章 0 订阅

订阅专栏

android:layout_width=“wrap_content”

android:layout_height=“55dp”

android:text=“Hello hi …” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“match_parent”

android:text=“你是谁呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:layout_gravity=“bottom”

android:text=“人在他在，塔亡人亡” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“100dp”

android:text=“一行一个元素生活不止眼前的苟且，还有诗和远方大法师的打分sad发送到发送到发的发送到发送到第三方阿萨德佛挡杀佛但是” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“90dp”

android:text=“发电房” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“小麻小儿郎呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“Hello hi …” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“match_parent”

android:text=“11一行一个元素生活不止眼前的苟且，还有诗和远方大法师的打分sad发送到发送到发的发送到发送到第三方阿萨德佛挡杀佛但是” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“你是谁呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“85dp”

android:layout_gravity=“bottom”

android:text=“人在他在，塔亡人亡” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“生活不止眼前的苟且，还有诗和远方” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“发电房” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“小麻小儿郎呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“45dp”

android:text=“Hello hi …” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“你是谁呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:layout_gravity=“bottom”

android:text=“人在他在，塔亡人亡” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“75dp”

android:text=“生活不止眼前的苟且，还有诗和远方” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“发电房” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“小麻小儿郎呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“Hello hi …” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“你是谁呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“60dp”

android:layout_gravity=“bottom”

android:text=“人在他在，塔亡人亡” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“生活不止眼前的苟且，还有诗和远方” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“发电房” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“85dp”

android:text=“小麻小儿郎呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“Hello hi …” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“你是谁呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“100dp”

android:layout_gravity=“bottom”

android:text=“人在他在，塔亡人亡” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“生活不止眼前的苟且，还有诗和远方” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“发电房” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“小麻小儿郎呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“Hello hi …” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“你是谁呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“85dp”

android:layout_gravity=“bottom”

android:text=“人在他在，塔亡人亡” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“生活不止眼前的苟且，还有诗和远方” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“发电房” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“小麻小儿郎呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“Hello hi …” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“你是谁呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:layout_gravity=“bottom”

android:text=“人在他在，塔亡人亡” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“生活不止眼前的苟且，还有诗和远方” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“85dp”

android:text=“发电房” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“小麻小儿郎呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“Hello hi …” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“你是谁呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:layout_gravity=“bottom”

android:text=“人在他在，塔亡人亡” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“65dp”

android:text=“生活不止眼前的苟且，还有诗和远方” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“100dp”

android:text=“发电房” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“小麻小儿郎呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“75dp”

android:text=“Hello hi …” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“你是谁呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:layout_gravity=“bottom”

android:text=“人在他在，塔亡人亡” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“生活不止眼前的苟且，还有诗和远方” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“发电房” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“80dp”

android:text=“小麻小儿郎呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“Hello hi …” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“你是谁呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:layout_gravity=“bottom”

android:text=“人在他在，塔亡人亡” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“300dp”

android:text=“生活不止眼前的苟且，还有诗和远方” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“发电房” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“小麻小儿郎呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“Hello hi …” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“你是谁呀” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“65dp”

android:layout_gravity=“bottom”

android:text=“人在他在，塔亡人亡” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“生活不止眼前的苟且，还有诗和远方1” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“250dp”

android:text=“发电房” />

<Button

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“这是结束” />

</com.traveleasy.leaningui02.FlowLayout>

2、初始化存储

初始化三个数组，用于存储行数据，所有的行数据，行高

// 每一行的view

private List mLineView;

// 所有的行，一行一行的存储

private List<List> mViews;

// 每一行的高度

private List mHeights;

private void init() {

mLineView = new ArrayList<>();

mViews = new ArrayList<>();

mHeights = new ArrayList<>();

}

3、测量

重新 onMeasure() 方法，测量view 的属性

源码的解释，都在代码中，如下：

@Override

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

// 获取限制的值

int widthMode = MeasureSpec.getMode(widthMeasureSpec);

int widthSize = MeasureSpec.getSize(widthMeasureSpec);

int heightNode = MeasureSpec.getMode(heightMeasureSpec);

int heightSize = MeasureSpec.getSize(heightMeasureSpec);

// 记录当前行的宽度和高度

int lineWidth = 0; //宽度是当前行子view 宽度的和

int lineHeight = 0; //高度是当前行所有子view 中高度的最大值

// 整个流式布局的宽度和高度

int flowLayoutWidth = 0; // 所有行中宽度的最大值

int flowLayoutHeight = 0; // 所有行的高度的累加

init();

// 获取到当前的所有child 数量

int childCount = this.getChildCount();

// 先测量子View，再根据子View 尺寸，计算自己的

for (int i = 0; i < childCount; i++) {

View child = this.getChildAt(i);

measureChild(child, widthMeasureSpec, heightMeasureSpec);

// 获取到当前子View 的测量高度和宽度

int childWidth = child.getMeasuredWidth();

int childHeight = child.getMeasuredHeight();

// 已经放入的子 view 的宽度 + 准备放入的子 view 的宽度大于总宽度，就换行

if (lineWidth + childWidth > widthSize) {

mViews.add(mLineViews);

// 创建新的一行

mLineViews = new ArrayList<>();

// 所有行中，最宽的一行，作为流式布局的宽

flowLayoutWidth = Math.max(flowLayoutWidth, lineWidth);

// 流式布局的高度，为所有行的高度相加

flowLayoutHeight += lineHeight;

mHeights.add(lineHeight);

lineHeight = 0;

lineWidth = 0;

}

// 当前行添加子view

mLineViews.add(child);

// 已有行宽，添加当前子 view 的宽

lineWidth += childWidth;

// 获取行中最高的子 View

lineHeight = Math.max(lineHeight, childHeight);

}

// 保存尺寸给后面使用

最后我想说

为什么很多程序员做不了架构师？
1、良好健康的职业规划很重要，但大多数人都忽略了
2、学习的习惯很重要，持之以恒才是正解。
3、编程思维没能提升一个台阶，局限在了编码，业务，没考虑过选型、扩展
4、身边没有好的架构师引导、培养。所处的圈子对程序员的成长影响巨大。

金九银十面试季，跳槽季，整理面试题已经成了我多年的习惯！在这里我和身边一些朋友特意整理了一份快速进阶为Android高级工程师的系统且全面的学习资料。涵盖了Android初级——Android高级架构师进阶必备的一些学习技能。

附上：我们之前因为秋招收集的二十套一二线互联网公司Android面试真题（含BAT、小米、华为、美团、滴滴）和我自己整理Android复习笔记（包含Android基础知识点、Android扩展知识点、Android源码解析、设计模式汇总、Gradle知识点、常见算法题汇总。）

里面包含不同方向的自学编程路线、面试题集合/面经、及系列技术文章等，资源持续更新中…

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化学习资料的朋友，可以戳这里获取

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

+= childWidth;

// 获取行中最高的子 View

lineHeight = Math.max(lineHeight, childHeight);

}

// 保存尺寸给后面使用

最后我想说

[外链图片转存中…(img-vdqgkZvG-1714329262240)]

里面包含不同方向的自学编程路线、面试题集合/面经、及系列技术文章等，资源持续更新中…

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化学习资料的朋友，可以戳这里获取

2401_84545908

关注

5
点赞
踩
7

收藏

觉得还不错? 一键收藏
0
评论
Android 自定义UI 实战 02 流式布局

为什么很多程序员做不了架构师？1、良好健康的职业规划很重要，但大多数人都忽略了2、学习的习惯很重要，持之以恒才是正解。3、编程思维没能提升一个台阶，局限在了编码，业务，没考虑过选型、扩展4、身边没有好的架构师引导、培养。所处的圈子对程序员的成长影响巨大。金九银十面试季，跳槽季，整理面试题已经成了我多年的习惯！在这里我和身边一些朋友特意整理了一份快速进阶为Android高级工程师的系统且全面的学习资料。涵盖了Android初级——Android高级架构师进阶必备的一些学习技能。
复制链接

扫一扫