Android流式布局 流式选项卡

Android流式布局 流式选项卡

直接上图看效果：

源码：

/**
 * 
 * 流式布局
 * 
 * @author jason
 *
 */
@SuppressLint("DrawAllocation")
public class PushViewGroup extends ViewGroup {
	
	List<List<View>> allViewList=new ArrayList<List<View>>();//所有子view
	List<Integer> mHeightIntegers=new ArrayList<Integer>();//每行高度
	

	public PushViewGroup(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
	}

	public PushViewGroup(Context context, AttributeSet attrs) {
		super(context, attrs,0);
	}

	public PushViewGroup(Context context) {
		super(context,null);
	}
	
	@Override
	protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
		super.onMeasure(widthMeasureSpec, heightMeasureSpec);
		
		int sizeWidth = MeasureSpec.getSize(widthMeasureSpec);
		int modelWidth = MeasureSpec.getMode(widthMeasureSpec);
		
		int sizeHeight = MeasureSpec.getSize(heightMeasureSpec);
		int modelHeight = MeasureSpec.getMode(heightMeasureSpec);
		
		int width = 0;
		int height = 0;
		
		int lineWidth = 0;
		int lineHeight = 0;
		
		for (int i = 0; i < getChildCount(); i++) {
			
			View child = getChildAt(i);
			measureChild(child, widthMeasureSpec, heightMeasureSpec);
			MarginLayoutParams marginLayoutParams=(MarginLayoutParams)child.getLayoutParams();
			int childWidth = child.getMeasuredWidth()+marginLayoutParams.leftMargin+marginLayoutParams.rightMargin;
			int childHeight = child.getMeasuredHeight()+marginLayoutParams.topMargin+marginLayoutParams.bottomMargin;
			// change line 
			if (childWidth+lineWidth>sizeWidth) {
				width = Math.max(lineWidth, width);
				lineWidth = childWidth;
				height += lineHeight;
				lineHeight = childHeight;
			} else {
				lineWidth += childWidth;
				lineHeight = Math.max(lineHeight, childHeight);
			}
			// last view 
			if (i== getChildCount()-1) {
				width = Math.max(width, lineWidth);
				height += lineHeight;
			}
		}
		//实现计算后的控件大小
		setMeasuredDimension(modelWidth==MeasureSpec.EXACTLY ? sizeWidth : width, modelHeight==MeasureSpec.EXACTLY? sizeHeight : height);
		
		
	}


	@Override
	protected void onLayout(boolean arg0, int arg1, int arg2, int arg3, int arg4) {
		allViewList.clear();
		mHeightIntegers.clear();
		
		int width = getWidth();
		int lineWidth = 0;
		int lineHeight =0;
		List<View> lineViews=new ArrayList<View>();
		for (int i = 0; i < getChildCount(); i++) {
			View child=getChildAt(i);
			MarginLayoutParams marginLayoutParams=(MarginLayoutParams)child.getLayoutParams();
			int viewWidth = child.getMeasuredWidth();
			int viewHeight = child.getMeasuredHeight();
			// change line
			if (lineWidth+viewWidth + marginLayoutParams.leftMargin+marginLayoutParams.rightMargin>width) {
				mHeightIntegers.add(lineHeight);
				allViewList.add(lineViews);
				lineWidth=0;
				lineHeight = viewHeight+marginLayoutParams.topMargin+marginLayoutParams.bottomMargin;
				lineViews=new ArrayList<View>();
			}
			lineWidth+=viewWidth+marginLayoutParams.leftMargin+marginLayoutParams.rightMargin;
			lineHeight=Math.max(lineHeight, viewHeight+marginLayoutParams.topMargin+marginLayoutParams.bottomMargin);
			lineViews.add(child);
		}
		//最后一个view
		mHeightIntegers.add(lineHeight);
		allViewList.add(lineViews);
		
		//实现布局
		int left = 0;
		int top = 0;
		for (int i = 0; i < allViewList.size(); i++) {
			lineViews=allViewList.get(i);
			lineHeight = mHeightIntegers.get(i);
			for (int j = 0; j < lineViews.size(); j++) {
				View child = lineViews.get(j);
				if (child.getVisibility()==View.GONE) {
					continue;
				}
				MarginLayoutParams marginLayoutParams=(MarginLayoutParams) child.getLayoutParams();
				int cleft = left+marginLayoutParams.leftMargin;
				int ctop = top+marginLayoutParams.topMargin;
				int cright = cleft+child.getMeasuredWidth();
				int cbottom = ctop+child.getMeasuredHeight();
				//实现ziview布局
				child.layout(cleft, ctop, cright, cbottom);
				left +=child.getMeasuredWidth()+marginLayoutParams.leftMargin+marginLayoutParams.rightMargin;
			}
			left=0;
			top+=lineHeight;
		}
		
		
	}
	
	@Override
	public LayoutParams generateLayoutParams(AttributeSet attrs) {
		return new MarginLayoutParams(getContext(), attrs);
	}

}

使用代码：

<cn.com.bailian.bailianmobile.page.mallcommoditydetailv3.widget.PushViewGroup
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        
        <Button 
            android:text="@string/accessibility_date_picker_month"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <Button 
            android:text="@string/accessibility_date_picker_week"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <Button 
            android:text="@string/yes_use"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <Button 
            android:text="@string/wifi_type_label"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <Button 
            android:text="@string/app_search"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <Button 
            android:text="@string/appraisal_tab3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <Button 
            android:text="@string/xwalk_cancel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <Button 
            android:text="@string/time_picker_dialog_minute_second_separator"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <Button 
            android:text="@string/accessibility_date_picker_month"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        
        <Button 
            android:text="@string/accessibility_date_picker_month"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <Button 
            android:text="@string/accessibility_date_picker_week"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <Button 
            android:text="@string/yes_use"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <Button 
            android:text="@string/wifi_type_label"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <Button 
            android:text="@string/app_search"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <Button 
            android:text="@string/appraisal_tab3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <Button 
            android:text="@string/xwalk_cancel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <Button 
            android:text="@string/time_picker_dialog_minute_second_separator"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <Button 
            android:text="@string/accessibility_date_picker_month"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        
    </cn.com.bailian.bailianmobile.page.mallcommoditydetailv3.widget.PushViewGroup>