美文网首页
根据扔物线大佬教程重写的TableLayout

根据扔物线大佬教程重写的TableLayout

作者: kongzue | 来源:发表于2020-03-25 14:54 被阅读0次

    需求及前情提要

    现有需求,按总宽度N等分,从左往右放置子布局,至最右处换下行继续,整体布局高度按照子布局高度逐级扩张。

    实际可用效果如图:


    demo.png

    之前有做一个版本 TableLayout 整齐堆叠宽度等分布局 但实际实现方式存在问题,先根据扔物线大佬的教程视频重做一版如下:

    /**
     * TableLayout 2.0
     * Author: @Kongzue
     * Github: https://github.com/kongzue/
     * Homepage: http://kongzue.com/
     * Mail: myzcxhh@live.cn
     * CreateTime: 2019/4/24 15:51
     */
    public class TableLayout extends ViewGroup {
        
        private int maxColumn = 2;
        private int itemMargin = 0;
        private int setChildHeight = dp2px(150);
        
        private Context context;
        
        public TableLayout(Context context) {
            super(context);
            this.context = context;
            loadAttrs(context, null);
        }
        
        public TableLayout(Context context, AttributeSet attrs) {
            super(context, attrs);
            this.context = context;
            
            loadAttrs(context, attrs);
        }
        
        public TableLayout(Context context, AttributeSet attrs, int defStyleAttr) {
            super(context, attrs, defStyleAttr);
            this.context = context;
            
            loadAttrs(context, attrs);
        }
        
        private void loadAttrs(Context context, AttributeSet attrs) {
            TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.TableLayout);
            
            itemMargin = typedArray.getDimensionPixelOffset(R.styleable.TableLayout_marginDp, 0);
            setChildHeight = typedArray.getDimensionPixelOffset(R.styleable.TableLayout_itemHeight, dp2px(150));
            maxColumn = typedArray.getInteger(R.styleable.TableLayout_column, 2);
            
            typedArray.recycle();
        }
        
        private List<View> items;
        private int newHeight = 0;
        
        private int[] childTop, childLeft, childRight, childBottom;
        
        @Override
        protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
            int maxWidth = resolveSize(Integer.MAX_VALUE, widthMeasureSpec) + itemMargin;
            int itemWidth = maxWidth / maxColumn - itemMargin;
            int itemHeight = resolveSize(setChildHeight, heightMeasureSpec);
            
            childTop = new int[getChildCount()];
            childLeft = new int[getChildCount()];
            childRight = new int[getChildCount()];
            childBottom = new int[getChildCount()];
            
            int l = 0, t = 0, r = 0, b = 0;
            
            items = new ArrayList<>();
            for (int i = 0; i < getChildCount(); i++) {
                View child = getChildAt(i);
                if (child.getVisibility() == VISIBLE) {
                    items.add(getChildAt(i));
                }
            }
            
            //调用每个子view的onMeasure测量子view
            for (int i = 0; i < items.size(); i++) {
                View child = items.get(i);
                //LayoutParams lp = child.getLayoutParams();
                
                int childWidthSpec = MeasureSpec.makeMeasureSpec(itemWidth, MeasureSpec.EXACTLY);
                int childHeightSpec = MeasureSpec.makeMeasureSpec(itemHeight, MeasureSpec.EXACTLY);
                
                if (i != 0 && i % maxColumn == 0) {
                    l = 0;
                    t = t + itemHeight + itemMargin;
                }
                r = l + itemWidth;
                b = t + itemHeight;
                
                childLeft[i] = l;
                childTop[i] = t;
                childRight[i] = r;
                childBottom[i] = b;
                
                l = l + itemWidth + itemMargin;
                newHeight = t + itemHeight;
                
                child.measure(childWidthSpec, childHeightSpec);
            }
            
            int mWidth = resolveSize(itemWidth, widthMeasureSpec);
            int mHeight = resolveSize(itemHeight, heightMeasureSpec);
            
            //setMeasuredDimension(mWidth, mHeight);
            
            //refreshViews(widthMeasureSpec, heightMeasureSpec);
            
            setMeasuredDimension(mWidth, newHeight);//设置宽高
        }
        
        @Override
        protected void onLayout(boolean changed, int l, int t, int r, int b) {
            for (int i = 0; i < items.size(); i++) {
                View child = items.get(i);
                child.layout(childLeft[i], childTop[i], childRight[i], childBottom[i]);
            }
        }
        
        @Override
        public void addView(View child) {
            super.addView(child);
        }
        
        @Override
        public void addView(View child, int index) {
            super.addView(child, index);
        }
        
        @Override
        public void addView(View child, int width, int height) {
            super.addView(child, width, height);
        }
        
        @Override
        public void addView(View child, LayoutParams params) {
            super.addView(child, params);
        }
        
        @Override
        public void addView(View child, int index, LayoutParams params) {
            super.addView(child, index, params);
        }
        
        @Override
        protected void onDraw(Canvas canvas) {
            super.onDraw(canvas);
        }
        
        private int dp2px(float dpValue) {
            return (int) (0.5f + dpValue * Resources.getSystem().getDisplayMetrics().density);
        }
        
        public int getMaxColumn() {
            return maxColumn;
        }
        
        public TableLayout setMaxColumn(int maxColumn) {
            this.maxColumn = maxColumn;
            return this;
        }
        
        public int getItemMargin() {
            return itemMargin;
        }
        
        public TableLayout setItemMargin(int itemMargin) {
            this.itemMargin = itemMargin;
            return this;
        }
        
        public int getItemHeight() {
            return setChildHeight;
        }
        
        public TableLayout setItemHeight(int itemHeight) {
            this.setChildHeight = itemHeight;
            return this;
        }
    }
    

    附录

    视频链接:
    扔物线大佬的《定制 Layout 的内部布局》:
    https://www.bilibili.com/video/BV1QW411t7op
    https://www.bilibili.com/video/BV1CW411q77t

    相关文章

      网友评论

          本文标题:根据扔物线大佬教程重写的TableLayout

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