美文网首页
自定义流式布局

自定义流式布局

作者: 破晓11 | 来源:发表于2021-10-09 17:30 被阅读0次

1.继承ViewGroup

2.在onMeasure时,先测量子View,再测量自己,保存自己的所有的View和高度

使用measureChild(child,widthMeasureSpec,heightMeasureSpec);测量子view,获取子View的宽高

3.layout的时候,取出保存的View,进行遍历,给每个view进行layout。显示再屏幕的位置上面

定义三个变量

List<View> lineViews;//保存每一行的子View

List<Integer> mHeight;//保存每一行最高的View的高度

List<List<View>> views;//所有的行,一行一行的存储

在onMeasure方法中测量每个子View的宽高

protected void onMeasure(int widthMeasureSpec,int heightMeasureSpec) {

int widhtSize = MeasureSpec.getSize(widthMeasureSpec);//获取父View的宽度

//记录当前这一行的VIew的宽度和高度

int lineWidht = 0;//当前这一行所有子View的宽度之和

int lineHeight = 0;// 当前这一行最高的View的高度

//记录流式布局的高度和宽度

int flowLayoutWidht =0-getPaddingLeft()-getPaddingRight();//所有行宽度的最大值

int flowLayoutHeight =getPaddingTop()+getPaddingBottom();//所有行高度相加

init();

int count = getChildCount();

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

View child =  getChildAt(i);

measureChild(child,widthMeasureSpec,heightMeasureSpec);//测量View的宽高

MarginLayoutParams marginLayoutParams = (MarginLayoutParams) child.getLayoutParams();

//获得当前子View的宽度和高度

int childWidht = child.getMeasuredWidth()+marginLayoutParams.leftMargin+marginLayoutParams.rightMargin;

int childHeight  = child.getMeasuredHeight()+marginLayoutParams.topMargin+marginLayoutParams.bottomMargin;

//获得当前子View的宽度和高度

int childWidht = child.getMeasuredWidth();

int childHeight  = child.getMeasuredHeight();

//已经放入的view的宽度+将要放入View的宽度之和大于 当前布局的宽度,就要换行

if(lineWidht +childWidht >widhtSize ){

views.add(lineViews);

lineViews = new ArrayList<>();

//获取一行中最宽的一行作为流式布局的宽度

flowlayoutWidht  = Math.max(flowlayoutWidht ,lineWidht );

flowlayoutHeight = flowlayoutHeight + lineHeight;

mHeight.add(lineHeight);

}

lineViews.add(child);

lineWidht = lineWidht +childWidht;

lineHeight = Math.max(lineHeight,childHeight);

//添加最后一个子view时

if (count-1==i){

lineViews.add(child);

flowLayoutWidht = Math.max(childWidht,flowLayoutWidht);

flowLayoutHeight = flowLayoutHeight + childHeight;

mHeight.add(childHeight);

}

}

//设置ViewGroup的宽高

setMeasuredDimension(flowLayoutWidht,flowLayoutHeight);

}

//对子view进行布局

protected void onLayout(boolean changed,int l,int t,int r,int b){

int curX = getPaddingLeft(),curY = getPaddingTop();

for (int i =0; i <views.size();i++)

int height =mHeight.get(i);//获取一行的高度

List linesView =views.get(i);

int lineViewSize  = linesView.size();

//处理每一行中的View

for (int i1 =0; i1 < lineViewSize; i1++) {

View view = linesView.get(i1);
MarginLayoutParams marginLayoutParams = (MarginLayoutParams) view.getLayoutParams();

int left = curX+marginLayoutParams.leftMargin;

int top = curY+marginLayoutParams.topMargin;

int right = left + view.getMeasuredWidth();

int bottom = top +view.getMeasuredHeight();

view.layout(left,top,right,bottom);

curX = curX + view.getMeasuredWidth()+marginLayoutParams.leftMargin+marginLayoutParams.rightMargin;

}

curY  = curY+height;

curX = getPaddingLeft();

}

}

相关文章

网友评论

      本文标题:自定义流式布局

      本文链接:https://www.haomeiwen.com/subject/jwwqoltx.html